Để tránh đơn điệu cho blogger. Hôm nay mình giới thiệu một mẫu mặt cười (Emoticons) dạng hover tooltips. cho nhận xét Với kiểu Emoticons này sẽ hiện ra một khung tooltips hover danh sách các mặt cười cho độc giả sử dụng khi comment. Giúp blog của bạn gọn hơn. Mẫu hiển thị tốt với các mẫu comment cũ và trên các trình duyệt như IE, Firefoc, Chroome, opera,safari,... Thủ thuật có thể áp dụng trên các mẫu blog cũ và các mẫu thread comment của blogger (rất đa dạng phải không).
Các bạn hãy xem blog demo hoặc ảnh minh họa bên dưới để thấy rõ hơn.
XEM DEMO
» Bắt đầu thủ thuật
1. Đăng nhập vào tài khoản Blogger2. Vào phần Mẫu (Template)
3. Chọn Chỉnh sửa HTML => Chọn Mở rộng tiện ích mẫu.
4. Chèn đoạn mã dưới đây trước thẻ </body> :
<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("comment-holder");
theText = bodyText.innerHTML;
theText = theText.replace(/=\)\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYmMUGcmOn3aNDu6bueSywfdCgcCkbZZY-PavxBxXuwK8-KhzCct5VcClJoSzi0lmOfpz99H1ngrIBeEDceXwotKjfoEUUhvciBuovZvcA-72_XJKWaWBFLrJ3SO7JApewj-bXctb0NNU/'/>");
theText = theText.replace(/:\)\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9us-yhiDc6JKdYJkuVjsOJKSHs6trqdQWzfehEE7McwG5fOtCy3aauBX7bUCoUOPL_b_Lx_QWQRsqyQDcrLvaxsJJ2zJRt2MPGqaCjO8rc_poWG3gCvBoBHCDQJ9Yj-i9RSfVPNKKSEY/'/>");
theText = theText.replace(/X-\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8nClW42wI_9NXWAXZVgiCJuD0aRsg4cXYvoM9WchgAZedGcAt1Or7xnMFFLdy8K0QzeWZLyr_n_PBaCuOzqr6sJztn79qrumG-FNaLJWW1sm2M8x5u1aLJXsr_HpACgga49GRBr9her4/'/>");
theText = theText.replace(/:\(\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Td6FSxKTglmvTJwOcvDJM7L0fvDDIYR5DhRn0B-6KjkJDzcloaZBhfofK1UOKzQ_u6qMMKhYJujO2n-NiNYHxqJ4qPgCZVyTDMlsP3-DChwVUt4teDneSFFntGzSPgbJyzpOXWsxM7M/'/>");
theText = theText.replace(/b-\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOCqsL9jjUTvSJgF1ErmY5HdPUgEParZRffI5EuHJECNhzzrbbIRfZLxYrP8_Kc8Oz3ZsrbGQ7cXXZJRVrjt_gUGdnZtewtsctQaQL4qnjOkSFojY88GgEr4r6g2eKGEu0qSL1hF2Cm-c/'/>");
theText = theText.replace(/=d>/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrw1no5mqZXWweUrtL5bnTOX7mE4B6XWjqLBhgmDbQtFYUTLjv58rteRbFZFLvIKYuiBK6fMGpil7Q0THlAXPV-b_TqaxggmNibvNc1uW0rXXrCE-goqds11Wh5TUhM0mz3Ek5k2yNHH0/'/>");
theText = theText.replace(/b-\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtokg0Jm2H1zUzG0sOAUXK2kyVhgS5bhd8sZAmz9Uo7eFhdpDzTDs2yciXqCqlHFFlauqrA-vxmjY4CPJNgdAP5fD7waH-NJz9xDfTfEhp7zBSPJ3N6_C96N8gqcGK-gVcncm4IJshZck/'/>");
theText = theText.replace(/:D/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZyS0C85CMR7GzItgQyKABrKeyi2VoCQktUC6aX1cJcJFC3Q92H7AMeX9pkyDngi2Z25hUhgFpItDsme9mDxQe113w1z3-e5-I1NH8cGeiBzCk4qFAVoBRVqsU32yTVQ5xS09A79hypMM/'/>");
theText = theText.replace(/:-\?/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNagg-qK14MZfwodTRkhrs9OU2RYEKocM5yzhxop_8DjZz3SWPGgHetdiMIEtFo7w2p8gHcjsLjAe1ubt0a_lZUHOt0Z9OTo4rTkqvcK5yoZpfA0DEZE2YeaA1WwTPiEXkR2eLRwzUwuI/'/>");
theText = theText.replace(/:->/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUG-geOqCqtLkm56Hnvlg34bEXcM2e9gIF5qiiBWrIoIzrCjN4M9RNo8gKKeWIoyd0zth3tCVNRm0mK9DrNeQnz2iGT45uxf72p_XCvOW6IDZ8WJpdSrNxT1IXhy3VWPoT-99Pvib5Xpc/'/>");
theText = theText.replace(/:-o/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT8ntJ1mC_J70j-OUyNOqqY4KN85pqQ-d9_uu9Y4I-FMFtF8lAQybq5GnEtBT08ui8UthaLDuwd1CowciAls3wCs91pX21yBaTsRjyTmoVBJ3Wj2L5NsX-RijY8aQLJ40FcqBmVY3jSFU/'/>");
theText = theText.replace(/:\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPrN2ZeiOkWhN6bxHYCrXS8mmww5x8EsNlLfcxUn_W6BYyj6GxlQc_Yvui6A8B6bMdr5GPUg9DlTRxvY5yOWX70sJc4mm5SfL2o0D3t8a55QkHKykFOyvuwVgTr0msJgiK1GqVwrmksWw/'/>");
theText = theText.replace(/\[-\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMnGInhPwyz1ZJhdlSd8Ek6ORvQJyOfvvZ0X3MYiI2BjOcoTfjeocU3dx7Evc3YMUGn2IshbhI_GHNOlAtzpH0gqfAXnNAD3eMdMxOtyyX0GcB12ELIw5DgCABPdxxGY5adCmNuwsODEI/'/>");
theText = theText.replace(/@-\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8o8nOdOYgnZhrelpQt33Ujr823tjoNzMI4sMj3izYY1xvEKBFt08Pngj9QtPysyT6mOLuYK9DZ5j25FNR4Xi0KKkAAQ3eaLUnt2PPOBSpm8EYtdBAtxuJsKZZjbWegdQX2agXcibK18w/'/>");
theText = theText.replace(/:-s/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiCO1Rd0fY4MjMMA4LtDuf8wmSjyTxnSi0NpWvmtIBJXTb7f-IR8_hSW0gAV_ZoXvkJ61NUHDGnxM8_tv8wBLp1LLM6JIyi1t_70vsPYrenooxc35EqO9nyf0dgKu1N853XeecQ7DqRZ8/'/>");
theText = theText.replace(/:\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiClq2mZyskj7Yk7p1EukHXBAMC2D4j6YF0z8yk7Z0UjHXPf4tfbiaq9xMgZDoX-ZRCpot5JcY6psvvVz3mR_2Iwx0G9S-jpFhvZIBbZlhYe2d8sqPjr8aTTnPLxvuZwieUBsQzH7WZBsk/'/>");
theText = theText.replace(/:p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh-6d1SP60WJcbUNZj_Qy6xjf4KFOAID28LnMXlKSdHcNd2TP3JhdGiIbkTa1M0Xqol3S6-KiMK5agJycU7Y2nhliKvZ-kC19JdHgatoJWCpjOxhTcwTHci54KDx5k5F079SNbwtrnULo/'/>");
theText = theText.replace(/:\*/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhCjNtAg_cx9Eud238wIAHgCWYSOVkRPpQPVe8oPVwcKXwmAwoRrD0TE8oStGUGjXLJ6A31M-6AIOkN4Ygb8IGgrl7_5ZK8nBuM_sMiwDbDqxPdpo9x6XvZvHySPtl83B_jICgU8YaZUE/'/>");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>
-Lưu ý: Với những ai sử dụng mẫu comment cũ thì thay dòngbodyText = document.getElementById("comment-holder");
Thành:bodyText = document.getElementById("comment-holder");
5- Tìm đoạn code sau:<b:loop values='data:post.comments' var='comment'>
- Thêm thẻ bên dưới vào trước đoạn code vừa tìm được.
<div id='emocomments'>6-Tìm thẻ đóng tương ứng với thẻ trên
</b:loop>
- Và thêm sau nó thẻ
</div>
7- Bước này là hiển thị những ký tự tắt và emoticons tương ứng với nó cho người đọc có thể biết được để chèn vào khung Nhận xét.
-
7.1- Tìm đến thẻ
<data:blogTeamBlogMessage/>- Và chèn đoạn mã dưới đây vào sau nó:
<h5 class='the-tooltip top left emo'> Chèn Emoticons <div class='comment_emo_list'> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9us-yhiDc6JKdYJkuVjsOJKSHs6trqdQWzfehEE7McwG5fOtCy3aauBX7bUCoUOPL_b_Lx_QWQRsqyQDcrLvaxsJJ2zJRt2MPGqaCjO8rc_poWG3gCvBoBHCDQJ9Yj-i9RSfVPNKKSEY/'/><span> :))</span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Td6FSxKTglmvTJwOcvDJM7L0fvDDIYR5DhRn0B-6KjkJDzcloaZBhfofK1UOKzQ_u6qMMKhYJujO2n-NiNYHxqJ4qPgCZVyTDMlsP3-DChwVUt4teDneSFFntGzSPgbJyzpOXWsxM7M/'/><span> :((</span> </div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZyS0C85CMR7GzItgQyKABrKeyi2VoCQktUC6aX1cJcJFC3Q92H7AMeX9pkyDngi2Z25hUhgFpItDsme9mDxQe113w1z3-e5-I1NH8cGeiBzCk4qFAVoBRVqsU32yTVQ5xS09A79hypMM/'/><span> :D </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiClq2mZyskj7Yk7p1EukHXBAMC2D4j6YF0z8yk7Z0UjHXPf4tfbiaq9xMgZDoX-ZRCpot5JcY6psvvVz3mR_2Iwx0G9S-jpFhvZIBbZlhYe2d8sqPjr8aTTnPLxvuZwieUBsQzH7WZBsk/'/><span> :( </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYmMUGcmOn3aNDu6bueSywfdCgcCkbZZY-PavxBxXuwK8-KhzCct5VcClJoSzi0lmOfpz99H1ngrIBeEDceXwotKjfoEUUhvciBuovZvcA-72_XJKWaWBFLrJ3SO7JApewj-bXctb0NNU/'/><span> =)) </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOCqsL9jjUTvSJgF1ErmY5HdPUgEParZRffI5EuHJECNhzzrbbIRfZLxYrP8_Kc8Oz3ZsrbGQ7cXXZJRVrjt_gUGdnZtewtsctQaQL4qnjOkSFojY88GgEr4r6g2eKGEu0qSL1hF2Cm-c/'/><span> b-( </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPrN2ZeiOkWhN6bxHYCrXS8mmww5x8EsNlLfcxUn_W6BYyj6GxlQc_Yvui6A8B6bMdr5GPUg9DlTRxvY5yOWX70sJc4mm5SfL2o0D3t8a55QkHKykFOyvuwVgTr0msJgiK1GqVwrmksWw/'/><span> :) </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh-6d1SP60WJcbUNZj_Qy6xjf4KFOAID28LnMXlKSdHcNd2TP3JhdGiIbkTa1M0Xqol3S6-KiMK5agJycU7Y2nhliKvZ-kC19JdHgatoJWCpjOxhTcwTHci54KDx5k5F079SNbwtrnULo/'/><span> :P </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT8ntJ1mC_J70j-OUyNOqqY4KN85pqQ-d9_uu9Y4I-FMFtF8lAQybq5GnEtBT08ui8UthaLDuwd1CowciAls3wCs91pX21yBaTsRjyTmoVBJ3Wj2L5NsX-RijY8aQLJ40FcqBmVY3jSFU/'/><span> :-o </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhCjNtAg_cx9Eud238wIAHgCWYSOVkRPpQPVe8oPVwcKXwmAwoRrD0TE8oStGUGjXLJ6A31M-6AIOkN4Ygb8IGgrl7_5ZK8nBuM_sMiwDbDqxPdpo9x6XvZvHySPtl83B_jICgU8YaZUE/'/><span> :* </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiCO1Rd0fY4MjMMA4LtDuf8wmSjyTxnSi0NpWvmtIBJXTb7f-IR8_hSW0gAV_ZoXvkJ61NUHDGnxM8_tv8wBLp1LLM6JIyi1t_70vsPYrenooxc35EqO9nyf0dgKu1N853XeecQ7DqRZ8/'/><span> :-s </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMnGInhPwyz1ZJhdlSd8Ek6ORvQJyOfvvZ0X3MYiI2BjOcoTfjeocU3dx7Evc3YMUGn2IshbhI_GHNOlAtzpH0gqfAXnNAD3eMdMxOtyyX0GcB12ELIw5DgCABPdxxGY5adCmNuwsODEI/'/><span> [-( </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8o8nOdOYgnZhrelpQt33Ujr823tjoNzMI4sMj3izYY1xvEKBFt08Pngj9QtPysyT6mOLuYK9DZ5j25FNR4Xi0KKkAAQ3eaLUnt2PPOBSpm8EYtdBAtxuJsKZZjbWegdQX2agXcibK18w/'/><span> @-) </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrw1no5mqZXWweUrtL5bnTOX7mE4B6XWjqLBhgmDbQtFYUTLjv58rteRbFZFLvIKYuiBK6fMGpil7Q0THlAXPV-b_TqaxggmNibvNc1uW0rXXrCE-goqds11Wh5TUhM0mz3Ek5k2yNHH0/'/><span> =d> </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtokg0Jm2H1zUzG0sOAUXK2kyVhgS5bhd8sZAmz9Uo7eFhdpDzTDs2yciXqCqlHFFlauqrA-vxmjY4CPJNgdAP5fD7waH-NJz9xDfTfEhp7zBSPJ3N6_C96N8gqcGK-gVcncm4IJshZck/'/><span> b-) </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNagg-qK14MZfwodTRkhrs9OU2RYEKocM5yzhxop_8DjZz3SWPGgHetdiMIEtFo7w2p8gHcjsLjAe1ubt0a_lZUHOt0Z9OTo4rTkqvcK5yoZpfA0DEZE2YeaA1WwTPiEXkR2eLRwzUwuI/'/><span> :-? </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUG-geOqCqtLkm56Hnvlg34bEXcM2e9gIF5qiiBWrIoIzrCjN4M9RNo8gKKeWIoyd0zth3tCVNRm0mK9DrNeQnz2iGT45uxf72p_XCvOW6IDZ8WJpdSrNxT1IXhy3VWPoT-99Pvib5Xpc/'/><span> :-> </span></div> <div class='item'><img class='comment_emo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8nClW42wI_9NXWAXZVgiCJuD0aRsg4cXYvoM9WchgAZedGcAt1Or7xnMFFLdy8K0QzeWZLyr_n_PBaCuOzqr6sJztn79qrumG-FNaLJWW1sm2M8x5u1aLJXsr_HpACgga49GRBr9her4/'/><span> X-( </span></div> </div> </h5>
7.2- Thêm hiệu ứng toooltips để hover các mặt cười khi di chuột và chữ Chèn Emoticons bằng cách. Chèn đoạn code bên dưới trước thẻ ]]></b:skin>
.the-tooltip {position: relative}
.the-tooltip :focus + :last-child, .the-tooltip:focus > :last-child, .the-tooltip:hover > :last-child {opacity: 1;-webkit-transition: 0.4s 0s;-moz-transition: 0.4s 0s;-ms-transition: 0.4s 0s;-o-transition: 0.4s 0s;transition: 0.4s 0s;visibility: visible}
.the-tooltip > :last-child {border: solid 1px;border-radius: 5px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;font-size: 17px;line-height: 1.5;opacity: 0;padding: 10px 20px;position: absolute;-webkit-transition: 0.2s 0s;-moz-transition: 0.2s 0s;-ms-transition: 0.2s 0s;-o-transition: 0.2s 0s;transition: 0.2s 0s;visibility: hidden;width: 250px;z-index: 999}
.the-tooltip.emo > :last-child{font-family: sans-serif;width:100%;margin-bottom:2px !important;padding:10px;background-color:#fff;border-color:#e3e3e3;color:#161d00;text-shadow:none}
.the-tooltip.emo > :last-child:after{border-color:#fff}
.the-tooltip.emo > :last-child:before{border-color:#d3d3d3}
.the-tooltip > :last-child * {max-width: 100%}
.the-tooltip > :last-child:after, .the-tooltip > :last-child:before {border: solid 11px;content: "";display: block;margin: 0 20px 0 20px;position: absolute}
.the-tooltip.left > :last-child{left:0}
.the-tooltip.left > :last-child:after,.the-tooltip.left > :last-child:before {left:10px}
.the-tooltip.right > :last-child {right:0}
.the-tooltip.right > :last-child:after, .the-tooltip.right > :last-child:before {right:0}
.the-tooltip.center > :last-child {left: -125px;margin-left: 50%;}
.the-tooltip.center > :last-child:after, .the-tooltip.center > :last-child:before {left: 50%;margin-left: -10px}
.the-tooltip.top > :last-child{bottom:100%;margin-bottom:15px}
.the-tooltip.top > :last-child:after {margin-top: -1px}
.the-tooltip.top > :last-child:after, .the-tooltip.top > :last-child:before {border-bottom-color: transparent !important;border-left-color: transparent !important;border-right-color: transparent !important;top: 100%}
.the-tooltip.top > :last-child:before {margin-top: 0px}
.the-tooltip.bottom > :last-child {margin-top: 15px;top: 100%;}
.the-tooltip.bottom > :last-child:after {margin-bottom: -1px;}
.the-tooltip.bottom > :last-child:after, .the-tooltip.bottom > :last-child:before {border-left-color: transparent !important;border-right-color: transparent !important;border-top-color: transparent !important;bottom: 100%;}
.the-tooltip.bottom > :last-child:before {margin-bottom: 0px;}
.the-tooltip.auto-width > :last-child {white-space: nowrap;width: auto}
.the-tooltip.full-width > :last-child {left: 0;margin-left: 0;width: 100%}
.comment_emo {max-width: 40px;max-height: 40px;vertical-align: middle}
.comment_emo_list .item{float:left;padding:0 10px 10px;text-align:center}
.comment_emo_list span{display:block;font-weight:bold;font-size:13px;letter-spacing:1px}
8- Lưu lại và xem kết quả nha:» Mở rộng:
Các bước trên là chèn 18 emoticons với ký tự tắt theo phong cách Yahoo. Bạn hoàn toàn có thể thêm emoticons mới nữa và tự đặt ký tự tắt theo ý mình bằng cách chỉnh sửa code javascript ở bước 1 và bước 7.1.
Ký tự tắt nằm giữa 2 ký tự /
Với ký tự đặc biệt như [ ] { } \ / ( ) . ? + * ^ $ thì phải thêm \ trước nó.
Với ký tự < phải đổi thành <
Với ký tự > phải đổi thành >
Với ký tự & phải đổi thành &
Hình ảnh emoticons nằm trong thẻ img, thay đường dẫn đến ảnh tương ứng với ký tự tắt mà bạn đặt.
» Trích dẫn:
Lưu ý là với những ký tự tắt bao gồm của nhau như :)) và :) thì bạn phải đặt :)) lên trước :) nếu không chỉ ký tự ít hơn được hiện lên.
Nếu không muốn hiển thị những Nhận xét dung tục ta khai báo những ký tự đó và thay tương ứng không phải là thẻ img nữa mà là ký tự *** chẳng hạn.
Sau khi đã thành công với việc chèn emoticons vào khung Nhận xét bạn hoàn toàn có thể chèn emoticons vào khung Bài đăng hay khung Nhận xét mới bằng cách tạo một ID mới bao quanh khung Bài đăng hay khung Nhận xét mới và khai báo ID này trong javascript màu xanh ởbước 1 tương tự như khai báo ID emocomments (tên ID phải khác nhau).
Vì không thể chèn emoticons theo kiểu click do đó chúng ta chỉ nên sử dụng những ký tự tắt thông dụng để không gây khó khăn cho người đọc.
Cũng đừng nên tham lam chèn nhiều emoticons dẫn đến trình duyệt phải xử lý nhiều thông tin khiến blog tải chậm hơn.
Giờ thì khách thăm blog của bạn thoải mái Nhận xét với những emoticon ngộ nghĩnh cho dù họ có đang dùng trình duyệt bị giới web development ghét nhất mang tên IE 6.
Với threadc omment của blogger thì khung này chỉ hiển thị khi bài viết có ít nhất 1 comment nha.
» Dưới đây là một số hình bạn có thể xem và chọn nếu thích:
Nhận xét
http://demo-namkna-blog.blogspot.com/2013/03/demo-add-emoticons-tooltips-for.html
Trả lờiXóaVạy làm sao để "khunig này" hiển thị khi có nhiều hơn 1 coment vậy c?. T làm mãi mà k đưuọc chứ
Trả lờiXóaThủ thuật này có tác dụng khi ta dê chuột vào chữ Emoticon. Còn nếu bạn muốn nó hiển thị bạn có thể xem Tại đây hoặc đây
XóaBác nam ơi mình đã làm ok nhưng có một vấn đề là :
Trả lờiXóaVD như bài viết chưa có comment thì sẽ hiện cái Chèn Emoticons
http://gamekhung.blogspot.com/2013/04/android-dodo-fly-full-apk.html
Nhưng khi đã có commnent thì lại không xuất hiện cái chữ đó nữa như bài này
http://gamekhung.blogspot.com/2013/02/real-football-2013-hd-offline-v103-ong.html
Vậy xin bác chỉ cách khắc phục ạ
Có 4 đoạn <data:blogTeamBlogMessage/> và bạn đã chèn code 7.1 nhầm vị trí nha,
Xóamình ko hiện ra cái Hover đó, chỉ hiện ra emo thôi là sao nhỉ? ở code 7.1, mình tìm ra 2 chỗ, thử chèn cả 2 chỗ đều ko hiện ra :(
Trả lờiXóaBạn phải chèn cả code 7.2 nha (đây là đoạn mã định hình hover cho emoticons). Còn code7.1 hãy chèn thử ở từng vị trí 1 không cần thiết phải chèn ở cả 2 vị trí đâu.
XóaMột blog có rất nhiều đoạn sau: <data:blogTeamBlogMessage/> Em phải chèn đúng doạn cần thiết nó mới hiển thị nha,
Trả lờiXóaKhông có gì đâu em :)
Trả lờiXóachèn cáy này vào có ảnh hưởng gì đến trang web k nhỉ
Trả lờiXóahttp://bestweightlossprogrami.blogspot.com/
Không ảnh hưởng nhiều đâu bạn ak. Nó chỉ làm cho bloog của bạn thêm sinh động hơn thôi,
XóaBác Namkna cho e hỏi :3
Trả lờiXóaChỗ Chèn Emoticons nó hiện hết icon mặt cười ra lun :|
Cái http://3.bp.blogspot.com/-SctFYftWmUQ/UkpR7o0xuXI/AAAAAAAAFTY/UaYBtoaXazk/s1600/Capture.PNG
Như vậy là bước 7.2 bạn thực hiện sai hướng dẫn của mình rồi
Xóa:3 Đúng rồi mà :3 Chèn cái bước 7.2 vào skin :3
Trả lờiXóaĐại ca cho e xun lun cái hướng dẫn làm hiệu ứng đổi màu khi rê chuột vào ảnh với :D Tks.
Bạn muốn thay đổi màu cảu hình ảnh trong blog hay trong bài viết hay là trong thủ thuật này thế,
XóaGiờ thì được rồi :D
Trả lờiXóaNhưng mà nó ra như vậy đây :(
Ad xem giúp e :)
[IMG]http://4.bp.blogspot.com/-iHv-l6y4AxQ/UkrD1fdY4jI/AAAAAAAAFU0/ALuG1TOu_yY/s1600/Capture.PNG[/IMG]
Bạn Tìm đoạn code sau:
Xóadocument.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);
Giúp e lun 2 cái này với :D
Trả lờiXóahttp://3.bp.blogspot.com/-8ln2vcfR6l0/Ukt0YV7JFJI/AAAAAAAAFZc/lLilNGLKf0E/s1600/Capture.PNG
Tks a :D
Anh vào thấy nó vẫn hiển thị bình thường mà em,
XóaGiờ thì lỗi này :3 A koi giúp nhé :3
Xóahttp://1.bp.blogspot.com/-eq6tZpoWc8o/Uk1eIguQ_6I/AAAAAAAAFdA/cHBHWImeUWo/s1600/l%E1%BB%97i.png
Bạn có thể tìm hiểu cách khắc phục ở đây nha: Di chuyển ghi chú nhận xét của thread comment theo khung nhận xét khi reply trong blogspot
Xóakhông được, chả biết lỗi gì, anh vào giúp em với, cảh biết nó xung đợ hay soa nữa
Trả lờiXóahttp://thietkeweblog.blogspot.com/
Anh namkna ơi! em chèn rồi mà phần khung comment ko hiện chữ "Chèn Emoticon" :( !
Trả lờiXóaAnh xem giúp
Bổ xong: Em chỉnh lại mà nó đi đâu không như ý muôn! :(
XóaE lưu ý là bài viết phải có một comment rồi thì nó mới hiển thị nha em .
XóaHiện tại a vào trang của em thấy nó hiển thị rồi đó em ak.
Dạ ý em là em không biết tại sao nó bay lên trên cái quảng cáo của info link ạ! Mà nó không nằm trong khung comment ! :( Anh giúp với ! à em có áp dụng thủ thuật của
XóaBài này
Em không biết có xung đột gì không nữa ! Mong anh giúp ạ !
Em có thể di chuyển nó theo nhận xét như bài này nha em:
XóaDi chuyển ghi chú nhận xét của thread comment theo khung nhận xét khi reply trong blogspot