Wednesday 11 March 2015

Cara Pasang Emoticon Di Komentar Blog

Kumpulan Emoticon Buat Blog - Trik kali ini akan membahas cara memasang emoticon di komentar blog. Emoticon digunakan untuk menunjukan reaksi atau perasaan pengunjung ketika membaca sebuah artikel. Memasang emotikon ini juga bertujuan agar pengunjung tertarik untuk mengomentari artikel sobat.


Cara Memasang Emotion Keren Pada Komentar Blog Versi 2

Bagi yang ingin pasang emotikon, silahkan ikuti langkah-langkah berikut. Dijamin blog kalian akan lebih menarik dan tentunya semakin keren.

1. Login akun blogger sobat
2. Pada dashboard pilih Template » Edit HTML
3. Cari kode </body> lalu letakan kode berikut ini di atasnya.


<b:if cond='data:blog.pageType == &quot;item&quot;'>   
<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.emoWrap",
    putEmoAbove = "iframe#comment-editor",
    emoMessage = "To insert emoticon you must added at least one space before the code.";

// Emoticon bar before comment-form
$(function() {
    $(putEmoAbove)
        .before('<div style="text-align:center" class="emoWrap"> :) :)) ;(( :-) =)) ;( ;-( :d :-d @-) :p :o :&gt;) (o) [-( :-? (p) :-s (m) 8-) :-t :-b  b-( :-# =p~ $-) (b) (f) x-) (k) (h) (c) cheer <br/><b>Click to see the code!</b><br/>To insert emoticon you must added at least one space before the code.</div>');
    var emo = function(emo, imgRep, emoKey) {
        $(emoRange)
            .each(function() {
            $(this)
                .html($(this)
                .html()
                .replace(/<br>:/g, "<br> :")
                .replace(/<br>;/g, "<br> ;")
                .replace(/<br>=/g, "<br> =")
                .replace(/<br>\^/g, "<br> ^")
                .replace(emo, " <img style='max-height:24px' src='" + imgRep + "' class='emo delayLoad' alt='" + emoKey + "' />"));
        });
    };
    emo(/\s:\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WCvt54bKoX4HQ7a0UnKawH65lfdhlVQK4nw3TUhIT5OyXNU4y4MpNNuTT6Jt-ISTfeKWmF3johvD8DFspFQ3ye74zimb3AVxHvQupsRZtG83-5esOQwrW6ar2oACPAfUx1YHMaFFNsg/s36/03.gif", ":))");
    emo(/\s;\(\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhelpbGyZ4ShtLZE8fPXHX0bPdWFNQaXFpKFzPN5WQbZjFPNORpiPLiuTiASNEgLiFKQnkl7HyhreIFuwhuoDmq7zCjPvB_rZoCAS7HcFIU6xWlnfrVitEMQONqomMz-OwKlFNaocHvilU/s47/06.gif", ";((");
    emo(/\s:\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuLt6jD5tuv9gA-2WSUafUv41mOcWJS5heB8TYG1HuJ9x8S4dsvad08fqQKzN-yhIotlCM8J9Jnkhp6Qgw5cR5Drff-RlqUjRWWC3HTCuZLNSrePX9aD2wnklISHWYFM_wg98L_bg23Lg/s36/01.gif", ":)");
    emo(/\s:-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTgeXnXxdX_khraSfDEoVBfwzhZS8J2u76VMx9pTkCXVPp-0KtTjYdR10TlEiEd4nPQZlSdOhrnABrCyEhH9uP3kiyDqXxcNQsJF24Ij6cJQvh2DW0vgMYaSpZ0uqx7GYvebITLAVQyEs/s36/02.gif", ":-)");
    emo(/\s=\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNMlHByjR-5cPdzg9Y8GHS4JyAxPJ2YFBNM2YemevmdCBxBt-w0BS6d-Sgb_2JCthkY1yFEFfboraIW-rme2TNFc9vk1nzpEN_OBsef4xMSDWoVBnC4kGnZ0daTP4ZgHkeqCp12hhKLwo/s36/03a.gif", "=))");
    emo(/\s;\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiah-364d1drsdWo-4to-xKalk_WOdEnc9j1T622uegil8olI5YNCviKsNJf7oEzGr02PnKbVQpz_idI4AF3GmPUOrhds3nvSTaNBy8AxZB70jI-Rtc-JcNryqHk6kH7JxyPIsMkUZOQO8/s36/04.gif", ";(");
    emo(/\s;-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ePz2Fo96MgPzNzzaPJKpy2EfLyJFA6JRhLIMFNAAtyuJKrsQKQbLC7EHI1-F52ToUmjAw_XSxLwzl2m-pyo4Memc85AW507J4AIiBdOxn14-cIZCuVzWSQvLQgaLFhNKc8DtQIs7iF0/s36/05.gif", ";-(");
    emo(/\s:d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0iQpgi5XgdRzGosawd5NGLqijmI_Hlm1JnCgLy3Sqc8tyoAXX18sgZhikbGCVshA4hyphenhyphenGBeI8QiF_mjbq4Iid3YQIrtqwO1iwBQN7Dbzk2irjXVHaV8PGxnpMo-VIowROZPzuLZBPhk6M/s36/7.gif", ":d");
    emo(/\s:-d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0rqysCYe-S1nOzyeUcdCYcj4AZ1FezQkILibQyKFNdRe1Vr0_sIhGGMFvuBZMZUwIEe27q6SFYZka_tBKsxzvjVGl1foAbZ0Kqaxhwy20UEnqJRYoQeb8QXDfvXZQ8MJ0nviNRxj-FWA/s36/8.gif", ":-d");
    emo(/\s@-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu4XYfsu-0fEwYrPQzX5cK_5JVZz_8y_S7EGtOvPbp755WGialBU3YC51x4lWxR_ukSpcIXrj6cW_9dbKwyTAWY5ng8NaFp4-G7N3j639X8rlxvQavkmghep64ylUGOm17tpEy8ofOA_M/s36/09.gif", "@-)");
    emo(/\s:p/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT5CLFhZZau0Hc3RnIsdX7yI7EvU_JJ-jawcg9G3TZzIln9NQIrBNP5qA23CRhEdvZVgjSc_GJ6m3L9xKajvMLwDhXPQLq5eLF4ekEfCoEZwVSHyzbpuXxWkprANkIHsV-_wnS_7hymfw/s36/10.gif", ":p");
    emo(/\s:o/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0hZH0RJ0KGXrzDBHtoeDvae_MaEf1wmfj1uoXRE8W65hIMC4pK4WUZBR1XbJOIWnfOgTxkpxpycVuRWjYXA9z1FGdK3gER8xeLQOFM4hkswqa57EFt-g448VIo6JwEUUVIRZC21P_Z6U/s36/11.gif", ":o");
    emo(/\s:&gt;\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKeIwkxyd7wCuf1LHgdpZSKWNdqpPhU1d31-BhG5pA6DNhL6e4o5iLpMDmWgQg3ZfieHB0rGOkYtJxXYdJeOmRbU15VMIa8DQIhupJXTIxulkPB0IJmIpCXHVbOTOqlbUUa17Bu-SEBOM/s36/12.gif", ":&gt;)");
    emo(/\s\(o\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiklU9C0TyzJKICjjN2-HQ3BdfZUcW3k1hNmyw4YTIn7SqGFBhMXambdIjYQajy8yUEkjn-Kq_AT9Wm2-8jGS5ufIjDuZx8dizg1-TQbHqGDU0vl3JyILkYvyjXJeRliFSmGx_vLTPZSjI/s36/13.gif", "(o)");
    emo(/\s\[-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1TnCtquQg8bF-6XtCwDydRoMX3ANo1XepA72UBrjw0aXFDB6zP9nqb2uD3lPg3I7JJqp4Wo0HT7vLnPARhGnuR7tAv-PoiX62Vnvhdzn_wdB4CqmqiKsh4csxB9fMYmBlfyWIfzfssdU/s36/14.gif", "[-(");
    emo(/\s:-\?/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheTSjpVW4PF_ZtoLwrGBl2UEdYjmf22__h4p4kOIHg0v0zmc3AG7wTJ3MQ8oSmxTuE9o0h0GAJR8i2qZAq6Zm6wzDXuLpnzKwmt2FPbGYBYyE34jH6DFy-WW-_EXPG_3Typx0ZaICZwks/s36/15.gif", ":-?");
    emo(/\s\(p\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTEHJ35C5DnZQ7s0OnZrYgAhZP7lI7dqB2gW0kL7T3TVhDlzHLtC4g9-LgGHdVRPUoENhKS8ewQUT-9_wbGE7qlZ7PBuOIYvAZdWZNvcQx1WISl6On7oQgQyfvFlw3-8gLI8L8qCmEwf8/s36/16.gif", "(p)");
    emo(/\s:-s/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkL7Y3ukz74OAuHG1EiiiGYKlREP_ibvxcdA9BYzVLDc2jdzuWvJmAchMw40ijoG8lGAANXYoMt0cITfNT66hUQjPSH5zmVamSzP6Br5-ucmZ5S0blOZSvxB3hp3i1wIp32tvarcxehVw/s36/17.gif", ":-s");
    emo(/\s\(m\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuCBu10AJsKK6BmNN6pEkIC6QsLqX__DuBn7vKh-sDaSe-W8IlfKWhUQ8iU1Fb6Fk_XU1MBvqj_Q5ijDD3Rv4C-Rt5LSq-U1oiqytFJff2lDm5YDB-Z2J1VoUgem_5LReoWOwWlGuIqKc/s36/18.gif", "(m)");
    emo(/\s8-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPPYV07tTrQjIz1blwSFGsArtbpEkJu4YUpE0NxfyLq5uMMpf7w_uGc3j58M98XkPJSYGgksz4ekVpkuUbP7ZskoRyfNRIv2Srqc8n6t6cN6OVUBUXbBBNzVFbW7Twy26Wz6LtCFrZVJs/s36/19.gif", "8-)");
    emo(/\s:-t/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJCSOvyd1piMgoi9NaAdEwugy9pi4RY4j9DIdh_ZOs8qpId-zphSKdI-CPNIuFdTDIPs-4nIi8c8-UP0XK4hswD4ZvbS1I8uXGbX5woeb3IzV7OR1Kx-tPEm5NENg4p4cjINzccgIRh5k/s36/20.gif", ":-t");
    emo(/\s:-b/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQyFWe0zBlyFoExpZ7M8UfT9XUZrCfD2rE9ulTeI2KuX2xKbbrJVHgzwGbcT9FK21RuvSivZFoXwDN_dzKuczs9b0cTBeB6L9rLmpW0qfPhsWUanFhFQOMbsM-h0O2OzJpLSwVK3CqHrM/s36/21.gif", ":-b");
    emo(/\sb-\(+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZyGibxPOV9f2_Mq5ihEgVZbAM8Fd55nViKsxSXFJ-hWDlvJPdQCn4vwPWE-H6KblUuRm25-SrPgshz2BqMoWuiCCmxA1YZJhyphenhyphenrxcYf1ltflFq_3bFN7gbIJ-nITCaDz8fq7GLLCxDXXE/s35/22.gif", "b-(");
    emo(/\s:-#/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIgCv8rubSRQQrfeOrj9PaL5X0cReyaxxwSdeyOjdl3Zrv8gxBip6NUpmXvsB9V1vOlpq8luE6jTdqhtjZrCjui_nYtfDoOAFQNqQ5KY-PKdB4C6Fgpm3zIrgERBrEZnaIJKAsUI_oW5w/s36/23.gif", ":-#");
    emo(/\s=p~/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8JV2lWW6YHjt8BMvc5NkUklBIC6jmrYmv31df1MKtLlK6WO3TbjC6MNKGCsGufM90Nmwxh1eY6y4d3glf3CPpCVLAGAGVqJEgB7nQAQCQRi-kYEWnuiR0MOKG4JX95FGAaNKkGofEgHU/s36/24.gif", "=p~");
    emo(/\s\$-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvu8Xq9cbh07VMUUibHS9P6V3BMXgWAZm9SXxI_13ms-TA5jUA3a-YVs06_GF-dfpiT1BRK37SjGxnVpUjMb6UaRfGm_EupzqE21ZFaSIoeKPsh2vBvhWqsIpN6n5EMEMvzH4ubs3-Mhc/s36/25.gif", "$-)");
    emo(/\s\(b\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7D5D_l_KuR3ftWBmMg7S4VG60VWS7aUddePjFreQ7Dl-I6b5ncR6UTercjmZDyfHpFKepXFqVKHveKT-Y2cJR20Ur7CYtOGAez3sGSZf3LvVuutBIGRp9kdNGapa5cu4tssOYSZlnEaI/s36/26.gif", "(b)");
    emo(/\s\(f\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-8db1NG0LSzC6rDmLTUcsl84ohcdDt_rsmDpMltf2cyCA3skeIxZIEFFtmMs9L09FCKk7QHuJOMU1zk7QkAzeUvpafa7YuNQmhjWZHeLSJ_AoTaA4Ox0PTEkmCqHvKsgVDQA6rlpkL74/s36/27.gif'", "(f)");
    emo(/\sx-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZYFdKLGHxft-AWQoZ6Sy8YhQdWg87ugYFQGjM_CSaRoDzrORiAc1mD9pFraWn3VAE17hsDnnLMQhLEcxu_-wJeY2eQja8ATyhgMlWg81Rt7k50GfPwN7zSFhtwOfyjObCMBew3EsbMaE/s36/28.gif", "x-)");
    emo(/\s\(k\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqmPfC2PGPYwmrXclanOvmw_dPG8urthyphenhyphenXKtR674reRoY5pAhU2WCvihf0LUlpwt5ssFfb1q3MaMj2N2IewHfppAdGZLK8Cb_uutpjgYn6xv1ybWbR-iIb4ac2llAsBiY-ulInrWJVJ30/s36/29.gif", "(k)");
    emo(/\s\(h\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDFyB_1l5x_jVJ1a7fwmgvgfZAbM96zAh9eLqShFntnv4_2uJf44nEA1Jnwn3bovqJcIItWp-aeERAlwa6CnG7XvZudGy8TlEZEuM_hxfotsdjSmBc90oMbuOzk_TsgnpOCVdbj-WQjhA/s36/30.gif", "(h)");
    emo(/\s\(c\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaesKW8jgtZoLGxwJ9F6HrvmAK2Ft0norVrDz6LmNZiPO0Yx_0EPpnQvfRclcsw96ql48CHjbFUEKL7EM8PT1AFUvKgZ7y-vBZvnQVJ-VchE5KpWnKJQLaivBvJRS7y8voEvm9bQdFPLw/s36/31.gif", "(c)");
    emo(/\scheer/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX7HFNMcQW2D1UtUtHKzSHZ7BhwxQhttPZ0GCx4Ar-qsHGCQBRDFG1o4Fo3gpYMX61LZNZqwrDBucDBIUUCCtUjei3SmCfus7qrDaD8JOqt6eh74vpL0MIkYL0tOiXfGa7rY9wmfKzlss/s36/32.gif", "cheer");
   
// Show alert one times!
    $('div.emoWrap')
        .one("click", function() {
        if (emoMessage) {
            alert(emoMessage);
        }
    });
    // Click to show the code!
       $('.emo')
        .css('cursor', 'pointer')
        .live("click", function(e) {
        $('.emoKey')
            .remove();
        $(this)
            .after('<input class="emoKey" type="text" size="' + this.alt.length + '" value=" ' + this.alt + '" />');
$('.emoKey')
            .trigger("select");
e.stopPropagation();
    });
    $('.emoKey')
        .live("click", function() {
        $(this)
            .focus()
            .select();
    });

});
//]]>
</script>
</b:if>



4. Untuk memperindah, tambah background dengan mencari kode ]]></b:skin>
5. Letakan kode berikut diatasnya

.emoWrap{ background:#ccc; border: 1px solid #333; margin:5px; padding:10px;}

Mudah banget kan? sekian trik kali ini, semoga bermanfaat. terimakasih.

0 komentar

Post a Comment

Hai, Mohon Komentar Yang Relevan Dan Tidak OOT!