Return to previous page

How can I add social share icons on the Single Product Page

This topic has 11 replies, 2 voices, and was last updated 2 years, 2 months ago ago by Awais Ahmed

afaqshakoor

Participant

September 7, 2022 at 09:50

I want to add Social share icons on the Single product page, do I need to install a required plugin? I added the social icons on the Single Product Builder, but cannot add the links to the social icons.

Product rating is not appearing on the single product page.

Please, contact administrator
for this information.

#333461 Copied Theme version: 8.3

10 Answers

Awais Ahmed

Participant

September 7, 2022 at 10:02

Hello, @afaqshakoor,

1. To solve your issue, first, you have to enable the social share from the Dashboard >> XSTORE >> Theme Options >> WooCommerce >> Single Product Page >> Single Product Layout check this image: https://postimg.cc/vDrDTHTm

Navigate to the Dashboard >> XSTORE >> Theme Option >> Social Share there you will see all the icons our theme has, just check the ones you want. Check the image: https://postimg.cc/TK95jkf2

You can not set the links for them as those social icons are for sharing purposes and generate the link which shares the particular product on that social forum.

2. The Review tab is showing fine on the single product page: https://postimg.cc/HjBXBty0
I have just rate the product and here is the result: https://postimg.cc/YGjGP5g1

Regards 8Themes Team.

#333465 Copied

afaqshakoor

Participant

September 7, 2022 at 10:32

Thank Awais, appreciate your help, and yes I got the review you posted, and can see the rating on the product page now.

I had followed the steps you mentioned to add social sharing, and it is working. Two things:

1. There’s no Instagram option in the settings
2. Is there a way to apply the standard social sharing platform icon backgrounds, if not how can I customize it.

#333476 Copied

Awais Ahmed

Participant

September 8, 2022 at 06:08

Hello, @afaqshakoor,

1. Point is that the Instagram app does not have a share option, it does not allow sharing, so you can’t implement this and unfortunately, there is no such option in our theme for now as well.

2. When you set it, the icons by default show as the default background color of the particular social platform, as it is showing on my test site: https://postimg.cc/R3zQyjTQ

Regards 8Themes Team.

#333525 Copied

afaqshakoor

Participant

September 8, 2022 at 08:12

Hi Awais,

I did the same, but the background as Default is the same for all icons, please guide how to make them default background color of the particular social platform, as you mentioned.

https://postimg.cc/Wt4hXvqP

Please contact administrator
for this information.

#333534 Copied
Awais Ahmed

Participant

September 8, 2022 at 08:41
Hello, @afaqshakoor,

Those are actually the SVG icons, and you have to use the Custom CSS to make them the default color, please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back to your site after removing the browser cache.
```
.single-product-socials a[data-tooltip='Facebook'] {
    color: #3b5998 !important;
}
.single-product-socials a[data-tooltip='Whatsapp'] {
    color: #25D366 !important;
}
.single-product-socials a[data-tooltip='Twitter'] {
    color: #00acee !important;
}
.single-product-socials a[data-tooltip='Linkedin'] {
    color: #0072b1 !important;
}
.single-product-socials a[data-tooltip='Pinterest'] {
    color: #c8232c !important;
}
```
Resulting Screenshot: https://postimg.cc/qt4kF2rP

Regards 8Themes Team.
#333537 Copied
afaqshakoor

Participant

September 8, 2022 at 09:14

Wonderful, Thanks much for your instant support.

One more thing, notice in the screenshot the site title is not correct, whereas the icon is OK.

https://postimg.cc/TLrsLrwG

#333540 Copied

afaqshakoor

Participant

September 8, 2022 at 09:26

Is Custom CSS required to change background to default here too?

https://postimg.cc/5XW68zfy

#333544 Copied

Awais Ahmed

Participant

September 8, 2022 at 10:12

Hello, @afaqshakoor,

Please try to disable all the third-party plugins (including cache plugins), that does not come bundled with XStore https://www.8theme.com/documentation/xstore/plugins/included-plugins/ , clear the cache of the browser, and check then. Maybe one of the additional plugins is the reason for the problem.

And if the issue will still persist then please remain all the third-party plugins deactivated on your site and provide me the permission to debug your site which includes deactivating all the third-party plugins and on-site Customization as well so that I will check and assist you accordingly.

Note: Please take the complete backup of your site first.

Regards 8Themes Team.

#333547 Copied

afaqshakoor

Participant

September 8, 2022 at 11:24

Please ignore this message.

#333551 Copied

Awais Ahmed

Participant

September 9, 2022 at 05:55

Hello, @afaqshakoor,

Is your issue resolved? Please let me know, so that I’ll close this topic here, and for further new queries you can generate a new topic anytime, we are always here to help you.

Regards 8Themes Team.

#333577 Copied
Tagged: persuasive, seo friendly, single-product page, social share icons, woocommerce, wordpress
Viewing 11 results - 1 through 11 (of 11 total)

The issue related to '‘How can I add social share icons on the Single Product Page’' has been successfully resolved, and the topic is now closed for further responses

How can I add social share icons on the Single Product Page

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection