How To Install The Buttons Share Whatsapp With Thumbnails

On this occasion the tutorial that I will discuss is still about bloggers. And for the tutorial that I will discuss is the How To Install The Buttons Share Whatsapp With Thumbnails. And this tutorial is only for the share button whatsapp his course. So when you guys in his blog there is no button share his whatsapp you guys could try him by following the tutorial I am going to share this time. Very useful when there are you guys on the blog button share whatsapp. One of him when you have a group on whatsapp will make it easier for you guys can share interesting things that you guys have in your blog that you guys have. For example you can see the picture below.

How To Install The Buttons Share Whatsapp With Thumbnails

1. Please you guys copy CSS code below and place it just above the code  ]]></b:skin> atau </style>

/* Social */
.social{
 float:left;
 font-size:16px;
}
.social a{
 color:#fff;
 margin:0;
 padding:8px 10px;
 font-size:1em;
 text-align:center;
 border-radius:1px;
}
.social a i{
 color:#fff;
 text-align:center;
 padding-right:5px;
 display:inline-block;
}
.social a.whatsapp{
 display:none;
 background:#43d854;
}
.social a.whatsapp:hover{
 background:#38b046;
}
@media only screen and (max-width:768px) {
.social a{
 display:inline-block;
 padding-left:0;
 padding-right:0;
 padding:5px;
 white-space:nowrap;
 font-size:1.5rem;
 line-height:0;
 border-radius:6px;
 width:35px;
}
.social a i{
 padding-left:0;
}
.social a.whatsapp{
 display:inline-block;
}
.social a i{padding:0}}

2. After that please you guys just copy the code below and put it to where you want. Non could you guys put under the title of the article or in the bottom of the article. Or it could be in a place where the share button that already you guys have and put this code below.

<div class='social'>
<a class='whatsapp' expr:href='&quot;whatsapp://send?text=&quot;+ data:post.url'><i class='fa fa-whatsapp'/></a>
</div>

3. Last save the templates you guys and see his results on a mobile browser mode you guys.

If the size does not match the template you, please you guys lived Customize on the CSS code above.

Maybe it's just that I can share in the tutorial How To Install Button Share Whatsapp With Thumbnails. Hopefully this article helpful made you all. Good luck.

Share this post