WhatsApp us
Add Social Share Buttons in WordPress Without Plugin
- Tech Area
- Last updated on: January 15, 2026
Social share buttons help visitors easily share your content on platforms like Facebook, Twitter, WhatsApp, and LinkedIn, which increases traffic and improves SEO. Most WordPress users install plugins for this, but plugins slow down your site.
In this tutorial, you’ll learn how to add social share buttons in WordPress without using any plugin, using simple and lightweight code.
Why Add Social Share Buttons Without Plugin?
Using custom code instead of plugins has many advantages:
✔ Faster website loading
✔ No unnecessary scripts
✔ Full design control
✔ No plugin conflicts
✔ Better SEO performance
Social Platforms We Will Add
1. Facebook
2. Twitter (X)
3. WhatsApp
4. LinkedIn
Step 1: Add Social Share Buttons Code
Open your theme’s functions.php file and add the following code:
function custom_social_share_buttons() {
if (is_single()) {
$url = esc_url(get_permalink());
$title = esc_attr(get_the_title());
ob_start(); ?>
<div class="social-share">
<span class="share-label">Share:</span>
<a class="fb" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $url; ?>">
<svg viewBox="0 0 24 24"><path d="M22 12a10 10 0 1 0-11.6 9.9v-7H7.9V12h2.5V9.8c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.3.2 2.3.2v2.5h-1.3c-1.3 0-1.7.8-1.7 1.6V12h2.9l-.5 2.9h-2.4v7A10 10 0 0 0 22 12z"/></svg>
</a>
<a class="tw" target="_blank" href="https://twitter.com/intent/tweet?text=<?php echo $title; ?>&url=<?php echo $url; ?>">
<svg viewBox="0 0 24 24"><path d="M22.46 6c-.77.35-1.6.58-2.46.69a4.27 4.27 0 0 0 1.88-2.36 8.3 8.3 0 0 1-2.7 1.03 4.15 4.15 0 0 0-7.07 3.78A11.8 11.8 0 0 1 3.1 4.8a4.1 4.1 0 0 0 1.28 5.54 4 4 0 0 1-1.88-.5v.05a4.15 4.15 0 0 0 3.33 4.06 4.2 4.2 0 0 1-1.08.14c-.26 0-.52-.02-.77-.07a4.16 4.16 0 0 0 3.88 2.87A8.3 8.3 0 0 1 2 19.54 11.7 11.7 0 0 0 8.29 21c7.55 0 11.68-6.1 11.68-11.38 0-.17 0-.35-.01-.52A8.1 8.1 0 0 0 22.46 6z"/></svg>
</a>
<a class="wa" target="_blank" href="https://api.whatsapp.com/send?text=<?php echo $title; ?> <?php echo $url; ?>">
<svg viewBox="0 0 32 32"><path d="M16 3C9.4 3 4 8.2 4 14.6c0 2.6.9 5.1 2.4 7.1L5 29l7.5-1.9c2 1.1 4.3 1.7 6.6 1.7 6.6 0 12-5.2 12-11.6S22.6 3 16 3z"/></svg>
</a>
<a class="ln" target="_blank" href="https://www.linkedin.com/sharing/share-offsite/?url=<?php echo $url; ?>">
<svg viewBox="0 0 24 24"><path d="M4.98 3.5A2.5 2.5 0 1 0 5 8.5a2.5 2.5 0 0 0-.02-5zM3 21h4V9H3v12zM9 9h3.6v1.7h.1c.5-1 1.8-2 3.8-2 4.1 0 4.9 2.6 4.9 6V21h-4v-5.3c0-1.3 0-3-1.9-3s-2.2 1.4-2.2 2.9V21H9z"/></svg>
</a>
</div>
<?php
return ob_get_clean();
}
}
Step 2: Display Share Buttons Below Post Content
Add this code below in functions.php:
add_filter('the_content', function ($content) {
if (is_single()) {
return $content . custom_social_share_buttons();
}
return $content;
});
Step 3: Add CSS Styling
Go to Appearance → Customize → Additional CSS and add:
.social-share {
display: flex;
align-items: center;
gap: 10px;
margin-top: 20px;
}
.share-label {
font-weight: 600;
font-size: 14px;
}
.social-share a {
width: 36px;
height: 36px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
}
.social-share svg {
width: 16px;
height: 16px;
fill: #fff;
}
.social-share .fb { background: #1877f2; }
.social-share .tw { background: #000; }
.social-share .wa { background: #25d366; }
.social-share .ln { background: #0a66c2; }
Conclusion
Adding social share buttons in WordPress without a plugin is the best way to keep your website lightweight and SEO-friendly. With the above code, you can easily add modern social icons that work on all devices.
Join 20,000+ subscriber