Social share open by default - Narrative theme

StudioM
Explorer
67 0 29

Hi there,

 

I am using the Narrative theme and would like the social sharing icons to be displayed by default.

Currently, you need to press the share button before they become visible.

StudioM_0-1614704561933.png

Your kind help will be much appreciated!

 

 

KetanKumar
Shopify Partner
15881 1753 5845

@StudioM 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
StudioM
Explorer
67 0 29

Hi @KetanKumar !

 

The URL is:

https://tzuf.net

 

Sending you the password privately.

 

Thank you very much!

 

0 Likes
KetanKumar
Shopify Partner
15881 1753 5845

@StudioM 

Thanks for store details 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.product__share .social-sharing__item-list {
    position: relative;
    width: 100%;
    display: inline-block;
    text-align: center;
}
.product__share .social-sharing__item {
    position: relative;
    opacity: 1;
    left: 0;
    margin: 0;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
StudioM
Explorer
67 0 29

Hi @KetanKumar !

 

Thank you again for your time and effort!

 

As for the result after using the code, the share icons are now visible by default:

StudioM_0-1615118342918.png

And it could be perfect, only they are not clickable.

 

In order to use them, you still need to press the "SHARE", then they expand once more and have this grey uncentered circle around them:

StudioM_1-1615118436714.png

 

Is there a way to make them clickable without the expanding and all?

 

Many Thanks in Advance!

 

 

 

KetanKumar
Shopify Partner
15881 1753 5845

@StudioM 

Yes, is possible to some custom code on backend side 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
StudioM
Explorer
67 0 29

I will rephrase my question:

What can I do to make it work as explained?

Thanks!

0 Likes