Changing colors of Genesis Simple Share buttons?

[Tree78]

I got my buttons centered but I would like to change the colors of my Genesis Simple Share buttons to match the look of my site. I saw some code (which I have posted below) but it doesn't seem to be working for me. Anyone know what is wrong with my code or what I may be missing? I am using the parallax pro theme.

[Ginger]

Do you have a link to your site?

---

@gscoolidge | Support Nerd | Website Producer/Tweaker | IDX Integrations | Hosting Options

[Tree78]

Hi Ginger,

Yes, sorry about that. Here is the site.

http://mylogotree.net/

Here is a blog post

http://mylogotree.net/the-5-most-popular-types-of-logo-designs/

I want the buttons to be black, white and green but can't get that to work....

[Ginger]

Thanks! Some of those settings are different. In a case like this I go straight to the plugin css and copy what I need. Look in share.css in that plugin folder and start at line 249, then copy that whole chunk to the end to your style.css file. Next, change the color and background colors and after it's all looking good, you can combine them the way the github snippet did.

Hope that helps!

---

@gscoolidge | Support Nerd | Website Producer/Tweaker | IDX Integrations | Hosting Options

[Tree78]

Hi Ginger,

Thanks so much for the help. Just so I am clear... I copy from line 249 until the end of the share.css file into the style.css file? Then do I just change the color hexes from there and what not? Or do I need to then copy the original snippet of code I showed you in after all that?

I just want to make sure I do it right. Does the share.css code copied into the style.css take the place of the code I originally gave you? Thanks again in advance.

Jeremy

[Ginger]

Hi Jeremy,

Yep to your first two questions. You won't need the code snippet you originally shared since that would be duplicating your efforts and might un-do something you have already set. (the last CSS line in wins) My suggestion is have a closer look at the CSS and you'll see what entries effect what elements on the screen. In fact, you can experiment with your changes in your browser even before you make the permanent changes to your style.css file. This tutorial will help explain what I mean and provide a visual:

https://www.nutsandboltsmedia.com/how-to-customize-your-genesis-child-theme-with-chromes-inspector/

---

@gscoolidge | Support Nerd | Website Producer/Tweaker | IDX Integrations | Hosting Options

[Tree78]

Ginger,

Thank you very much, you have been very helpful. The video was perfect as were your instructions. I will jump on and make these changes. I appreciate your help.

Jeremy

[Author]

Posts