Berikut langkah-langkah Cara Membuat Recent Comment dengan Notifikasi Pemberitahuan :
Ada 2 tahap dalam membuat recent post dengan notifikasi pemberitahuan :
A. Tahap yang pertama
1. Login atau masuk terlebih dahulu ke akun Blogger anda
2. Pilih menu " Template " => EDIT HTML
3. Cari kode ]]></b:skin> ( Gunakan CTRL+F untuk mempermudah pencarian )
4. Letakan kode di bawah ini tepat di atas kode ]]></b:skin>
2. Pilih menu " Template " => EDIT HTML
3. Cari kode ]]></b:skin> ( Gunakan CTRL+F untuk mempermudah pencarian )
4. Letakan kode di bawah ini tepat di atas kode ]]></b:skin>
#outer-comment {
Background: none;
margin: 0;
padding: 5px;
width: auto;
height: 300px;
overflow: auto;
border: 0px solid#000;
}
#boxcomment {
border: 0px solid#000;
background: #000;
text-align: left;
color: red;
padding: 5px;
margin-bottom: 5px;
height: 20px;
}
#comments-total {
color: #fff;
text-align: center;
margin-top: -20px;
}
.cm-outer {
margin: 0 auto;
padding: 0 0;
font: normal normal 11px Arial,Sans-Serif;
border: 0px solid;
border-top: none;
}
.cm-outer li {
margin: 0 0;
padding: 7px 10px 12px;
list-style: none;
clear: both;
border-top: 2px dotted;
2px;
}
.cm-outer .cm-header {
margin: 0 0 5px;
}
.cm-outer .cm-content {
overflow: hidden;
}
.cm-outer img {
display: block;
float: left;
margin: 2px 10px 2px 0;
border: 0px solid black;
background: #8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%;
overflow: hidden;
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-ms-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
}
.cm-outer img:hover {
display: block;
float: left;
margin: 2px 10px 2px 0;
border: 0px solid black;
background: #8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%;
overflow: hidden;
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
.accessible-hidden {
position: absolute;
top: -99px;
left: -99px;
width: 1px;
height: 1px;
}
#shadow-widget {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuOnGw5df7xb1Ey4R6W2gKWymrMShAinlvTw-hBCod6bXfJZe1T2c68dLIs-f6prK7TIViNaz-jp15nGpMlJ5PhPQP2v6n4RTm9vBS7774MH6JLJO-sR6syHdF1pivbc4iULNZpGPGhH4/s1600/frame_shadow2+copy.png") no-repeat scroll center center transparent;
height: 20px;
width: 300px;
}
6. Simpan Template , kemudian Log out dari EDIT TEMPLATE
B. Tahap yang kedua
1. Masuk / Login ke akun Blogger anda
2. Pilih Menu Tata Letak
3. Kemudian Tambahkan gadget => HTML/Java Sript
4. Salin dan pastekan kode di bawah ini , di dalam kolom HTML/Java Sript
<div id="outer-comment"><div id="boxcomment"><b>Total Comment:</b>
<div id="comments-total"></div></div>
<div id="comments-container">Loading…</div>
<script type="text/javascript">
var cm_config = {
home_page: "http://ahmadsuyadi.blogspot.com",
max_result: 7,
t_w: 32,
t_h: 32,
new_tab_link: true,
tt_id: "comments-total",
ct_id: "comments-container",
new_cm: " Komentar Baru!",
interval: 30000,
alert: true
};
</script>
<script type="text/javascript" src="http://karina-project.googlecode.com/files/recent-comments-script-with-notification.js"></script></div>
NOTE :
- Ganti
ahmadsuyadi.blogspot.com dengan URL BLOG ANDA
5. Saimpan Template dan Lihat Hasilnya ( demonya seperti recent comment saya )
Itulah panduan Langkah-langkah Cara Membuat Recent Comment dengan Notifikasi Pemberitahuan semoga artikel ini dapat bermanfaat bagi saya dan anda .
Baca Juga Artikel Terkait Lainnya

Silahkan bertanya sesuai dengan artikel yang telah anda baca diatas.
Link aktif otomatis terseleksi ke SPAMMER.
Alasan komentar anda tidak terjawab adalah OOT atau diluar kemampuan Admin.