Easy Ways to install Emoticons in Blog comments

Table of Contents [Hide]

     Emoticons are symbols or symbols that can represent a person's expression, such as smiling, angry, happy, sad, and others. The purpose of installing these emoticons is to beautify the look of your Blog and provide a place for readers to pour out their hearts after reading your article.

    Install emoticons in Blog Comments

    This time the admin will share How to Install emoticons in Blog Comments. Please follow step by steps that I will write below to be understood.

    Related:  A new way so that blog articles can't be copied and pasted

    How to add an emoticon look to a blog comment:

    1. First, Sign in to your Blog Dashboard, select the template menu, and click Edit HTML.

    Blog Dashboard
    Blog Dashboard

    2. Next, you have to search for the code ]]></b:skin>, Use CTRL + F to facilitate the search.

    3. Then, please enter the CSS code below just above the code.

    .emoWrap { position:relative; padding:10px; margin-bottom:7px; background:#fff; background-image:-ms-linear-gradient(right,#FFFFFF 0%,#FFF9F2 100%); background-image:-moz-linear-gradient(right,#FFFFFF 0%,#FFF9F2 100%); background-image:-o-linear-gradient(right,#FFFFFF 0%,#FFF9F2 100%); background-image:-webkit-gradient(linear,right top,left top,color-stop(0,#FFFFFF),color-stop(1,#FFF9F2)); background-image:-webkit-linear-gradient(right,#FFFFFF 0%,#FFF9F2 100%); 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; }

    4. After that, please find the </body> code again, then enter the code below just above the regulation.

      <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script type='text/javascript'>
    jQuery(document).ready(function () {emoticonx({
    emoRange:"#comments p, div.emoWrap",
    topText:"Click to see the code!",
    emoMessage:"To insert emoticon you must added at least one space before the code."
    <script src='https://cdn.rawgit.com/Brando07/share/newbe/seocips-emo.js' type='text/javascript'/>

    5. Click save the template; done.


    Source: Wongkost.com

    That was how to install CSS code to display Emoticons in Blog comments. It's easy enough, no. Please try.

    Previous Post Next Post

    Contact Form