Tiếng Anh Cấp 4: Chèn bộ mặt cười (Emoticons) dạng input cho comment của blogspot style 2

Thứ Ba, 23 tháng 7, 2013

Chèn bộ mặt cười (Emoticons) dạng input cho comment của blogspot style 2

Emoticons input for comment of blogger blogspot - Chèn bộ mặt cười vào khung comments blogger

Hôm nay namkna hướng dẫn các bạn cách tạo bôm mặt cười (Emoticons) cho phàn comment của blogger. Với bản này khi bạn bấm vào một mặt cười sẽ có một khung hiện ký tự chèn vào blog ra và bạn chỉ càn copy dán vào là xong.

Trong tiện ích này mình kết hợp cả popup hướng dẫn mọi người sử dụng tiện ích khi truy cập blog của bạn.

Bấm vào để xem demo: View Demo

Ảnh minh họa:

Chèn bộ mặt cười (Emoticons) dạng input cho comment của blogspot style 2

Làm thế nào để cài đặt Emoticons cho blogger

1- Đăng nhập (login) vào Blog
2- Vào Mẫu (Template)
3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed) => Chọn Mở rộng tiện ích mẫu ( Expand Template Widgets)
4- Chèn code sau trước thẻ </body>

<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 = "Click vào biểu tượng sau đó copy xuống khung comment";
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
// 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  (sm)  (fu)  (ku)  (bg)  (lol)<br/><b><a href="javascript:openup_parseHTML()" rel="nofollow" title="Mã hóa code trước khi đưa vào bình luận"><span class="text_style">Mã hóa code đưa vào comments</span></a></b></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/AVvXsEjH095lM9wElHx3CtI4Ip0CD0W2lRkz2RcWNUaocWt6UgiRLDgWw5ID_eSImf2cGtfgE3eI_N-d5YQHiXcpFgcG7rrjcpO_6s6qfR7ejygp6sLYj5wNgQ4OtOYl2kYGDKZS8NL35Nyf6aw/s1600/38-namkna-blogspot-com.gif", ":))");
    emo(/\s;\(\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigOw1jgHIvIwyoTmOsxrbS_mZyB4RzrCdgH1_rqeewmsWeTUP7-73u71sWgQk709yXB9YWePduz0veBRK-mHYYl1r8lLL1lpDBPiQaUpSeNHr5MHsCMfTaJE9hWFN3jg-xbgOL0t_oJzE/s1600/39-namkna-blogspot-com.gif", ";((");
emo(/\s:\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiHw5uzDYcWPTQazT1uhqDdBt77B4yvPv7xDQ1CA016XmQ7oCuZVYaW-AWq7VZf_F4mD9Lt25ZFLU4G_b5qmFeg3Yf_9XEwv_JQMztF4U7iA8hUlhGfXWgIJJFJqa0Xj2WUj7i1Dv-IBg/s1600/01-namkna.gif", ":)");
emo(/\s:-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBEtRWVgvbNNo0zEbErn2G8p8tvQGleebwMEkuFXpGRmWDplTfnU8z14fiAdsXyiBTjX9H3IP5S2pD0erljAo4Q5GJHHMACKQZCT2cCGMfy3vCIJ7sUEkr3H0fdI_2lBdhoLWilrJOZcQ/s1600/02-namkna.gif", ":-)");
    emo(/\s=\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxNLLkb8OauNYSY1qQMRIen25DDj6JsQhWt9zcljSplX2jcHcCqmTphbZ28jUlyAAe9cpBgQi9u6kONonocHIMOE-Hf7eGj8ZZvUULWxAb-2vxa7Cyahmc3dsabz-TJMRoiu9-EuQ-UL8/s1600/03-namkna1.gif", "=))");
    emo(/\s;\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2GWSnO5DJZ4kLLuInbWVh0GGMMHohL92iDnCzl_7s68XdGcG-8rHhAZQFFyomWM1jIJwgKx1hR_sxChZNIzpUaqaTLvPY4a2sVgSkunz5xP08hBFaq7h5QzzjBpcsgGFrHmrluJD6YLA/s1600/04-namkna.gif", ";(");
    emo(/\s;-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj30Rpn4iVfHyloo8Y0Fb7M4BEL3aQLyCn6IuHMUeCBIhPcTvyQLjhFS03TVzbu4fjpvAIgQTcwC0LsOHuXZuYKTBGGCgQ1AsF5VjXSe00N74GwRmJcUTfKvDJqAcn3H8_5GfG1xtLxqqM/s1600/05-namkna.gif", ";-(");
    emo(/\s:d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY2f50M5VyKXudytzk2LoydE__GTwLMfNmZPthnw1sFexryOSluohsvUjkqX8w_gHH3I9RBd_dHw5WQC1HrFw_DlUkkWV9kVGVz7PI6OLtSyJjbM5Rnt9YVKN3MkPUSqhV8WLz-QEvpM4/s1600/07-namkna.gif", ":d");
    emo(/\s:-d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlk9gumMticjSQpLwQhOvlh6YV1iNSVIa42v1aE9tyLGptQkcMgT-2tCyJEme32Csrh32nNnncoM-PWykVkPBT3VBM2Xy39s57DLwpkpS0AcoZSQStRh-6ZgVORAWGj5g9nwwwghr0rqc/s1600/08-namkna.gif", ":-d");
    emo(/\s@-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitVBfplnEhzAC1kh0L1OkjNBnimMwlrwXKhWeDkOwYgjYa2D0wpInGQ0hyphenhyphenuSu87Pe0lMSyll-dpglTAJi8_djHJLaz6M5MkzGa6CP_uyrjP8TuqC-kevEVuF01-QO1KUuhnix1O7z2E9Q/s1600/09-namkna-blogspot-com.gif", "@-)");
    emo(/\s:p/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm4uMrLHiu_HA0BCg6PVTiQ57dVJ91hjSHP15R8pvZz5LCM8LFxC0bp8s5khdK0ldcA8hlma7wQAYbE2BI8awXHnwbE57_PW2bY5OL9BC2wETUvCAebGOV-0cKg_6IvbBLgxsIszyOIDM/s1600/10-namkna-blogspot-com.gif", ":p");
    emo(/\s:o/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqSUmrZ2wMDYv3YrN9rdueiXff_7rqV93fCt888zp910zfFCRPfLDCviMakCcgU01spyvIhSRT7YUf23d7V-EKKc2nAi6UbJaM02wOtWC7jcO7KpnazCOYSDD7cfiGFbh5LHBV1nMm9FQ/s1600/11-namkna-blogspot-com.gif", ":o");
    emo(/\s:&gt;\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI4VFqZVwsDal75k0CCSlnEonK7n5wl8a14CPVL00hyChyGKt6r5v1KBzWVD4oGOxemGk6JYXFeRlocY4sDm2LDrAIsuzkfyeju-VgP1SOLTY9nHZP46-kL8VFHtiKNCxIYRec1bH3ut4/s1600/12-namkna-blogspot-com.gif", ":&gt;)");
    emo(/\s\(o\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRR6zuF2aUjZLk9p7-jA4aeVuGh_ED1iazmjqtXeFigdCtnW7YoLVPRASz3n6Fka_sFxiJGuTbf2Lg0n2TWka0gilHlyOo2w_1nPEQb8N5DbFmAN93KchsJRSe8pNZgeiTTr_O8aBxFAk/s1600/13-namkna-blogspot-com.gif", "(o)");
    emo(/\s\[-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZ52Cxue3tEbojMgBsaG-PwTGvX5rFOND23s2CMmROqYqslQmDSoICEfCFNGIM6kMxkItUkQouY3QOcmQjnbN_7AovRAxEkfveoZEm9jUCRteKBIwf1CTlUIsYc4x266hUfYH9VSF9XBs/s1600/14-namkna-blogspot-com.gif", "[-(");
    emo(/\s:-\?/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNyJhIG9QN2x1CNpGZ-Ns6triTfPPCReel2j5JSZT5JQj5-2pNSOZouamOlBq3kh6QV6FgusvFidx02NtC6N26T1f6-ABmd1wUocg2FDMNDQVhXYgoKoPXAHvQ3xHKwDZQPxDZCm6Kj1g/s1600/15-namkna-blogspot-com.gif", ":-?");
    emo(/\s\(p\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXxQ22rjfK9L9srLJtQ9iIyN7e5VDfD-X0zwrrYvB1zEGZVW6t5xhNnMSAeAS2QkoxUFqpVoisb2ZWE05HtCe8noNvD1iRZmxRwpjNSndZO6LZJXatUriR9JLYr1EV5bl_9vyC3tPNnN8/s1600/16-namkna-blogspot-com.gif", "(p)");
    emo(/\s:-s/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBW-BY2D_52QUTXHzrUCoewiG8ohjJHJ2x86epbikLIfT8JVMMWxXqi1VvkUzUzy7jbsX0Q5zQPDSLeN9r4CbPjp1eaR_XQ2EhmyujHGSjnBhF8nSc97gsyhfNovDj65MPnxqU2P76QBo/s1600/17-namkna-blogspot-com.gif", ":-s");
    emo(/\s\(m\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWqFla87oz_cZ9wWV420K1Ity_SUYJu03qUrN21vylEtd7qbu0mBMhWF6cWEqu1zjSBMSrOSBxrIZT5ZmN_9LzJHXE7YeLeCrPVNhV85mAAP_3_aLZmftl-Px0pdQINKB1a7FPvxIv5vk/s1600/18-namkna-blogspot-com.gif", "(m)");
    emo(/\s8-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8YQsApVyYHPTtMZER60YXe92hwLrPuE5lk9jLGdKkVlgRptBGANLtw3iAmn1DZPi21ntP0yIJNPwGW1jz9KZROcFm-cMoA4ejzfaSSjPSybX2Q4eKM7CYR-blxxFkoRhmSicE7GPLjTY/s1600/19-namkna-blogspot-com.gif", "8-)");
    emo(/\s:-t/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhciXT0T0D7_KfADEBifPR2cfPrKiJrwsNGJYENIxv97uT0MFXCa7RKbmijVd3g6FHcE8XN5qN63HWiWEaSaF3CAN4EZtYV4OJ7s5F71w6-JfXEGt_ZctOSRrHTnwjOdUbuTe7ojVvPBKI/s1600/20-namkna-blogspot-com.gif", ":-t");
    emo(/\s:-b/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfB8th_3UVt4gtyUQDjZXahtpSroQWi7qCtOxGr6UQrEBlthtWokqUzS2OrVHFNmwOFxmmz3sBxterBIo64D1Z7QsVKrGb7S-S1-4hag3AimtSzgg5XLxaF9b0GBNXktkQQ1KiSY4hFFk/s1600/21-namkna-blogspot-com.gif", ":-b");
    emo(/\sb-\(+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNaNS8oXyD4ape6xCPjlxhlpmPDoErX08WMWeSaUlG60_6UJSQCbDu3O7pstUR4D7I4HTYr1QM4623HrPd4m5QHiv68MuexuTtjGR6X-xJtkKj34dw1lLTjl4PdZN_oTro_eq8tJa5XQY/s1600/22-namkna-blogspot-com.gif", "b-(");
    emo(/\s:-#/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4WC2UqV4W_HzC1xWgUNMleCDNk3OmEoldAl-xdHb1LTpVb8v_brenSBoWxDGH2MFKOhKtSg6elCG8PsinDAMewJ-KGtmEXreqXQcAtU1YTjbSeUNrsenIyoblA4c3cwktbxAM12XePPg/s1600/23-namkna-blogspot-com.gif", ":-#");
    emo(/\s=p~/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFpnFs9ybHxaSOSrpQWKuK_MiY5kSouhTVQUtCiHl1l31kvcN-QpPz3PenkBUiUMx-n-xJsCT66Q5TcFZvH209Oifss6ftKgaC8ZSavWlh0EmYjsj1ZObl3jQeAnRgHgt1WU2jtZdZLec/s1600/24-namkna-blogspot-com.gif", "=p~");
    emo(/\s\$-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLRfBYspycWEy4Rh2eix31dX2JObVxy_7JckF0wYeyTeZYMJngw7EgIdiiWl5RqIDRjm6SpvN95rWVfhSPTctB61BT6JxJ9a1utWXQdqvFD4NsJaitl1ZQegHx70CuFOdy7-u-oP6zvpo/s1600/25-namkna-blogspot-com.gif", "$-)");
    emo(/\s\(b\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhveiilw_2gqTTMV6A_JU7ieC-mWkvLCeJlljrQSeFxhUTzVDlo_rzK0pqC83oPCd7DDO0kADaFHEiZKqJzHTvblfjCAVyB3n9GeAhu6x_W0SAFPehSkuqOrq-bDQBZxa_aS5WBJfX23co/s1600/26-namkna-blogspot-com.gif", "(b)");
    emo(/\s\(f\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxv-pUGPop8VwytKQAi6HWqkyGdZF0DBW8x8W9iWiiJwhVGM9XtYq0aiIb6RzV-CaCFIVZgZNogoJb2D4q5vEeH9sXpIdqIK34nWW7FbrYHC2yZShF__xGJf4YZk6VpmTWjIkRWVmwqwU/s1600/27-namkna-blogspot-com.gif'", "(f)");
    emo(/\sx-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwlgMyJj6fldbooDry9i3HzV9PuyC88z9Qcj3U5RMuwwfjSzrOZ6wSQQHJmrbe_nY9m6QqCcoXIUiiehWV4DXlHf6ZCn9cRzXlrGmA5QahQ9lMyZV_TS1YKF2hQbRldwQsSal51Y3rgC8/s1600/28-namkna-blogspot-com.gif", "x-)");
    emo(/\s\(k\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhON6a6D9eQ8jIlo_Lh2F5ySUHmQmczMdKGCbWvdylePZ73cMkyhLfIwKqqbVk46QCz7k8sq6aeZU2qLU_wwUfk_A-wCeYzSkUHp64ddnc1o8bQo71nRR9GgW6ZdHu739tq-iHumoPcXxg/s1600/29-namkna-blogspot-com.gif", "(k)");
    emo(/\s\(h\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuDdyO4UjS0AVIBFLsfqVwgjTMHTRlPPfdc8of_-ln4mgo4vMRleDVRuh_-EA4cMB5EJM9ympW0KHxYejHdHK2OrgN5rMBJK0A2cxuPqqTcZmh5PMdOFfurd45i1C8mG2XJMltz1xmsv4/s1600/30-namkna-blogspot-com.gif", "(h)");
    emo(/\s\(c\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVyIPB6ee12ytGQWq_yseL7VsjCDH3xFh7VU8eY1S75SYro_wIe_h8CrzHjyZSxxNkcbvzuGVQoQ8mijWo7_JNx54SmTsXeNKdQaXVCnskdgHLVT0E6Plz5OuP0IWVBHfJXc51640Xt18/s1600/31-namkna-blogspot-com.gif", "(c)");
    emo(/\scheer/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBXnZBidmIBJoUmL6uJEVXEsx_TfuUVLVoJQ7U2hhY4Alp9RKgRPydx0iv3k8L0kXPTjw06YwICGlLLTirg0visYhFBcVenugZ8ls6sog-lWyOfE5gpbeyErHorL7atDXrsCa7F-DP3Go/s1600/32-namkna-blogspot-com.gif", "cheer");
    emo(/\s\(s\m\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHX_tEJW7JHgmjli-FoEkZmKeWCGTsySLOHeesT5RyPmgxryreS4IMDnvkTDady-EcwZNPmyBx8NXQ1dGA7xFx4GJTOMFFahr1jMTl7GKyeJDckWbhArkewBg_mT0xWLtm4mm5IbTNBmY/s1600/33-namkna-blogspot-com.gif", "(sm)");
    emo(/\s\(f\u\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji2vkRDc5x6xPkOxm8A5dqE8cqUFrqoPhrV3FK86zHrfRdm7Vw7cqE4fYQbhfJZTyqwCMia_VjNEeF3vd_P6rKqWM0O73l-DLtj9LVlEpWM1_JcKEooxIbT3GkBqm23wbBrYPwey1UfcU/s1600/34-namkna-blogspot-com.gif", "(fu)");
    emo(/\s\(k\u\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrQxfGv8kSBdu68eT0gVPnmSxd8blBl_mA4sX-gSHoFpYTPln3RA44l5ZUx252D4rFOlSAnwWXjk_z9Z4ITKu9w6AZhfTqoxYkeMmxOzLIQw4thO_UcTPq4CNW9lT7KhKyCSfX3_qucZE/s1600/35-namkna-blogspot-com.gif", "(ku)");
    emo(/\s\(b\g\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijsrANiuPPNYHHKN1Ms1yjud2L0SiqRov_RxxrINQwM9YIqHLwTaZ69XDOHVQobjLrgWmswIP88l-9rADJWXy9NFHEw1B7lPeq1CVgXbmOC7yfWOBg3hb_INR2EuRz1zKjH4afSgxNBvA/s1600/36-namkna-blogspot-com.gif", "(bg)");
    emo(/\s\(l\o\l\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigRlEYarHqjemjyrInU-uMzbkpUecvS8fPnlUkmJe32OfB0eScXYi9WbWkCfJfDicXXySepk3B0WNfJV1diVXI2BWvEx3RG2-duXQFAueZweqGZMnicODkKn8cphcVMBpm-t5hzNxABhY/s1600/37-namkna-blogspot-com.gif", "(lol)");

// 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>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
 $('.separator a').attr({'class':'fancy','data-fancybox-group':'gallery'});
$('.fancy')
.fancybox({padding: 5, openEffect : 'elastic', openSpeed  : 400, closeEffect : 'elastic', closeSpeed  : 400, closeClick : true, helpers : {overlay : null}});
});
//]]>
</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
 $('.separator a').attr({'class':'fancy','data-fancybox-group':'gallery'});
$('.fancy')
.fancybox({padding: 5, openEffect : 'elastic', openSpeed  : 400, closeEffect : 'elastic', closeSpeed  : 400, closeClick : true, helpers : {overlay : null}});
});
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.emoWrap",
    putEmoAbove = "iframe#comment-editor",
    emoMessage = "Chọn mặt cười sau đó copy xuống khung comment";
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
// 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  (sm)  (fu)  (ku)  (bg)  (lol)  <br/><b><a href="javascript:openup_parseHTML()" rel="nofollow" title="Mã hóa code trước khi đưa vào bình luận"><span class="text_style">Mã hóa code đưa vào comments</span></a></b></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/AVvXsEjH095lM9wElHx3CtI4Ip0CD0W2lRkz2RcWNUaocWt6UgiRLDgWw5ID_eSImf2cGtfgE3eI_N-d5YQHiXcpFgcG7rrjcpO_6s6qfR7ejygp6sLYj5wNgQ4OtOYl2kYGDKZS8NL35Nyf6aw/s1600/38-namkna-blogspot-com.gif", ":))");
    emo(/\s;\(\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigOw1jgHIvIwyoTmOsxrbS_mZyB4RzrCdgH1_rqeewmsWeTUP7-73u71sWgQk709yXB9YWePduz0veBRK-mHYYl1r8lLL1lpDBPiQaUpSeNHr5MHsCMfTaJE9hWFN3jg-xbgOL0t_oJzE/s1600/39-namkna-blogspot-com.gif", ";((");
emo(/\s:\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiHw5uzDYcWPTQazT1uhqDdBt77B4yvPv7xDQ1CA016XmQ7oCuZVYaW-AWq7VZf_F4mD9Lt25ZFLU4G_b5qmFeg3Yf_9XEwv_JQMztF4U7iA8hUlhGfXWgIJJFJqa0Xj2WUj7i1Dv-IBg/s1600/01-namkna.gif", ":)");
emo(/\s:-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBEtRWVgvbNNo0zEbErn2G8p8tvQGleebwMEkuFXpGRmWDplTfnU8z14fiAdsXyiBTjX9H3IP5S2pD0erljAo4Q5GJHHMACKQZCT2cCGMfy3vCIJ7sUEkr3H0fdI_2lBdhoLWilrJOZcQ/s1600/02-namkna.gif", ":-)");
    emo(/\s=\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxNLLkb8OauNYSY1qQMRIen25DDj6JsQhWt9zcljSplX2jcHcCqmTphbZ28jUlyAAe9cpBgQi9u6kONonocHIMOE-Hf7eGj8ZZvUULWxAb-2vxa7Cyahmc3dsabz-TJMRoiu9-EuQ-UL8/s1600/03-namkna1.gif", "=))");
    emo(/\s;\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2GWSnO5DJZ4kLLuInbWVh0GGMMHohL92iDnCzl_7s68XdGcG-8rHhAZQFFyomWM1jIJwgKx1hR_sxChZNIzpUaqaTLvPY4a2sVgSkunz5xP08hBFaq7h5QzzjBpcsgGFrHmrluJD6YLA/s1600/04-namkna.gif", ";(");
    emo(/\s;-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj30Rpn4iVfHyloo8Y0Fb7M4BEL3aQLyCn6IuHMUeCBIhPcTvyQLjhFS03TVzbu4fjpvAIgQTcwC0LsOHuXZuYKTBGGCgQ1AsF5VjXSe00N74GwRmJcUTfKvDJqAcn3H8_5GfG1xtLxqqM/s1600/05-namkna.gif", ";-(");
    emo(/\s:d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY2f50M5VyKXudytzk2LoydE__GTwLMfNmZPthnw1sFexryOSluohsvUjkqX8w_gHH3I9RBd_dHw5WQC1HrFw_DlUkkWV9kVGVz7PI6OLtSyJjbM5Rnt9YVKN3MkPUSqhV8WLz-QEvpM4/s1600/07-namkna.gif", ":d");
    emo(/\s:-d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlk9gumMticjSQpLwQhOvlh6YV1iNSVIa42v1aE9tyLGptQkcMgT-2tCyJEme32Csrh32nNnncoM-PWykVkPBT3VBM2Xy39s57DLwpkpS0AcoZSQStRh-6ZgVORAWGj5g9nwwwghr0rqc/s1600/08-namkna.gif", ":-d");
    emo(/\s@-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitVBfplnEhzAC1kh0L1OkjNBnimMwlrwXKhWeDkOwYgjYa2D0wpInGQ0hyphenhyphenuSu87Pe0lMSyll-dpglTAJi8_djHJLaz6M5MkzGa6CP_uyrjP8TuqC-kevEVuF01-QO1KUuhnix1O7z2E9Q/s1600/09-namkna-blogspot-com.gif", "@-)");
    emo(/\s:p/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm4uMrLHiu_HA0BCg6PVTiQ57dVJ91hjSHP15R8pvZz5LCM8LFxC0bp8s5khdK0ldcA8hlma7wQAYbE2BI8awXHnwbE57_PW2bY5OL9BC2wETUvCAebGOV-0cKg_6IvbBLgxsIszyOIDM/s1600/10-namkna-blogspot-com.gif", ":p");
    emo(/\s:o/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqSUmrZ2wMDYv3YrN9rdueiXff_7rqV93fCt888zp910zfFCRPfLDCviMakCcgU01spyvIhSRT7YUf23d7V-EKKc2nAi6UbJaM02wOtWC7jcO7KpnazCOYSDD7cfiGFbh5LHBV1nMm9FQ/s1600/11-namkna-blogspot-com.gif", ":o");
    emo(/\s:&gt;\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI4VFqZVwsDal75k0CCSlnEonK7n5wl8a14CPVL00hyChyGKt6r5v1KBzWVD4oGOxemGk6JYXFeRlocY4sDm2LDrAIsuzkfyeju-VgP1SOLTY9nHZP46-kL8VFHtiKNCxIYRec1bH3ut4/s1600/12-namkna-blogspot-com.gif", ":&gt;)");
    emo(/\s\(o\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRR6zuF2aUjZLk9p7-jA4aeVuGh_ED1iazmjqtXeFigdCtnW7YoLVPRASz3n6Fka_sFxiJGuTbf2Lg0n2TWka0gilHlyOo2w_1nPEQb8N5DbFmAN93KchsJRSe8pNZgeiTTr_O8aBxFAk/s1600/13-namkna-blogspot-com.gif", "(o)");
    emo(/\s\[-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZ52Cxue3tEbojMgBsaG-PwTGvX5rFOND23s2CMmROqYqslQmDSoICEfCFNGIM6kMxkItUkQouY3QOcmQjnbN_7AovRAxEkfveoZEm9jUCRteKBIwf1CTlUIsYc4x266hUfYH9VSF9XBs/s1600/14-namkna-blogspot-com.gif", "[-(");
    emo(/\s:-\?/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNyJhIG9QN2x1CNpGZ-Ns6triTfPPCReel2j5JSZT5JQj5-2pNSOZouamOlBq3kh6QV6FgusvFidx02NtC6N26T1f6-ABmd1wUocg2FDMNDQVhXYgoKoPXAHvQ3xHKwDZQPxDZCm6Kj1g/s1600/15-namkna-blogspot-com.gif", ":-?");
    emo(/\s\(p\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXxQ22rjfK9L9srLJtQ9iIyN7e5VDfD-X0zwrrYvB1zEGZVW6t5xhNnMSAeAS2QkoxUFqpVoisb2ZWE05HtCe8noNvD1iRZmxRwpjNSndZO6LZJXatUriR9JLYr1EV5bl_9vyC3tPNnN8/s1600/16-namkna-blogspot-com.gif", "(p)");
    emo(/\s:-s/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBW-BY2D_52QUTXHzrUCoewiG8ohjJHJ2x86epbikLIfT8JVMMWxXqi1VvkUzUzy7jbsX0Q5zQPDSLeN9r4CbPjp1eaR_XQ2EhmyujHGSjnBhF8nSc97gsyhfNovDj65MPnxqU2P76QBo/s1600/17-namkna-blogspot-com.gif", ":-s");
    emo(/\s\(m\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWqFla87oz_cZ9wWV420K1Ity_SUYJu03qUrN21vylEtd7qbu0mBMhWF6cWEqu1zjSBMSrOSBxrIZT5ZmN_9LzJHXE7YeLeCrPVNhV85mAAP_3_aLZmftl-Px0pdQINKB1a7FPvxIv5vk/s1600/18-namkna-blogspot-com.gif", "(m)");
    emo(/\s8-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8YQsApVyYHPTtMZER60YXe92hwLrPuE5lk9jLGdKkVlgRptBGANLtw3iAmn1DZPi21ntP0yIJNPwGW1jz9KZROcFm-cMoA4ejzfaSSjPSybX2Q4eKM7CYR-blxxFkoRhmSicE7GPLjTY/s1600/19-namkna-blogspot-com.gif", "8-)");
    emo(/\s:-t/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhciXT0T0D7_KfADEBifPR2cfPrKiJrwsNGJYENIxv97uT0MFXCa7RKbmijVd3g6FHcE8XN5qN63HWiWEaSaF3CAN4EZtYV4OJ7s5F71w6-JfXEGt_ZctOSRrHTnwjOdUbuTe7ojVvPBKI/s1600/20-namkna-blogspot-com.gif", ":-t");
    emo(/\s:-b/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfB8th_3UVt4gtyUQDjZXahtpSroQWi7qCtOxGr6UQrEBlthtWokqUzS2OrVHFNmwOFxmmz3sBxterBIo64D1Z7QsVKrGb7S-S1-4hag3AimtSzgg5XLxaF9b0GBNXktkQQ1KiSY4hFFk/s1600/21-namkna-blogspot-com.gif", ":-b");
    emo(/\sb-\(+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNaNS8oXyD4ape6xCPjlxhlpmPDoErX08WMWeSaUlG60_6UJSQCbDu3O7pstUR4D7I4HTYr1QM4623HrPd4m5QHiv68MuexuTtjGR6X-xJtkKj34dw1lLTjl4PdZN_oTro_eq8tJa5XQY/s1600/22-namkna-blogspot-com.gif", "b-(");
    emo(/\s:-#/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4WC2UqV4W_HzC1xWgUNMleCDNk3OmEoldAl-xdHb1LTpVb8v_brenSBoWxDGH2MFKOhKtSg6elCG8PsinDAMewJ-KGtmEXreqXQcAtU1YTjbSeUNrsenIyoblA4c3cwktbxAM12XePPg/s1600/23-namkna-blogspot-com.gif", ":-#");
    emo(/\s=p~/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFpnFs9ybHxaSOSrpQWKuK_MiY5kSouhTVQUtCiHl1l31kvcN-QpPz3PenkBUiUMx-n-xJsCT66Q5TcFZvH209Oifss6ftKgaC8ZSavWlh0EmYjsj1ZObl3jQeAnRgHgt1WU2jtZdZLec/s1600/24-namkna-blogspot-com.gif", "=p~");
    emo(/\s\$-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLRfBYspycWEy4Rh2eix31dX2JObVxy_7JckF0wYeyTeZYMJngw7EgIdiiWl5RqIDRjm6SpvN95rWVfhSPTctB61BT6JxJ9a1utWXQdqvFD4NsJaitl1ZQegHx70CuFOdy7-u-oP6zvpo/s1600/25-namkna-blogspot-com.gif", "$-)");
    emo(/\s\(b\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhveiilw_2gqTTMV6A_JU7ieC-mWkvLCeJlljrQSeFxhUTzVDlo_rzK0pqC83oPCd7DDO0kADaFHEiZKqJzHTvblfjCAVyB3n9GeAhu6x_W0SAFPehSkuqOrq-bDQBZxa_aS5WBJfX23co/s1600/26-namkna-blogspot-com.gif", "(b)");
    emo(/\s\(f\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxv-pUGPop8VwytKQAi6HWqkyGdZF0DBW8x8W9iWiiJwhVGM9XtYq0aiIb6RzV-CaCFIVZgZNogoJb2D4q5vEeH9sXpIdqIK34nWW7FbrYHC2yZShF__xGJf4YZk6VpmTWjIkRWVmwqwU/s1600/27-namkna-blogspot-com.gif'", "(f)");
    emo(/\sx-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwlgMyJj6fldbooDry9i3HzV9PuyC88z9Qcj3U5RMuwwfjSzrOZ6wSQQHJmrbe_nY9m6QqCcoXIUiiehWV4DXlHf6ZCn9cRzXlrGmA5QahQ9lMyZV_TS1YKF2hQbRldwQsSal51Y3rgC8/s1600/28-namkna-blogspot-com.gif", "x-)");
    emo(/\s\(k\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhON6a6D9eQ8jIlo_Lh2F5ySUHmQmczMdKGCbWvdylePZ73cMkyhLfIwKqqbVk46QCz7k8sq6aeZU2qLU_wwUfk_A-wCeYzSkUHp64ddnc1o8bQo71nRR9GgW6ZdHu739tq-iHumoPcXxg/s1600/29-namkna-blogspot-com.gif", "(k)");
    emo(/\s\(h\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuDdyO4UjS0AVIBFLsfqVwgjTMHTRlPPfdc8of_-ln4mgo4vMRleDVRuh_-EA4cMB5EJM9ympW0KHxYejHdHK2OrgN5rMBJK0A2cxuPqqTcZmh5PMdOFfurd45i1C8mG2XJMltz1xmsv4/s1600/30-namkna-blogspot-com.gif", "(h)");
    emo(/\s\(c\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVyIPB6ee12ytGQWq_yseL7VsjCDH3xFh7VU8eY1S75SYro_wIe_h8CrzHjyZSxxNkcbvzuGVQoQ8mijWo7_JNx54SmTsXeNKdQaXVCnskdgHLVT0E6Plz5OuP0IWVBHfJXc51640Xt18/s1600/31-namkna-blogspot-com.gif", "(c)");
    emo(/\scheer/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBXnZBidmIBJoUmL6uJEVXEsx_TfuUVLVoJQ7U2hhY4Alp9RKgRPydx0iv3k8L0kXPTjw06YwICGlLLTirg0visYhFBcVenugZ8ls6sog-lWyOfE5gpbeyErHorL7atDXrsCa7F-DP3Go/s1600/32-namkna-blogspot-com.gif", "cheer");
    emo(/\s\(sm\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHX_tEJW7JHgmjli-FoEkZmKeWCGTsySLOHeesT5RyPmgxryreS4IMDnvkTDady-EcwZNPmyBx8NXQ1dGA7xFx4GJTOMFFahr1jMTl7GKyeJDckWbhArkewBg_mT0xWLtm4mm5IbTNBmY/s1600/33-namkna-blogspot-com.gif", "(sm)");
    emo(/\s\(f\u\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji2vkRDc5x6xPkOxm8A5dqE8cqUFrqoPhrV3FK86zHrfRdm7Vw7cqE4fYQbhfJZTyqwCMia_VjNEeF3vd_P6rKqWM0O73l-DLtj9LVlEpWM1_JcKEooxIbT3GkBqm23wbBrYPwey1UfcU/s1600/34-namkna-blogspot-com.gif", "(fu)");
    emo(/\s\(k\u\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrQxfGv8kSBdu68eT0gVPnmSxd8blBl_mA4sX-gSHoFpYTPln3RA44l5ZUx252D4rFOlSAnwWXjk_z9Z4ITKu9w6AZhfTqoxYkeMmxOzLIQw4thO_UcTPq4CNW9lT7KhKyCSfX3_qucZE/s1600/35-namkna-blogspot-com.gif", "(ku)");
    emo(/\s\(b\g\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijsrANiuPPNYHHKN1Ms1yjud2L0SiqRov_RxxrINQwM9YIqHLwTaZ69XDOHVQobjLrgWmswIP88l-9rADJWXy9NFHEw1B7lPeq1CVgXbmOC7yfWOBg3hb_INR2EuRz1zKjH4afSgxNBvA/s1600/36-namkna-blogspot-com.gif", "(bg)");
    emo(/\s\(l\o\l\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigRlEYarHqjemjyrInU-uMzbkpUecvS8fPnlUkmJe32OfB0eScXYi9WbWkCfJfDicXXySepk3B0WNfJV1diVXI2BWvEx3RG2-duXQFAueZweqGZMnicODkKn8cphcVMBpm-t5hzNxABhY/s1600/37-namkna-blogspot-com.gif", "(lol)");
 
// 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>

<div class='cleared'/>
<script type='text/javascript'>
function openup_parseHTML() { window.open(&quot;http://namkna.blogspot.com/p/code-convert-for-blogspot-chuyen-doi.html&quot;, &quot;followblog&quot;, &quot;height=700, width=630, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, directories=no, status=no&quot; ); }
</script>

5- Lưu mẫu lại.

- Lúc này khung comments của bạn đã xuất hiện các biểu tượng mặt cười nhưng chưa di chuyển khi Trả Lời comments nên không thuận tiện trong việc chèn mặt cười vào comment.

Tùy biến cho mẫu threaded comment của blogger.

- Bước tiếp theo sẽ giúp cho khung mặt cười trên di chuyển theo nhận xét.
1- Vào Mẫu (Template) => Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed) => Chọn Mở rộng tiện ích mẫu ( Expand Template Widgets)
1- Tìmđoạn code như bên dưới.

<b:includable id='threaded-comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <b:if cond='data:mobile'>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
    <b:else/>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
   </b:if>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>
</b:includable>

- Thêm vào sau thẻ <b:else/> (phần mình tô màu xanh) đoạn code bên dưới:

<div id='threaded-comment-form'>

- Thêm vào trước thẻ </b:if> (phần mình tô màu xanh) đoạn code bên dưới:

</div>

- Xem hình minh họa dưới để thấy rõ hơn:

2- Tìm đoạn code sau:

document.getElementById(domId).insertBefore(replybox, null);

- Tahy thế nó thành đoạn code bên dưới:

document.getElementById(domId).insertBefore(document.getElementById('threaded-comment-form'), null);

3- Lưu mẫu của bạn lại và xem kết quả nha.

Theo: Troll VL

Tiếng Anh Cấp 4

Thứ Ba, 23 tháng 7, 2013

Chèn bộ mặt cười (Emoticons) dạng input cho comment của blogspot style 2

Chèn bộ mặt cười (Emoticons) dạng input cho comment của blogspot style 2

Làm thế nào để cài đặt Emoticons cho blogger

Tùy biến cho mẫu threaded comment của blogger.

Không có nhận xét nào:

Đăng nhận xét

Bài đăng phổ biến