Change look of social share buttons?
-
Hello
Is it possible to change the look of social share buttons shown below cart from
http://prntscr.com/ohpltx
To something like this-
http://prntscr.com/ohplzy
Hello,
Please add this code to the Theme Settings > Custom CSS > Global:
body .icons-design-default .woodmart-social-icon {
padding: 10px 5px;
}
body.single .woodmart-social-icons i {
display:block;
padding:5px;
color:white;
}
body.single .woodmart-social-icons i.fa-facebook {
background-color:blue;
}
body.single .woodmart-social-icons i.fa-twitter {
background-color:blue;
}
body.single .woodmart-social-icons i.fa-pinterest{
background-color:blue;
}
body.single .woodmart-social-icons i.fa-linkedin {
background-color:blue;
}
body.single .woodmart-social-icons i.fa-telegram {
background-color:blue;
}
Change the class of social icon fa-telegram as per your needs as well as the background colors.
Best Regards
Hello
http://prntscr.com/ohtmcp
http://prntscr.com/ohtmnq
It seems the code changes the colour everywhere and also change alignment in the footer. I was hoping to change the background only after the add to cart button area while leaving the social icons in the header and footoer (and other places if any) intact.
Something like this is also good as it is shown in footer.
http://prntscr.com/ohtnqj
Would that be possible? Regards.
Hello,
Please provide your site admin access. I have checked the code it works only on the product page. I would like to check on your site.
Best Regards
Hello
Please find login details. You are correct the code works only on the product page but it works everywhere on the product page including the header and footer. Regards.
Hello,
Please replace the provided code with this one:
body.single .entry-summary .icons-design-default .woodmart-social-icon {
padding: 10px 5px;
}
body.single .entry-summary .woodmart-social-icons i {
display:block;
padding:5px;
color:white;
}
body.single .entry-summary i.fa-facebook {
background-color:blue;
}
body.single .entry-summary i.fa-twitter {
background-color:blue;
}
body.single .entry-summary i.fa-envelope{
background-color:blue;
}
body.single .entry-summary i.fa-pinterest{
background-color:blue;
}
body.single .entry-summary i.fa-linkedin {
background-color:blue;
}
Best Regards
This works great. Thanks very much.
You are welcome! If you have any questions please feel free to contact us.
Best Regards
The topic ‘Change look of social share buttons?’ is closed to new replies.
.
