Social share button
Social_icons_products function execute behind woocommerce_share function. with the help of this function, As you can see in image social icons looking so great as you can see in the image . with this code, you can share your product on Facebook, Twitter, and LinkedIn.
The question is why we use social share icons (buttons).
Because we can share our products on social media with these buttons. Social share buttons give customers the ability to display their e-commerce purchases on Facebook, Twitter, Pinterest or other platforms. Social share buttons also add convenience for users who want to post a particular product by removing the extra steps of copying, pasting and posting to a separate website.
You don’t need to install any plugin to create social share buttons. You can copy and paste the code in function.php in WordPress which I give below. You can separate CSS. if you download or install any plugin for creating the social share button. that plugin will heavy for your website. that will be slow your site and take time to load. So you should this code for creating social share buttons.
Social media sharing buttons are a must-have, especially for a blog. Sure, the first solution that comes to mind for adding such buttons is a plugin. But with this code, you don’t need to add any plugin.
this code will help you to create good looking social share buttons.
And you can mold my code for adding share buttons in the post, single product page and any other place on the website.
We are here for your help. Contact us without hesitation.
Create social sharing button in wordpress without plugin
function social_icons_products(){
global $wpdb;
global $post;
$full_line = get_permalink();
$slug = basename(get_permalink());
// $url = str_replace("/", "%2F", $full_line);
// $url = str_replace(":", "%3A", $url);
?>
<style>
.social_icons_container {
text-align: center;
align-items: center;
display: inline-flex;
margin: 0px !important;
}
.font_icons {
padding: 6px 13px 6px 13px;
cursor: pointer;
font-size: 15px;
color: black;
transition: 0.1s all ease-in-out;
}
.font_icons:hover {
background: black;
color: white;
}
.share_text {
margin-bottom: 1px;
font-size: 16px;
color: black;
margin-right: 10px;
}
</style>
<div class="social_icons_container">
<p class="share_text">Share</p>
<a href="<?php echo 'https://www.facebook.com/sharer/sharer.php?href='.$full_line; ?>" >
<div class="font_icons"><i class="fab fa-facebook-f"></i>
</div>
</a>
<a href="<?php echo 'https://twitter.com/intent/tweet?url='.$full_line.'"' ?>" >
<div class="font_icons"><i class="fab fa-twitter"></i>
</div>
</a>
<a href="<?php echo 'https://www.linkedin.com/shareArticle?mini=true&url='.$full_line.'"' ?>" >
<div class="font_icons"><i class="fab fa-linkedin-in"></i>
</div>
</a>
</div>
<?php
}
add_action('woocommerce_share','social_icons_products');