WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce ShareThis Integration
Facebook Like button text cropped / cut off (5 posts)

  1. vhblogsupport
    Member
    Posted 5 months ago #

    Hi Coen,

    Many thanks for this slick addition to Woocommerce.

    One small issue, after installing I notice that the Facebook like button text 'Be the first of your friends to like this.' is squashed / cut off.

    I can't seem to find the css element to widen the text box for this?
    Tried various things like:

    ._51mz {
    border-collapse: collapse;
    border-spacing: 0;
    min-width: 200px;
    }

    But no luck, hope you can help.
    I'm using the latest Woocommerce.

    Thanks Kevin

    https://wordpress.org/plugins/woocommerce-sharethis-integration/

  2. Secretaffiliate
    Member
    Posted 4 months ago #

    Same problem. Any solution?

  3. DBAR Productions
    Member
    Posted 4 months ago #

    Same problem here also.

  4. DBAR Productions
    Member
    Posted 4 months ago #

    The solution seems to be to go to the sharethis.com web site, login to your account, click on the Get Sharing at top, then skip step 1 since we already have the plugin... select your style and customize, then click "Get Code" and copy all the code that is just a bunch of spans and stick that into the ShareThis code in Woocommerce->settings->integration

    Remove any old facebook like button iframe script you had before.

  5. fuffkin
    Member
    Posted 3 weeks ago #

    I've not found that works for me - when I paste the code in, it gets truncated and altered even when you directly type it in.

    What I found works is this:

    The default code that woo commerce sets up is:

    <div class="social">
    	<iframe src="https://www.facebook.com/plugins/like.php?href={permalink}&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21" style="border:none;overflow:hidden;width:100px;height:21px"></iframe>
    	<span class="st_twitter">
            </span><span class="st_email">
            </span><span class="st_sharethis">
            </span><span class="st_plusone_button"></span>
    </div>

    Try deleting the iframe and then add whatever buttons you need following the same format i.e.

    <div class="social">
    <span class="st_facebook"></span>
    <span class="st_twitter"></span>
    <span class="st_email"></span>
    <span class="st_sharethis"></span>
    <span class="st_plusone_button"></span>
    </div>

    or for large buttons:

    <div class="social">
    <span class="st_facebook_large"></span>
    <span class="st_twitter_large"></span>
    <span class="st_email_large"></span>
    <span class="st_sharethis_large"></span>
    <span class="st_plusone_button_large"></span>
    </div>

    to get the name of the classes look at the ShareThis code that DBAR describes.

Reply

You must log in to post.

About this Plugin

About this Topic