Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #11326


    Jetpack adds some nice sharing links to WordPress. However, with Abundance, seems like the icons do no display correctly. The following images describe the problem:

    Product Page:


    News Article:



    Hi hsaleem1,

    If you could provide a link to the site it would help in possibly providing a fix for the issue. While we can’t guarantee that all plugins (even jetpack) will work flawlessly with the theme, if we can provide a fix we will.




    I made some CSS tweaks to get the alignment correct. Still, you could observe the issues at the following pages: (Displayed correctly) (Displayed incorrectly)

    I added a couple of CSS modifiers to get the alignment correct, but the FB button still gets messed up. This happens only on product pages, the alignment on news pages is perfect.

    Another issue noticed is when the sharing buttons are not under a commone “Share” button. The vertical alignment is messed up, and they dont come under a centrally aligned axis.


    Hi hsaleem1,

    I’m not having any issues with the display of them when I visit the pages now. Glad you were able to fix the alignment issues and feel free to post your additions for anyone who may be trying to use the same plugin and looking for a fix as well.




    Somehow, the Facebook icon badge differs between the posts page and the product page.


    Hi hsaleem1,

    Looks like there’s a difference between the CSS for the two buttons. The one button has a background-position applied to it that I believe displays the “f” next to share. I suggest comparing the values in share-button-css then overwriting any settings in your custom.css.




    Actually, I checked the CSS code and the CSS classes “.FBConnectButton” and “.FBConnectButton_Small” are responsible for calling an external sprite from the FB server and displaying it in the background. Both of the pages have the exact same code, yet, the display is different. Below is the derived CSS dump:

    background-attachment: scroll;
    background-clip: border-box;
    background-color: #29447E;
    background-image: url(;
    background-origin: padding-box;
    background-position: 0% -232px;
    background-repeat: no-repeat;
    border-bottom-color: #666;
    border-bottom-style: none;
    border-bottom-width: 0px;
    color: #666;
    cursor: pointer;
    display: inline-block;
    float: none;
    font-family: ‘Expletus Sans’, sans-serif;
    font-size: 10px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    height: auto;
    line-height: 10px;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    outline-color: #666;
    outline-style: none;
    outline-width: 0px;
    overflow-x: visible;
    padding-bottom: 0px;
    padding-left: 1px;
    padding-right: 0px;
    padding-top: 0px;
    position: static;
    text-align: left;
    text-decoration: none;
    text-indent: 0px;
    width: auto;


    Hi hsaleem1,

    Try adding this to your custom.css or Quick CSS:

    .FBConnectButton .FBConnectButton_Text, .FBConnectButton_RTL .FBConnectButton_Text {
    padding: 2px 6px 4px !important;
    margin: 1px 1px 0 0 !important;



Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Problems with Jetpack/WordPress Core’ is closed to new replies.