Docs

[SirRahikkala]

Ok, I have had the social media buttons on every product page like in this thread:

https://community.theme.co/forums/topic/how-to-add-social-share-buttons-facebook-twitter-to-every-product/#post-293052

/*adding social sharing buttons to woocommerce product pages */

add_action("woocommerce_single_product_summary", "add_social_sharing_to_product_page", 60);

function add_social_sharing_to_product_page() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
}

add_action('x_before_the_content_end', function() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
});

But I would like to move them from below product details to below the product images.

[Rupok]

Hi there,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[SirRahikkala]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for providing the url. To resolve this issues, please use this code instead:

/*adding social sharing buttons to woocommerce product pages */

add_action("woocommerce_single_product_summary", "woocommerce_after_single_product_summary", 60);

function add_social_sharing_to_product_page() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
}

add_action('x_after_the_content_end', function() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
});

We would loved to know if this has work for you. Thank you.

[SirRahikkala]

This reply has been marked as private.

[Rue Nel]

Hello Again,

Sorry there was a typographic error on the code. Please use this instead:

/*adding social sharing buttons to woocommerce product pages */

add_action("woocommerce_after_single_product_summary", "add_social_sharing_to_product_page", 60);

function add_social_sharing_to_product_page() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
}

add_action('x_after_the_content_end', function() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
});

Please let us know if this works out for you.

[SirRahikkala]

Now they are at side of the images from top to down, not below in a row. See attachment.

[Rue Nel]

Hello There,

You can update the code and use this:

/*adding social sharing buttons to woocommerce product pages */

add_action("woocommerce_after_single_product", "add_social_sharing_to_product_page", 60);

function add_social_sharing_to_product_page() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
}

add_action('x_after_the_content_end', function() {
  echo do_shortcode("[share title='Share this Product' facebook='true' twitter='true' linkedin='true' pinterest='true' email='true' class='mtl']");
});

Hope this helps. Please let us know how it goes.

[SirRahikkala]

This reply has been marked as private.

[Jade]

Hi there,

Please add this code in the Custom JS:

(function($){
    
    $('.single-product .x-entry-share').clone().appendTo('.woocommerce-page div.product .images');

})(jQuery);

Then add this code in the custom CSS:

.single-product .x-entry-share {
    display: none;
}

.single-product .images .x-entry-share {
    clear: both;
    display: block;
    text-align: center;
}

Hope this helps.

[SirRahikkala]

Almost there! now we lost the tooltips.

[Rupok]

Hi there,

Thanks for wriitng back. No worries, that could be fixed with some CSS. You can add this under Custom > CSS in the Customizer.

.single-product .x-entry-share {
  padding: 40px 0;
}

Cheers!

[SirRahikkala]

Thank you!

[Jade]

You’re welcome!

[Author]

Posts