Cara Membuat Recent Comment dengan Notifikasi Pemberitahuan

Cara Membuat Recent Comment dengan Notifikasi Pemberitahuan-setelah kemaren saya membuat recent comment di blog , kali ini saya akan share kepada sahabat blogger  cara membuat recent comment dengan notifikasi pemberitahuan , apa sih maksudnya ..? maksudnya ialah apabila ada komentar baru di blog kita , maka secara otomatis kita akan mendapatkan pesan pemberitahuan , hampir mirip seperti alarm tapi gak ada nadanya hanya pemberitahuan tex saja . selain itu recent comment ini juga di lengkapi dengan title , jadi akan berdampak baik untuk seo.

Cara Membuat Recent Comment dengan Notifikasi Peberitahuan

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>


#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&hellip;</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 .
Share This Article Facebook +Google Twitter Digg Technorati Reddit

Blog ini berisi informasi mengenai dunia blogging dan internet dari berbagai sumber, jika anda menyukai dan mau dapatkan Update berita terbaru, harap ikuti blog ini dengan memasukan Email anda atau mengikuti Twitter/Facebook, dengan begitu anda secara otomatis akan mendapatkan Update Berita terbaru disini.


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.


Thanks For Your Comment Here