Share button size

Hello.

Please how can i set Share text and share facebook button size?

https://821.sk/produkt/dym/

Thank you very much.

Hello,

To change the size of social share buttons from the product page you can use the below css in Theme Setting > CUSTOM CSS > Global Custom CSS:

.single-product .wd-social-icons.wd-style-default>a {
    font-size: 30px;
}
span.wd-label.share-title  {
     font-size: 30px;
}

Best Regards

Thank you very much. Its work.

And please, how can i change Facebook icon?

Thank you very much.

Hello,

Try to add the below css in Theme Setting > CUSTOM CSS > Global Custom CSS:

.wd-social-icons .social-facebook .wd-icon:before {
      content: "" !important;
    background-image: url('https://via.placeholder.com/150');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 50px; /* Adjust size as needed */
    height: 50px; /* Adjust size as needed */
    display: inline-block;
}

Please change the image URL. You can upload your desired image to the media library in WordPress and copy the link to replace the dummy URL.

Best Regards

Thank you very much its work 🙂

And please, how i set margin right. Move Icon to right.

Thank you very much 🙂

Hello,

You’re very welcome!

To move the icon to the right, add the following line to the previous code:

margin-left: 10px !important;

You can adjust the value as needed.

Best Regards

Hello.

Please i add the margine code in previous code,
but it dont work, I must be making a mistake somewhere.

.wd-social-icons .social-facebook .wd-icon:before {
content: “” !important;
background-image: url(‘http://821.sk/wp-content/uploads/2025/01/Facebook.png’);
background-size: cover;
background-position: Right;
background-repeat: no-repeat;
width: 40px; /* Adjust size as needed */
height: 40px; /* Adjust size as needed */
display: inline-block;
margin-right: 20px !important;
}

Thank you very much.

Hello,

To move in the right please add the margin-left to the previous code:

margin-left: 20px !important;

Like try to use this below code:

.wd-social-icons .social-facebook .wd-icon:before {
content: “” !important;
background-image: url(‘http://821.sk/wp-content/uploads/2025/01/Facebook.png’);
background-size: cover;
background-position: Right;
background-repeat: no-repeat;
width: 40px; /* Adjust size as needed */
height: 40px; /* Adjust size as needed */
display: inline-block;
margin-left: 20px !important;
}

Best Regards

[Author]

Posts