 |
| Cara Memasang Notifikasi Komentar |
- Masuk ke template lalu pilih Edit HTML kemudian cari kode ]]></b:skin>
- Copy dan pastekan kode berikut ini di atas kode ]]></b:skin>
/* CSS Comment Notification */
#show-total {position: absolute;top: 4px;right: 305px;z-index: 9999;cursor: pointer;float: right;}
.total-show {background-color:#D40B0B;color:#fff;padding:2px 6px;font-size:11px;
border-radius:2px;font-weight:normal;}
#notif {cursor:pointer;}
#notif:before {content: url('http://icons.iconarchive.com/icons/custom-icon-design/pretty-office-12/24/laptop-wifi-icon.png');display:block;
position:absolute;top:5px;right:310px;opacity:0.6;z-index:9997;transition:all 0.3s ease-in-out;padding: 4px 4px 0px;
background: #fff;
border-radius: 3px;}
#notif:hover:before {opacity:1;}
#notif2 {cursor:pointer;display:none}
#notif2:before {
content: url('http://3.bp.blogspot.com/-XTG95ALcO4Y/U6wQKfUKdJI/AAAAAAAAEBo/I1ae0Yf1PvU/s1600/notif.png');
display: block;
position: fixed;
top: 14px;
right: 351px;
opacity: 1;
z-index: 9999;
transition: all 0.3s ease-in-out 0s;
}
#notif2:hover:before {opacity:1;}
#cm-wrapper {width:310px;position:fixed;top:0px;right:-381px;z-index:9998;
background-color:#fff;padding:15px 13px 25px 15px;color:#46515e;font-family:'Roboto',Sans-serif;border-left:8px solid #119CFF;transition:all 0.3s ease-in-out;}
#cm-wrapper:before {
content: "";
width: 0px;
height: 0px;
position: absolute;
top: 6px;
left: -43px;
right: 303px;
border: 20px solid #119CFF;
border-bottom-left-radius: 10px;
border-top-left-radius: 10px;
}
#cm-scroll {width:100%;height:600px;overflow:auto;position:relative;}
#comments-container {color:#46515e;font-family:'Open Sans',Sans-serif;opacity:1;}
#comments-container.cm-active {position:fixed;left:0;top:61px;}
.scrollgeneric {line-height:1px;font-size:1px;position:absolute;top:0;left:0;}
.vscrollerbase {width:5px;background-color:#fafafa;}
.vscrollerbar {width:5px;background-color:#e1e2e4;}
.vscrollerbar:hover {width:5px;background-color:#bdbec1;}
.vscrollerbar:focus {width:5px;background-color:#b7c866;}
.hscrollerbase {height:10px;background-color:#fafafa;}
.hscrollerbar {height:10px;background-color:#fafafa;border-radius:2px;}
.scrollerjogbox {width:10px;height:10px;top:auto;left:auto;bottom:0px;right:0px;
background-color:transparent;transition:0.3s ease-in-out;}
.cm-outer {margin:0 auto;padding:0;font-size:11px;text-align:left;}
.cm-outer pre {background-color:#fff;color:#46515e;border:1px solid #e1e2e4;border-left:3px solid #b7c866;font-size:11px;}
.vscrollerbar .cm-outer pre {width:5px;background-color:#e1e2e4;}
.cm-outer li {padding:7px 10px 12px;list-style:none;clear:both;position:relative;
border-bottom:3px solid #e1e2e4;border-radius:5px;margin-right:10px;}
.cm-outer code {color:#119CFF;font-size:11px;}
.cm-outer li.selected {border-left:4px solid #119CFF;}
.cm-outer li:first-child {border-top:none;}
.cm-outer li:last-child {border-bottom:none;}
.cm-text {color:#6c7075;}
.cm-outer {margin:0 0 5px}
.cm-header {margin: 4px 0 8px 60px;font-size:13px;font-weight:normal!important;}
.cm-header a {color:#5d6b6b;font-family:'Roboto';text-decoration:none;font-size:13px;font-weight:300;}
.cm-header a:hover {color:#119CFF;text-decoration:none;}
.cm-outer .cm-content {overflow:hidden}
.cm-content {margin-left:60px}
.cm-outer img {display:block;float:left;background:#fff url('http://1.bp.blogspot.com/-21HK5HI5YEM/U6wYCTGPkKI/AAAAAAAAECQ/_R2ECAxKrug/s1600/anonim.png') no-repeat 50% 50%;
overflow:hidden;border-radius:100px;position:absolute;top:10px;left:0;
border:2px solid #e1e2e4;transition:all 0.3s ease-in-out;}
.cm-outer img:hover {border:2px solid #119CFF;}
.cm-footer {margin-top:7px;}
.cm-footer a {color:#a5aab1;text-decoration:none;}
.cm-footer a:hover {color:#119CFF;text-decoration:none;}
div.cm-header img[src='http://img1.blogblog.com/img/openid16-rounded.gif'] {
content: url(http://1.bp.blogspot.com/-21HK5HI5YEM/U6wYCTGPkKI/AAAAAAAAECQ/_R2ECAxKrug/s1600/anonim.png);}
.bg_hitam{display:none;position:absolute;position:fixed;top:0%;right:0%;width:100%;
height:100%;background-color:#182025;z-index:99;opacity:0.3;transition:all 0.3s ease-in-out;}
.emoWrap{margin:0 auto;text-align:center}
.emo,.emoKey{display:inline-block;*display:inline;vertical-align:middle}
.emoKey{width:auto;border:1px solid #ccc;background-color:white;font:normal bold 11px/normal Arial,Sans-Serif;padding:2px;margin:0 0 0 2px;color:black}
- Cari kode </body> dan pastekan script berikut ini di atas kode </body>
<div id='notif' title='Notifikasi'/>
<div id='notif2' title='Notifikasi'/>
<div class='bg_hitam' id='bg'/>
<div id='cm-wrapper'>
<div class='flexcroll' id='cm-scroll'>
<div id='comments-container'/>
</div>
</div>
<div id='show-total'/>
<script type='text/javascript'>
//<![CDATA[
var originalTitle = document.title;
var cm_config = {
home_page: "https://infonessia.blogspot.co.id",
max_result: 26,
t_w: 50,
t_h: 50,
summary: 9999,
new_tab_link: false,
ct_id: "comments-container",
new_cm: " New Comments!",
interval: 30000,
alert: true,
alert: function(total) {
document.getElementById("show-total").innerHTML = '<strong class=\'total-show\'>'+total+'</strong>';
document.title = '(' + total + ') ' + originalTitle;
}
};
$('#notif').click(function(){$("#cm-wrapper").css({right: "0px"});$("#bg, #notif2").show();$("#notif").hide();});$('#notif2').click(function(){$("#cm-wrapper").css({right: "-381px"});$("#bg, #notif2").hide();$("#notif").show();});$('#bg').click(function(){$("#cm-wrapper").css({right: "-381px"});$("#bg, #notif2").hide();$("#notif").show();});document.getElementById('notif').onclick = function() {document.title = originalTitle;$('#show-total').hide();};document.getElementById('show-total').onclick = function() {document.title = originalTitle;$('#show-total').hide();$("#cm-wrapper").css({right: "0px"});$("#bg").show();};setTimeout(function() {$('.myframe').each(function() {$(this).replaceWith('<iframe class="myframe" src="' + $(this).data('src') + '" allowfullscreen="allowfullscreen"></iframe>');});}, 5000);$(document).ready(function() {
var stickyNavTop = $('#HTML001').offset().top; var stickyNav = function(){var scrollTop = $(window).scrollTop(); if (scrollTop > stickyNavTop) { $('#HTML001').addClass('sticky');} else {$('#HTML001').removeClass('sticky'); }};stickyNav();$(window).scroll(function() {stickyNav();});});
setTimeout(function() {
$('.jsfiddle-demo').each(function() {
$(this).replaceWith('<iframe class="jsfiddle-demo loader" src="' + $(this).data('src') + '" allowfullscreen="allowfullscreen"></iframe>');
});
}, 5000);var cm_config_defaults={home_page:"https://minima9.blogspot.com",max_result:15,t_w:50,t_h:50,summary:9999,new_tab_link:false,ct_id:"comments-container",new_cm:" New Comments!",interval:30000,alert:true,},_cookie={set:function(g,f,j){var i,h;if(j){i=new Date();i.setTime(i.getTime()+(j*24*60*60*1000));h="; expires="+i.toGMTString()}else{h=""}document.cookie=g+"="+f+h+"; path=/"},get:function(f){var e=f+"=",h=document.cookie.split(";"),j;for(var g=0;g<h.length;g++){j=h[g];while(j.charAt(0)==" "){j=j.substring(1,j.length)}if(j.indexOf(e)==0){return j.substring(e.length,j.length)}}return null},del:function(b){this.set(b,"",-1)}},tt_cm=(_cookie.get("tt_cm"))?_cookie.get("tt_cm"):0,doc_title=document.title;for(var i in cm_config_defaults){cm_config_defaults[i]=(typeof(cm_config[i])=="undefined")?cm_config_defaults[i]:cm_config[i]}function showRecentComments(json){var entry=json.feed.entry,total=parseInt(json.feed.openSearch$totalResults.$t,10),skeleton="",oldCount=tt_cm,co=cm_config_defaults;var totalComments=total-oldCount>50?'50+':total-oldCount;if(oldCount<total){if(cm_config.alert===true){alert((total-oldCount)+cm_config.new_cm)}else{if(cm_config.alert===false){document.title="("+(total-oldCount)+cm_config.new_cm+") "+document.title}else{cm_config.alert((total-oldCount),cm_config.new_cm)}}}skeleton='<ul class="cm-outer">';for(var i=0;i<entry.length;i++){for(var j=0;j<entry[i].link.length;j++){if(entry[i].link[j].rel=="alternate"){link=entry[i].link[j].href;break}}var dash=link.lastIndexOf("/")+1,dot=link.lastIndexOf("."),title=link.split("-").join(" ").substring(dash,dot)+"…";author=entry[i].author[0],name=author.name.$t,avatar=author.gd$image.src.replace(/\/s[0-9]+(\-c|\/)/,"/s"+co.t_w+"$1").replace(/http\:\/\/www.google.com\/url\?source\=imglanding(.*?)q\=/i,"").replace(/\.(jpg|jpeg|png|bmp|gif)(.*?)$/i,".$1"),profile=(author.uri)?author.uri.$t:"#nope",u=entry[i].id.$t.replace(/^.*?blog\-([0-9]+).*?post\-([0-9]+)/,"https://www.blogger.com/delete-comment.g?blogID=$1&postID=$2"),r=entry[i]["thr$in-reply-to"].source.split("default/")[1],d=entry[i].id.$t.replace(/^.*?blog\-([0-9]+).*?post\-([0-9]+)/,"https://www.blogger.com/comment-iframe.g?blogID=$1&postID="+r+"&parentID=$2"),date=entry[i].gd$extendedProperty[1].value,content=("content"in entry[i])?entry[i].content.$t.replace(/<i rel="pre">(.*?)<\/i>/ig,"<pre>$1</pre>").replace(/<i rel="code">(.*?)<\/i>/ig,"<code>$1</code>").replace(/<i rel="linku">(.*?)<\/i>/ig,"<a class='allow' href='$1'>\{link\}</a>").replace(/:D/ig,"<img src='https://4.bp.blogspot.com/-J7s7flyAolE/U6tMYuCWJjI/AAAAAAAAD-g/ktLPs0sF0zM/s1600/smile.png' alt='' class='cm-smiley'/>").replace(/:\)/ig,"<img src='https://4.bp.blogspot.com/-J7s7flyAolE/U6tMYuCWJjI/AAAAAAAAD-g/ktLPs0sF0zM/s1600/smile.png' alt='smile' class='cm-smiley'/>"):"",nt=(co.new_tab_link)?' target="_blank"':"";content=(content.length>co.summary)?content.substring(0,co.summary)+"…":content;skeleton+="<li>";skeleton+='<div class="cm-header"><a href="'+profile+'" title="'+name+'"'+nt+'><img alt="Loading..." style="width:'+co.t_w+"px;height:"+co.t_h+'px;" src="'+avatar+'"></a><span class="author"><a href="'+profile+'" rel="nofollow">'+name+'</a> on <a href="'+link+'" title="'+title+'"'+nt+" rel=>"+title+"</a></div></span>";skeleton+='<div class="cm-content">';skeleton+='<span class="cm-text">'+content+"</span>";skeleton+='<div class="cm-footer">'+date+' <a href="'+d+'" onclick="window.open(this.href,'_cf','scrollbars=1,width=470,height=250,left=355,top=135');return false;" title="Reply Comment">Reply</a> <a href="'+u+'" title="Delete Comment" target="_blank">Delete</a></span> </span>';skeleton+="</div></li>"}skeleton+="</ul>";document.getElementById(co.ct_id).innerHTML=skeleton;_cookie.set("tt_cm",total,7000);tt_cm=total}(function(){var head=document.getElementsByTagName("head")[0],script=document.createElement("script"),co=cm_config_defaults;script.type="text/javascript";script.id="cm-feed-script";script.src=co.home_page+"/feeds/comments/default?alt=json-in-script&redirect=false&max-results="+co.max_result+"&callback=showRecentComments";head.appendChild(script);setInterval(function(){var newScript=document.createElement("script");newScript.type="text/javascript";newScript.id="cm-feed-script";newScript.src=co.home_page+"/feeds/comments/default?alt=json-in-script&redirect=false&max-results="+co.max_result+"&callback=showRecentComments";var oldScript=document.getElementById("cm-feed-script");oldScript.parentNode.removeChild(oldScript);head.appendChild(newScript)},co.interval)})();
//]]>
</script>
- Simpan Template
Keterangan:
- Warna biru untuk mengatur posisi tombol pemberitahuan
- Warna hijau bisa diganti dengan url icon lain
- Warna merah ganti dengan alamat blog Anda
- Contoh bisa dilihat di blog ini dengan klik tombol notifikasi di bagian atas blog ini
How to Find a Good Casino Online for Free in India
ReplyDeleteIn the article, we will 서산 출장샵 cover what you need to 안동 출장안마 know about the 서산 출장샵 gambling 동해 출장샵 operator's online gambling software 군포 출장안마 and where it will operate.