Cara Mudah Membuat Notifikasi Komentar Ala Google Plus - Hallo sahabat Cheater251 | Free Download Cheat LostSaga, PointBlank, First Blood 2017, Pada Artikel yang anda baca kali ini dengan judul Cara Mudah Membuat Notifikasi Komentar Ala Google Plus , kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blogger, Artikel Code HTML, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Cara Mudah Membuat Notifikasi Komentar Ala Google Plus
link : Cara Mudah Membuat Notifikasi Komentar Ala Google Plus

Cara Mudah Membuat Notifikasi Komentar Ala Google Plus

Cara Mudah Membuat Notifikasi Komentar Ala Google Plus - Di pojok kanan atas dasbhor blogger anda , jika anda perhatikan dengan baik , ada sebuah notifikasi komentar google plus yang berbentuk lonceng , sebetulnya tidak hanya pemberitahuan komentar deh , melainkan ada juga pemberitahuan tentang kabar terbaru dari teman atau follower google plus anda yang membagikan sesuatu kepada public.

Baca Juga : Membuat File Master APK dari Ponsel Android

WWW.RHM-FILES.TK

Tutorial Membuat Notifikasi Komentar Mirip Google Plus

1. Seperti biasanya , silahkan sobat masuk ke dasbhor akun blogger , pilih menu template yang berada di tab kiri => Edit html
2. Simpan jQuery dibawah ini di atas </head> , karena widget ini tidak bisa tanpa jqery

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>

3. Simpan CSS ini di atas ]]></b:skin> atau </style>

 /* Notifikasi Komentar ----------------------------------------------- */

#cm-total { position:fixed; top:14px; right:0; width:188px; text-align:left; z-index:9999; cursor:pointer; } .total-counter { background-color:#d11919; color:white; padding:1px 4px; font-family:Arial,Sans-serif; font-size:11px; border-radius:5px; font-weight:bold; } #notif { position:fixed; top:20px; right:180px; z-index:9999; height:22px; width:19px; opacity:.4; cursor:pointer; } #notif:hover { opacity:1; } .close-notif { position:fixed; top:92px; right:20px; z-index:9999; cursor:pointer; display:none; } #cm-container { width:355px; position:fixed; top:67px; right:0; z-index:9999; background-color:#e5e5e5; padding:60px 20px 10px 20px; color:#666; box-shadow:0 4px 15px -4px rgba(0,0,0,.4) !important; text-align:left; border:1px solid rgba(0,0,0,.2); background-clip:padding-box; display:none; } #cm-container:before { content:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5sLoy-VU2EBe93nEuY7hTvlp39XYdeWNz89qdU4TclTCd_EOQG21hDAAOezj6yRjK6bZFksGBIslZU6x2KMWvObCq5KPUNbtyrSRR-2mKhnqFq-eqTs_v-aEuMRWvD4V17145H6ubQqM/s1600/arrow-notif.png'); position:absolute; top:-14px; left:196px; } #cm-container:after { content:"Komentar Terbaru"; position:absolute; top:22px; left:150px; text-align:center; font:normal 14px Arial; color:#333; } .cm-outer { margin:0 auto; padding:0; font-size:11px; text-align:left; font:normal 12px Arial; } .cm-outer ul{ margin-bottom:5px; } .cm-outer li { padding:9px 10px 14px; list-style:none; clear:both; position:relative; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,.2); background-color: white; margin-bottom:10px; } .cm-text {color:#797979;} .cm-outer {margin:0 0 5px} .cm-header {margin: 4px 0 8px 90px;font-size:11px;font-weight:normal !important;} .cm-header a {color:#262626;text-decoration:none;font-size:14px;font-weight:bold} .cm-header a:hover {color:#74a2c3;text-decoration:none;} .cm-outer .cm-content {overflow:hidden} .cm-content {margin-left:90px} .cm-outer img { display:block; float:left; background:#ececec url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwV-srcb4W1U5t-7D2GUSi7fu39jZZUR2Pda_12xs3PYaLXfQK86w6Uv8VAm4gOWsc2oke2wX0NXn-s0HTQEhy8OX9IKBL4Ca1jtx3tT17WPLJyjIaNXhY04ldAY9lBuFrFaQkHjxtOxw/s1600/anon80.png') no-repeat 50% 50%; overflow:hidden; border-radius:3px 0 0 3px; position:absolute; top:0; left:0; } .cm-footer {margin-top:7px;} .cm-footer a {color:#5886a7;text-decoration:none;} .cm-footer a:hover {color:#74a2c3;text-decoration:none;} div.cm-header img[src=&#39;http://img1.blogblog.com/img/openid16-rounded.gif&#39;] { content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisbT6BktYUn9a78JVAv7mwaKCYIMzofVO5Sq8P73d6Ul5gn3B4eAmsq1xaiDhss1lqUtpOxcksEknU0mNOLKTsOF1hedMsMYw5FSrhjCDs-ttV2i6HEoH4sKrZ9_Cr2d8ja1CHBbWBshY/s80-c/gravatar.png); }

4. Supaya CSS diatas work , silahkan simpan kode ini di atas </body>

<div id='cm-container'/> <div id='notif' title='Notifikasi'><img alt='notifikasi' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR3QLb7FERAmddviqMXVcs76uDE3lIo8TqFZKXDbtG1ABMjKfxUOhX2VuNFqtH4I1o8YBB6BF63nqPEYlWVt8il9F1I_CugUvX33cOpR0tM6y12gWKTTPDS5k_kbAOCKyiuwpIeqOy9NU/s1600/lonceng.png'/></div> <div id='cm-total'/> <div class='close-notif'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAyOoWtjhtVZIZRvvUNkqfgaSbDCgbQUIaWJLvQyiBzpua3VV8XyZtkfx8YNpWUUln6ycVOSyubyC56N7CNZ2brHoXTZrbfAuC3l55Vg9UfIfO7IoyyfoWhcpnF9ekPstldx0U4EIIAVU/s1600/delete4.png' title='close'/></div> <script> //<![CDATA[ var originalTitle = document.title; var cm_config = { home_page: "http://www.rhm-files.tk", max_result: 6, t_w: 80, t_h: 80, summary: 40, new_tab_link: true, ct_id: "cm-container", new_cm: " Komentar Baru!", interval: 30000, alert: true, alert: function(total) { document.getElementById("cm-total").innerHTML = '<strong class=\'total-counter\'>'+total+'</strong>'; document.title = '(' + total + ') ' + originalTitle; } }; $('#notif').click(function(){$('#cm-container, .close-notif').toggle();});$('.close-notif').click(function(){$('#cm-container, .close-notif').hide();});document.getElementById('notif').onclick = function(){document.title = originalTitle;$('#cm-total').hide();};document.getElementById('show-total').onclick = function(){document.title = originalTitle;$('#cm-total').hide();$('#cm-container').show();}; //]]> </script> <script src='https://googledrive.com/host/0B3pi8P5BWqm1OHB4Zks1aWR0Nnc/notif-komen.js' type='text/javascript'/>

5. Terkahir silahkan simpan template dan lihat hasilnya
Done .....

Gimana bro Langkah -langkah Membuat Notifikasi Komentar Layaknya  Google Plus diatas ? sangatlah mudah bukan ? jika sobat tertarik dengan widget tersebut dan ingin memasangnya di blog sobat agar terlihat lebih cantik dan profesional silahkan ikuti tutorial diatas dengan baik , Apabila ada yang ingin ditanyakan silahkan komentar dibawah , jika saya bisa menjawab akan saya jawab , jika tidak saya kasih solusinya nanti.

Demikianlah Artikel Cara Mudah Membuat Notifikasi Komentar Ala Google Plus

Sekianlah artikel Cara Mudah Membuat Notifikasi Komentar Ala Google Plus kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Cara Mudah Membuat Notifikasi Komentar Ala Google Plus dengan alamat link https://cheatterbaru2.blogspot.com/2016/07/cara-mudah-membuat-notifikasi-komentar.html

Tweet