Move social media icons only on the product pages

Store Design
, ,
1

I want to move the social media icons only on the product pages, as in the attached image.
Can someone please help with a code?
Thanks
https://ankitimes.com/products/akita-psychedelic-face-unisex-tee

Ann21_0-1688541327314.png
Ann21_0-1688541327314.png1920×570 73.9 KB

2 Likes
2

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
div#st-1 {
text-align: center;
margin-left: 10%;
}

ZestardTech_0-1688541793469.png
ZestardTech_0-1688541793469.png1827×722 89.3 KB

3

Thanks but now it moves on the blog too, and I want it to move only on the product pages.
And with me for some reason, it is not aligned like in your example.
what can we do?
Thank you

Ann21_0-1688542193587.png
Ann21_0-1688542193587.png1676×443 47.9 KB

4

Hello @Ann21 ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Assets folder → base.css file → add this following code at the bottom of page

body.product-page #st-1 {
  text-align: center;
  margin-left: 10%;
}

Save and preview

Hope this can help.

Ali Reviews team.

5

Thank you but unfortunately, it doesn’t work and is still stuck on the left side.

Ann21_0-1688547347297.png
Ann21_0-1688547347297.png1920×570 73.9 KB

6

@Ann21

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
@media only screen and (max-width: 749px){
.product-section .st-inline-share-buttons {
    margin-left: 4.5% !important;
}
}

@media only screen and (min-width: 750px){
.product-section .st-inline-share-buttons {
    margin-left: 52.3% !important;
}
}

Thanks!

1 Like
7

Works great.
Thank you very much. Really appreciate it.

8

@Ann21

If helpful then please Like Solution.

Welcome Again.

Thanks!