How to add WhatsApp share button on your Website – Social Codia

So in this tutorial we will show you that how you can create a whastapp sharing button on your webpages.

Just add the source code in your webpage to create a whatsapp share link.

<pre><code><a href="whatsapp://send?text= Welcome to Social Codia" data-action="share/whatsapp/share">Share via Whatsapp</a> </code></pre>

And that’s it. No Javascript needed, nothing else needed. Of course you can style it as you want and include a nice Whatsapp icon.X

Now if you want to hide the share link on Desktop Sites and want to show only in Mobile devices, you can add @media screen in css.

<style type="text/css">
	@media screen and (min-width: 600px) {
		 #android-share {
		 visibility: hidden;
		 clear: both;
		 float: left;
		 margin: 10px auto 5px 20px;
		 width: 28%;
		 display: none;
		 }
	}
</style>

<div id="android-share">
	<a href="whatsapp://send?text= Welcome to Social Codia" data-action="share/whatsapp/share">Share in Whatsapp</a>
</div>

This CSS code will hide the share link in bigger screen.

socialcodia Member since February 17, 2020

Loading + Follow Following

Do you like socialcodia's articles? Follow on social!