styling shareaholic social media plugin

  • Hi all,

    So I am using the shareaholic social media plugin for my posts so people can share them.

    I am trying to create a background color behind the circle share buttons so that it looks like a row. Here is my site/example post:

    https://www.totemag.com/end-of-the-summer-soundtrack/

    However, as you can see, the share buttons sit half-way below the background color. I’ve used firebug and have tried to push up the share buttons using css but nothing I am doing is working.

    Would anyone have a solution?

    Thanks!

Viewing 11 replies - 1 through 11 (of 11 total)
  • .shareaholic-share-buttons-container .shareaholic-share-buttons-wrapper {
    display: block;
}

    View post on imgur.com

    Thread Starter ShelbyAnne

    (@shelbyanne)

    Ok I don’t know what you mean by that. The image you attached is what I had done just so it didn’t look messed up if someone were to check out the site. But the width of the bar of background color was too much. I try shortening the width and this is when I have the problem. If you want to take a look at the site now you’ll see my problem!

    Trying removing the height please ??

    Thread Starter ShelbyAnne

    (@shelbyanne)

    Okay so I removed the height and the icons fit into the background now but the background height is too tall. I wanted it so that it is tinier but the icons still fit inside of it. Is there a way to do that?

    First we would remove the background color and add it to:

    .shareaholic-share-buttons-container .shareaholic-share-buttons-wrapper {
    background-color: #f2f0f0;
}

    Now let’s add some width:

    .shareaholic-share-buttons-container .shareaholic-share-buttons-wrapper {
    background-color: #f2f0f0;
    width: 100%;
}

    and the last step is to remove the padding from the icons itself

    .shareaholic-share-buttons-container ul.shareaholic-share-buttons {
    padding: 0;
}

    Final results: https://i.imgur.com/IBBU7lx.png

    Thread Starter ShelbyAnne

    (@shelbyanne)

    The image you attached is exactly what I want!!!

    However, when I made the changes that you said, it still isn’t correct. Any other changes I should make?

    You missed the last one, the padding ??

    Thread Starter ShelbyAnne

    (@shelbyanne)

    Okay I removed the padding, still not the same! ??

    Still missing for some reason, please see: https://i.imgur.com/Kf6Mk9E.png

    Thread Starter ShelbyAnne

    (@shelbyanne)

    Hmmm, I tried adding !important to mine and it still didn’t work. Is it possible that there is css for the widget within the widget that I can’t access? Don’t know how I would fix it then.

    Anyone know how to customize colors of the shareaholic social icons?

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘styling shareaholic social media plugin’ is closed to new replies.