Friday

How To Add Whatsapp Smileys On Blogger Posts And Comments

The Whatsapp is another top chat platform that enables friends and family to communicate and also it has been on of the best.
Adding whatsapp smileys on blogger posts is one of the best feature that every entertainment blogger need to add to their blog to enable their visitors have more fun and get attracted to your blog.


Image



Step 1
First you need to Sign In to Blogger DashBoard and select your preferred blog.




Step 2
Now Select Template from the left menu >>> Edit HTML



Step 3
On your keyboard press CTRL+F and then past this and search </body>   then copy the below script just above it.


<script
src='https://78f4de3676ac34c79dbc2146065980a0e
371905b.googledrive.com/
host/0B6AQ0cwAMPNQfnZBck56QnZHT0pSbFY1
dmtWcFFwUjJWVlNMMFg3ZW1QSmJFT2l3
RmVtTXc/js/netoops-whatapp-smileys-blogger-
posts-comments.min.js'/><a style='display:none;'
href='www.zealmat.com' >bloggerwidgets</
a><script type='text/javascript'>//
bloggersmileys.init();</script>






Step 4
Again search for this code too

<div class='post-footer-line post-
footer-line-3'> or <div class='post-footer-
line post-footer-line-3'/>





Step 5
Then look carefully below you will see a tag like this </b:includable>




<b:if cond='data:blog.pageType ==
&quot;item&quot;'>
<div class='noopsmile'
id='noopsmile' style='background-
color:#E0F7FF;background:#eee; border-radius:
7px;width:634px; padding:10px; border:1px solid
#ddd'>
<img
src='https://78f4de3676ac34c79dbc2146065980a0e
371905b.googledrive.com/
host/0B6AQ0cwAMPNQfnZBck56QnZHT0pSbFY1
dmtWcFFwUjJWVlNMMFg3ZW1QSmJFT2l3
RmVtTXc/imgs/comment-section1.png'/><a
style='display:none;' href='www.zealmat.com'
>we speak tech</a><div align='right' id='close'
style='font: bold 13px arial;margin-top: -14px;
cursor: pointer;'> Close [x] </div></div><div
id='open' style='background-color:#eee; border-
radius: 7px; padding:10px;width: 87px;cursor:
pointer;display:none;left: 582px;position:
fixed;top: 1%;z-index:999;font-weight:bold;'> Open
Smileys </div>
</b:if>




Place the above code like this


</div>

Place the above code here

</b:includable>



Step 6
Again search for this code too

]]></b:skin>





Step 7
Now copy the below code and place it before the  ]]></b:skin>


.post-body img.noops-smly {
padding: 0 !important;
margin-top: -2px !important;
}







Step 8
Finally save your template and that's all you need.




If you have any problem feel free to comment below thanks.
Share :

zealmatblog

No comments:

Post a Comment



Parse Your Adsense HTML code Here





We love to hear from you!

Sign in to comment "anonymously" without entering verification text.