Skip to main content

How To Add Smileys/Emoticons In Blogger Comments

How To Add Smileys/Emoticons In Blogger Comments: In this Article you learn how you can add Smileys/Emoticons in your blogger comments. With Smileys/Emoticons Blogger comments looks more Awesome and user love to write comments with Smileys on your blog. So Adding a Smileys/Emoticons is looks more user friendly. so now we will tell you how to add Smileys/Emoticons in your Blog. People are addicted to use smileys on social network so they feel comfortable when they publish comment on your blog. These smileys same as Facebook Smileys.
Comment should looks like below Image.
Comments Box
How to Add Smileys/Emoticons In Blogger Comments: Just follow below tutorials to add comments Smileys/Emoticons  on your blog. 
  • Go to Blogger Dashboard  -> Template.
  • Click on Edit HTML.
  • Press Ctrl+F to find </body> tag.
</body>
  • Paste below code above the </body> tag.
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Click to see the code!",
emoMessage:"To insert emoticon you must added at least one space before the code."
})
});
//]]>
</script>
<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>
</b:if>
  • Now the next step is fine the code. ]]></b:skin>
]]></b:skin>
  • Copy below code and paste above the ]]></b:skin> tag.
.emoWrap {
  position:relative;
  padding:10px;
  margin-bottom:7px;
  background:#fff;
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Opera */
background-image: -o-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);
  border:3px solid #860000;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  -moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  -webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  font-weight:normal;
  color:#333;
}
.emoWrap:after {
  content:"";
  position:absolute;
  bottom:-10px;
  left:10px;
  border-top:10px solid #860000;
  border-right:20px solid transparent;
  width:0;
  height:0;
  line-height:0;
}
  • Now Press Ctrl + F to find the </head> tag,
  • Paste below code above the head tag.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
  • You Smileys/Emoticons Installed Successfully. Just click on Save button to save the template.
Hope you like the post How To Add Smileys/Emoticons In Blogger Comments. and i hope you get the how you can install Smileys/Emoticons on your blog. so Must share this post with your friend and share your knowledge with other, don't forget to leave your feedback thanks.
Labels:

Comments

Post a Comment

Popular posts from this blog

Show Breadcrumbs in Google Search Results for Blogger

Show Breadcrumbs in Google Search Results for Blogger : Everyone can add Breadcrumbs in their blog but you can Rear find this topic. so today you learn about how you can show you breadcrumbs in google search results for blogger, this Article is only for blogger. You need to follow few below steps: Go to the Dashboard > template > Edit HTML Press CTRL + F and search bar is appear. Find Article Tag in your template. if your theme in HTML 5. <Article If you find Article tag then paste below cord on the above of Article Tag. Note: If your theme is not in HTML 5 and you are not able to find article tag in your theme then paste below line and search. itemtype= ' http://schema.org/BlogPosting ' Step 4: Paste below code above this line. <b:if cond= ' data:blog.pageType == &quot;item&quot; '> <b:if cond= ' data:blog.pageType == &quot;item&quot; ' > <div class= ' breadcrumb ' xmlns: v= ' http://rdf.
Post a Comment
Read more

How to Disable Copy Paste JavaScript For Blogger

Disable Copy Paste JavaScript For Blogger : In this Article we share with you how you can disable copying text from your blog and disable CTRL + C key. it will help you to protect your content from copy cats. Here is the Disable Copy Paste Script for Blogger. Now days any one want to Earn huge money, copy cats copy your original content from your blog and paste into their own blog, so you can't take any action against him if you don't purchase DMCA. if you don't have a money to purchase purchase a DMCA copyrights then just simple use this script no one can copy your contents from your site, and feel free to use this Script this script is not harmful for your site. it is the best script for content protection this script is build in JavaScript also we have a CSS disable copy paste script so CSS copy paste disable is more faster then JavaScript Script. you can use one of them at a time. Here is the link of CSS Script  CSS Disable Copy Function . Here we share with you a Dis
2 comments
Read more

How to Stop Auto-play Videos on Facebook

How to Stop Auto-play Videos on Facebook: In these days Facebook play their video automatically on. and it irritate which consume your internet bandwidth. if you don't want to load a video they automatically play on your screen and it take to much bandwidth. So In this Article i'll tell you how you can Stop Auto-playing Video on your timeline. Advantages of Auto-Play: When you are free and don't have any work to do then you can start browsing on Facebook. the first benefit of Auto-play is you don't need to click on play button video will playing automatically. This is the smart features of Facebook to improve the user friendly Environment for Visitors. You can watch huge collection of Videos without click on the play button and pass your time easily. Disadvantage of Auto-Play: One the The Biggest Disadvantage of Facebook Auto-Play videos consume their bandwidth if you internet package is limited then its not for you. So you can use the below tutorial to Off o
4 comments
Read more