Kode Script Anti Ucbrowser Untuk Blog

Kode script anti ucbrowser untuk blog
ucbrowser bisa dibilang menjadi musuh bagi para publisher dan blogger yang mendapatkan rezeki untuk menafkahi anak-istrinya dari usaha blogging dan menampilkan iklan di blog maupun websitenya, karena jika pengunjung membuka situs yang terdapat iklan google adsensenya maka tampilan iklan dari banner google adsense akan polos atau kosong tidak kelihatan, sehingga pendapatanpun tidak masuk ke saldo adsense.

bagi para pengunjung mungkin terkadang tidak memperhatikan hal tersebut namun tidak ada salahnya jika pengunjung juga mensupport untuk tidak membuka blog dari ucbrowser melainkan dari browser lain seperti google chrome, operamini maupun mozilla firefox, bisa dianggap sebagai bentuk donasi kecil tanpa harus mengirimkan donasi berupa uang dan lainnya yang dapat bermanfaat untuk kemajuan blog tersebut juga kedepannya.

oke dibawah ini adalah kode anti ucbrowser yang telah di parse, jadi sobat tinggal men-copas kode di bawah ini dan tempatkan di bawah <head atau di bawah <wrapper


copy mulai dari di bawah ini
  &lt;p id=&quot;gaboleh&quot;&gt;&lt;/p&gt;
&lt;script&gt;
var cari = navigator.userAgent;
var dapet = cari.search(&quot;UCBrowser&quot;);
if(dapet&gt;1) {

    var strs=document.URL;
    var urlnya= strs.replace(&quot;http://&quot;, &quot;&quot;);
    var strings=&#39;&lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;&lt;h3 align=&quot;center&quot;&gt; Maaf, website kami tidak dapat dibuka dengan baik jika anda menggunakan UCBrowser&lt;br/&gt;&lt;br/&gt;klik tombol pilih dibawah ini , lalu salin/copy dan buka menggunakan browser lain (seperti Chrome, Opera, dll)&lt;br/&gt;&lt;br/&gt;&lt;input type=&quot;text&quot; class=&quot;teks&quot; value=&quot;&#39;+ document.URL  +&#39;&quot; size=&quot;50&quot;&gt;&lt;br/&gt; &lt;button class=&quot;js-copy-btn&quot;&gt;Pilih&lt;/button&gt;&lt;br/&gt;&lt;/h3&gt;&#39;;


    document.getElementById(&quot;gaboleh&quot;).innerHTML = strings;
var copyTextareaBtn = document.querySelector(&#39;.js-copy-btn&#39;);

copyTextareaBtn.addEventListener(&#39;click&#39;, function(event) {
var copyTextarea = document.querySelector(&#39;.teks&#39;);
//copyTextarea.select();
copyTextarea.selectionStart=0;
copyTextarea.selectionEnd=copyTextarea.value.length;

try {
    var successful = document.execCommand(&#39;copy&#39;);
    var msg = successful ? &#39;successful&#39; : &#39;unsuccessful&#39;;
    console.log(&#39;Copying text command was &#39; + msg);
} catch (err) {
    console.log(&#39;Oops, unable to copy&#39;);
}
});

exit();
}

function exit( status ) {
    // http://kevin.vanzonneveld.net
    // +   original by: Brett Zamir (http://brettz9.blogspot.com)
    // +      input by: Paul
    // +   bugfixed by: Hyam Singer (http://www.impact-computing.com/)
    // +   improved by: Philip Peterson
    // +   bugfixed by: Brett Zamir (http://brettz9.blogspot.com)
    // %        note 1: Should be considered expirimental. Please comment on this function.
    // *     example 1: exit();
    // *     returns 1: null

    var i;

    if (typeof status === &#39;string&#39;) {
alert(status);
    }

    window.addEventListener(&#39;error&#39;, function (e) {e.preventDefault();e.stopPropagation();}, false);

     var handlers = [
&#39;cut&#39;,
&#39;beforeunload&#39;, &#39;blur&#39;, &#39;change&#39;, &#39;contextmenu&#39;, &#39;focus&#39;, &#39;keydown&#39;, &#39;keypress&#39;, &#39;keyup&#39;, &#39;mousedown&#39;, &#39;mousemove&#39;, &#39;mouseout&#39;, &#39;mouseover&#39;, &#39;mouseup&#39;, &#39;resize&#39;, &#39;scroll&#39;,
&#39;DOMNodeInserted&#39;, &#39;DOMNodeRemoved&#39;, &#39;DOMNodeRemovedFromDocument&#39;, &#39;DOMNodeInsertedIntoDocument&#39;, &#39;DOMAttrModified&#39;, &#39;DOMCharacterDataModified&#39;, &#39;DOMElementNameChanged&#39;, &#39;DOMAttributeNameChanged&#39;, &#39;DOMActivate&#39;, &#39;DOMFocusIn&#39;, &#39;DOMFocusOut&#39;, &#39;online&#39;, &#39;offline&#39;, &#39;textInput&#39;,
&#39;abort&#39;, &#39;close&#39;, &#39;dragdrop&#39;, &#39;load&#39;, &#39;paint&#39;, &#39;reset&#39;, &#39;submit&#39;, &#39;unload&#39;
    ];

    function stopPropagation (e) {
e.stopPropagation();
// e.preventDefault(); // Stop for the form controls, etc., too?
    }
    for (i=0; i &lt; handlers.length; i++) {
window.addEventListener(handlers[i], function (e) {stopPropagation(e);}, true);
    }

    if (window.stop) {
window.stop();
    }

    throw &#39;&#39;;
}

&lt;/script&gt;

akhir script kode anti uc browser


script kode anti ucbrowser di atas telah admin coba dan berhasil. semoga bermanfaat ya
*dariberbagaisumber

Secuil Ilmu dan Tips Menguak Peluang Penghasilan dari Blog dan Youtube

Sebenarnya banyak cara dan jalan mendapatkan penghasilan melalui internet, berikut 2 cara mendapat penghasilan internet yakni melalui blogger dan youtube.

1. KESEMPATAN MENDAPATKAN PENGHASILAN MELALUI BLOG

Sobat semua pasti pernah mendengar tentang blog bukan? Blog pun memiliki banyak jenis, topik, atau niche yang berbeda, diantaranya niche kesehatan, teknologi, olahraga, pendidikan, dsb.

Jika kita ingin memanfaatkan blog tentu akan dapat mendatangkan pundi-pundi penghasilan. Caranya?

- pastikan sobat telah mengetahui cara membuat blog
- fokus dan konsisten pada 1 niche
- follow atau add semua akun facebook, instagram, google+, blog, dan website yang memiliki niche yang serupa dengan blog sobat
- jika dari beberapa sumber di atas terdapat artikel yang menarik di hati jangan ragu untuk langsung eksekusi juga ke blog sobat dengan cara atm(amati-tiru-modifikasi)
- buat artikel dengan tata bahasa baru hasil gubahan dari artikel sumber
- lebih baik mengambil materi artikel dari beberapa blog dengan pembahasan yang sama lalu di gabung menjadi 1 artikel panjang untuk di publish di blog sobat
- jangan lupa sertakan sumber tiap kali sobat mengambil inspirasi dari akun-akun dan sumber di atas
- jadikan blog sobat sebagai jurnal besar pengetahuan yang sobat dapat dari berbagai sumber sesuai niche, selain untuk catatan ilmu sendiri juga dapat bermanfaat bagi orang lain kan?

Jika bekal konten artikel di blog telah di dapat selanjutnya adalah persoalan SEO, SEO sangat penting bagi sobat yang ingin blognya kedatangan banyak pengunjung, apalagi jika cukup satu saja artikel sobat bertengger di page one(halaman utama) mesin pencarian google maka di jamin artikel tersebut akan menjadi sumber kebanjiran pengunjung untuk waktu yang lama.

Bagaimana cara belajar SEO?

- perhatikan dan pelajari dasar-dasar SEO sobat bisa download ebook adsensenizer

Jika bekal konten artikel dan seo berhasil sehingga pengunjung blog sobat telah banyak maka hal selanjutnya adalah monetisasi atau menjadikan sumber penghasilan uang. Caranya?

- daftar adsense dan pasang iklan adsense
- sediakan slot iklan bagi yang ingin memasang iklan di blog sobat

Kenapa harus adsense?

Seperti pengalaman ane sendiri sebenarnya banyak penyedia iklan lainnya seperti adsoptimal dan revenuehits yang cukup mudah pendaftarannya dan diklaim menjanjikan, namun bagi orang-orang yang tidak sabar apalagi pengunjung blognya belum sampai ribuan perhari tentu sulit untuk dapat cepat mendapatkan penghasilan dari 2 penyedia iklan alternatif adsense di atas.
Diperparah juga dengan harusnya memasang iklan type popup maupun floating yang sangat mengganggu pengunjung dalam berselancar di blog kita, sehingga jangan sampai pengunjung menjadi terganggu dan kapok untuk membuka kembali blog kita.

Adsense memiliki type iklan yang cukup sederhana yakni banner, sebenarnya ada juga iklan popup dan floatingnya(masih beta) namun tidak mengganggu kenyamanan pengguna. Disamping itu adsense selain memperhitungkan pendapatan dari per klik iklan juga memperhitungkan pendapatan kita dari seberapa seringnya iklan tampil dan di lihat pengunjung, walaupun rasio perbandingan antara klik dan lihat cukup jauh hal ini menjadi nilai lebih adsense dibanding penyedia iklan lainnya.

Nilai per klik dari adsense juga cukup besar dibandingkan dengan penyedia iklan lain, perlu diperhatikan dalam hal ini adsense membagi besarnya nilai penghasilan per klik berdasarkan I.P pengunjung yang klik iklan sobat, I.P yang berasal dari U.S, Kanada, Australia lebih besar di bandingkan dengan I.P yang berasal dari Indonesia perbandingannya bisa $1:$0.01 bahkan $10:$0.1 tiap kliknya. Cukup besar bukan?!
Maka beruntunglah bila sobat bisa mengembangkan blog berbahasa inggris dan memasang iklan di blog tersebut.
Usahakan sobat memiliki 1 akun adsense,

Saking perlu dan most recommendednya adsense bila perlu sobat beli akun adsense bug untuk belajar dan mencoba system adsense sambil terus berusaha daftar resmi mengejar full approved. Harga adsense bug Juli 2016 di luar sana berkisar antara Rp50rb - Rp150rb / akun, tidak rugi rasanya menyisihkan budget seharga paket interner tersebut untuk belajar dan mencoba mendapatkan penghasilan lebih.

Kenapa hanya adsense dan slot iklan sendiri?

Pada poin sediakan slot iklan bagi yang ingin memasang iklan di blog sobat ini bukan bercanda loh, karena dengan kita menyediakan slot iklan sendiri maka akan menjadi pendapatan kontan kita dari blog, hal ini menjadi andalan ane dalam beberapa bulan belakangan, perhitungannya jika 1 slot iklan sobat patok harga minimal saja Rp10rb maka jika sobat menyediakan slot iklan 5 slot Rp50rb sudah di genggaman tiap bulan lumayan untuk membeli modal paket internet, ini minimal lhoo dan hitung-hitung sambil menunggu saldo berjalan dari penyedia iklan seperti adsense dan lainnya yang terkadang berjalan merayap bahkan stuck(hehe masih tahap belajar).

Bagaimana cara menentukan harganya?
Coba sobat googling harga pasaran slot iklan blog, biasanya dihitung atau ditentukan per 1000 pageview, buka 1000 visitor ya. Jika blog sobat pageviewnya telah 1000 perhari maka blog sobat telah wajar untuk mematok harga Rp25rb/slot/bulan. Lumayan kan!!?
Jika pengunjung dan pageview dari blog sobat telah banyak mencapai puluhan ribu bahkan ratusan ribu perhari maka pemasang iklan pun akan mencari dan berebut untuk memasangkan iklannya di blog sobat.

*perbedaan asumsi perhitungan dan patokan pageview dapat berbeda-beda

Dari penjelasan singkat diatas inti dari agar kita mendapatkan penghasilan dari blog yakni:

Konten(artikel) banyak (+seo) = Traffic(pengunjung) banyak (+ads) = Income(penghasilan) banyak

2. KESEMPATAN MENDAPATKAN PENGHASILAN MELALUI YOUTUBE

Siapa yang tak kenal youtube? Website penyedia konten video terbesar di jagad maya, sayang sekali jika kita tidak ikut ambil bagian untuk memanfaatkan youtube. Jika selama ini kita hanya sebagai penonton maka mulai saat ini tidak ada salahnya kita berubah menjadi sebagai penonton sekaligus pemain youtube.

Pemain youtube maksudnya uploader youtube atau pembuat video yang nantinya kita upload di youtube, jika kita ingin mendapatkan penghasilan dari youtube sebelumnya video yang akan kita upload harus original video hasil rekaman kita sendiri dan bisa juga video editan yang tidak melanggar hak cipta. Maksudnya?

1. Harus original video hasil rekaman kita sendiri

Poin 1 ini tentu sobat paham yakni video hasil rekaman dari ponsel kita maupun dari perangkat kamera kita lainnya, seperti video saat kita memasak, video saat kita membuat mainan perahu kertas, dan video lainnya.

Bagi pengguna ponsel smartphone maupun laptop/pc juga dapat memanfaatkan fitur perekam layar pada perangkat sobat,
contoh:
- rekam layar saat sobat melakukan tutorial edit foto
- rekam layar saat sobat melakukan cara menggunakan aplikasi tertentu
- rekam layar saat sobat bermain game untuk menampilkan video review game

dan banyak lagi contoh lainnya yang bermanfaat untuk orang lain mengetahuinya atau berpotensi di cari penonton youtube. Yang penting harus original ya. Karena yg original lebih tahan lama dan terjamin dapat di monetisasi.

2. bisa juga video editan yang tidak melanggar hak cipta

Kenapa harus tidak melanggar hak cipta? Karena kalau kita me-upload ulang video hasil download apalagi video tersebut memiliki hak cipta seperti video klip lagu, video cuplikan trailer film, video film, dkk tidak akan bisa di monetisasi dan kemungkinan besar malah akun youtube sobat akan di banned.

Namun resiko banned dan peluang untuk dapat di monetisasi dari video2 tersebut di atas dapat di akali jika kita terlebih dahulu mengeditnya sebelum di upload dan di monetisasi.

Caranya?

Gunakan aplikasi editor video untuk pengguna ponsel android, diantaranya:
- kinemaster
- videomaker
- powerdirector
Dan lainnya yang dirasa paling cocok untuk sobat.

Edit apanya?

- tambahkan efek-efek tampilan
- tambahkan frame besar
- edit nada lagu/crop bagian lagu jika terdapat lagu ber hakcipta

Selanjutnya, upload dan berdoa agar dapat di monetisasi, biasanya video editan yang terbukti mendatangkan ratusanribu bahkan jutaan pengunjung akan tertular juga di video kita walaupun hasil editan, sehingga akan lebih cepat mendatangkan penghasilan lebih besar dari banyaknya penonton, namun biasanya video-video ini tak bertahan lama, resikonya jika ketahuan maka icon monetisasi akan hilang dan ada pemberitahuan bahwa video sobat tidak bisa lagi di monetisasi.

Cara monetisasi Youtubenya gimana???

Sama seperti blog, main youtube juga mengandalkan adsense sebagai satu-satunya penyedia iklan dan ladang penghasilan youtubers, adsense menyediakan type akun khusus bagi youtubers yakni adsense hosted.

Cara dapetin akun adsense hosted?

Banyak tutorial yang tersebar jika sobat ingin googling cara membuat akun adsense youtube, tenang saja membuat adsense youtube pasti diterima 100% asal sebelumnya sobat telah meng-upload 1 video hasil rekaman sendiri berdurasi >3 menit, apapun video itu.

Konten video udah, monetisasi adsense youtube udah, sekarang saatnya memperbanyak penonton dan memperbanyak subscribers. Caranya?

- gunakan #tag yang tepat sasaran
- gunakan judul yang dapat memancing penonton
- gunakan foto thumbnail yang dapat mengundang penonton
- gunakan CAPSLOCK untuk judul agar menarik perhatian penonton untuk membuak
- buatlah konten video yang menarik untuk di tonton, tidak perlu editan efek-efek megah, cukup sematkan background music free dan editan simple berupa text dan transisi yang mendukung isi dan maksud dari video sobat
- ajaklah penonton untuk subscribe channel youtube sobat, jika kita memiliki konten yang menarik dan konsisten tentu penonton tidak akan ragu untuk men-subscribe channel youtube kita.

KESIMPULAN

Dari pembahasan diatas terbukti ada cara dan peluang untuk kita yang mau dan memulai serius untuk mendalami dan belajar Blog dan Youtube, Blog dan Youtube memiliki keunggulan dan kekurangan masing-masing, di samping keunggulan dan kekurangan blog serta youtube kita juga dapat menyinkronkan blog dan youtube kita, entah memasang video tutorial dari youtube kita ke blog, atau sebaliknya, memvisualkan artikel dari blog ke video youtube.

Terakhir di samping semua hal di atas ada 1 point penting lagi dalam mendulang traffic/pengunjung yakni PROMOSI, perbanyaklah dan sering-seringlah promosi ke berbagai sosial media seperti google plus, instagram, twitter, linkedin, pinterest, facebook, path, dan lainnya. Jika sobat ada keuntungan lebih tak ada salahnya memasang iklan juga di blog atau website lain yang memiliki traffic tinggi.

Jangan menyerah kita sama-sama belajar, karena para master blogger dan youtuber yang berpenghasilan jutaan perhari dimulai dari langkah yang sama dengan kita, tak perlu berharap yang muluk, jika ilmu sudah di dapat, tinggal tubuh yang action untuk mengamalkan, seribu langkah di mulai dari satu langkah kecil.

*Penulis hanya blogger dan youtuber pemula yang masih belajar, mencoba fokus dan memperdalam blogging dan youtube, maaf jika penulisan dan gaya bahasa yang sangat-sangat berantakan, sedikit ilmu dari penulis coba tuangkan di atas semoga dapat bermanfaat dan memberi keberkahan kelak bagi pembaca, sehingga hanya pahala dari ilmu yang sedikit inilah yang penulis harap. Semoga bermanfaat.

@yanuabialwi
@catatandroid
@cron(custom rom news)

Cara Membuat Widget Recent Comments di Blog dengan Avatar

Membuat widget recent comment atau komen terakhir di blog, tutorial ini sangat berguna bagi pemilik blog karena fungsinya adalah menampilkan history komen yang terjadi di artikel blog kita, jadi kita bisa memantau jika ada komentar baru dan akan lebih cepat untuk meresponnya sehingga pengunjung pun menjadi betah untuk berinteraksi melalui kolom komentar.

Turorial membuat widget recent komen ini saya dapat dari blog fahmyramdani saat hendak mencari tutorial cara memasang widget recent komen di google, karena agak ribet jika harus menunggu notifikasi dan membuka email saat ada komen.hehe

Courtesy Screenshot fahmyramdani

Tutorial Memasang Widget Recent Comment

- Masuk akun blogger
- Masuk menu layout atau tata letak
- Tambahkan Widget
- Pilih HTML/Javascript
- Lalu masukkan kode di bawah ini

<style type="text/css" scoped>
ul.kangismet_recent{list-style:none;margin:0;padding:0;}
.kangismet_recent li{background:none !important;margin:0 0 6px !important;padding:3px
!important;display:block;clear:both;overflow:hidden;list-style:none; border: 1px solid transparent;
border-radius:9px; max-height: 100px;}
.kangismet_recent li:hover{border: 1px solid #476481;;}
.kangismet_recent a {text-decoration:none;}
.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px
#ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;width:35px;height:35px}
.kangismet_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 10,
 showAvatar  = true,
 avatarSize  = 35,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "https://lh6.googleusercontent.com/-7KPbvU9OlKE/Uy0-3fMD_uI/AAAAAAAACQc/QjfFIZ2mYpU/s40/22.png",
 hideCredits = true;
 maxfeeds=50,
 adminBlog='Yanu Abi Alwi';
//]]>
</script>
<script type="text/javascript" src="https://kang-is.googlecode.com/svn/trunk/javascript/recentcomments2.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=kangismet_recent&amp;&amp;max-results=50">
</script>

- Save dan silahkan langsung lihat hasilnya

Terdapat beberapa pengaturan di bawah ini yang bisa di ubah-ubah

- NumComments = 5 (jumlah dari komentar yang tampil)
- ShowAvatar = true (false, bila mau menyembunyikan icon avatar)
- AvatarSize = 35 (ukuran dari avatar dalam pixel)
- RoundAvatar = true (pilihan avatar menjadi bulat)
- Characters = 40 (jumlah karakter dari isi komentar)
- DefaultAvatar = "https://lh6.googleusercontent.com/-7KPbvU9OlKE/Uy0-3fMD_uI/AAAAAAAACQc/QjfFIZ2mYpU/s40/22.png" (avatar default)
- AdminBlog='Yanu Abi Alwi' (nama admin yang akan di sembunyikan, wajib di ganti)


Demikian tutorial cara membuat atau menampilkan widget recent comment / komen terbaru di blog, semoga bermanfaat, terima kasih telah mampir dan membaca.

Tested di blog catatandroid

Cara Pasang Widget Alexa di Blog

Memasang widget Alexa di blog, berawal dari niatan ingin memasang widget Alexa di beberapa blog saya yang masih cupu sekaligus penasaran juga ingin tahu ranking berapa si blog saya di Alexa?hehe pastinya harus siap karena angka rangking blog saya pasti menyentuh angka belasan bahkan puluhan juta.wkwkwk. Jurus pamungkas dalam mencari tahu sesuatu pun di mulai, langsung buka google dan ketik "widget alexa di blog" dan munculah beberapa web dan blog yang sudah siap menerangkan cara memasang widget Alexa Rank di blog, kebetulan saya memilih yang langsung dari official Alexa yaitu situs support.alexa.com..blabla.. yuk kita simak bersama cara memasang widget alexa di blog.

Can I display my Alexa rank on my site?

Yes, using an Alexa widget like this you can display your site's Alexa rank on your site:



Just change yoursite.com to your website in two places in the HTML snippet below, and then copy and paste it into your website's HTML:

Copas kode di bawah ini

<a href="http://www.alexa.com/siteinfo/yoursite.com"><script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/t/a?url=yoursite.com"></script></a>

Here is a widget that displays both your site's Alexa rank and Sites Linking In count:



Copas kode di bawah ini

<a href="http://www.alexa.com/siteinfo/yoursite.com"><script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/s/a?url=yoursite.com"></script></a>

Note that our widgets do not support https.


Nah dari penjelasan official site Alexa di atas cara memasang widget Alexa di blog sangat mudah yaitu hanya tinggal memilih 2 jenis widget di atas lalu copas langsung di blog sobat semua, perhatikan juga pada keterangan yang di bold pada baris akhir yaitu widget alexa tidak mendukung link dengan https, jadi jangan memasukkan https saat pengetikan link site atau blog saat pemasangan widget Alexa di blog sobat. Semoga bermanfaat. Terima kasih telah berkunjung.

Cara Membuat Related Post Pada Blog

BOS TUTORIAL - Cara Membuat Related Post Dengan Gambar. Masih ingat tulisan sebelum postingan ini bukan, yaitu Cara Membuat Related Post Pada Blog. Jangan tanya lagi apa gunanya Related Post atau Artikel Terkait yah (heheheh... canda), soalnya disini sudah dibahas lebih detail. Kita langsung saja ke lokasi (kayak mau kemana aja nih...). Maksudnya langsung membuat tutorialnya, gitu loh....

Beginilah Cara Membuat Related Post Dengan Gambar
1. Tentunya anda harus buka akun blogger anda kawan.
2. Masuk Elemen Template - Lalu Klik Edit HTML
3. Carilah kode ]]></b:skin> (gunakan CTRL + F untuk mempermudah pencarian)
4 Apabila sudah ketemu, copylah kode di bawah ini lalu tempatkan persis di atas kode ]]></b:skin> tadi.

/* Related Post Dengan Tooltips Membuat Blog Keren --- */
.related-post .post-thumbnail {
z-index: 1; position: relative;
width: 100px;
height: 100px;
margin: 0; display: block;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 2px 2px 5px #444;
-moz-box-shadow: inset 2px 2px 5px #444;
box-shadow: inset 2px 2px 5px #555;
}
.related-post {
float: left; position: relative;
width: 108px;
height: 108px;
margin: 0 10px 10px 0;
background: #F6F6F6;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.related-post .related-post-title {
display: none;float: left; background: #00B366;
color: #fff;
text-shadow: none;
font-weight: bold;
padding: 10px;
position: absolute;
top: -20px;
left: 40px;
z-index: 2;
width: 200px;
-webkit-box-shadow: 0 0 2px #444;
-moz-box-shadow: 0 0 2px #444;
box-shadow: 0 0 2px #444;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.related-post:hover .related-post-title {display: block;}

5. Jangan beranjank dulu, masih ada yang harus di cari. Lihat kode selanjutnya di bawah ini, lalu cari kode <div class='post-footer-line post-footer-line-1'/> atau <div class='post-footer-line post-footer-line-2'/> (gunakan CTRL + F untuk mempermudah pencarian)

6. Apabila sudah ketemu dan anda yakin, copy kode di bawah ini dan pastekan tepat di bawah kode <div class='post-footer-line post-footer-line-1'/> atau <div class='post-footer-line post-footer-line-2'/>

<div id='related-posts'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>//<![CDATA[
var ry='<h3>Related Posts</h3>';rn='<h3>&nbsp;&nbsp;&nbsp;No related post available</h3>';rcomment='comments';rdisable='disable comments';commentYN='no';
var dw='';titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if('thr$total' in d){commentsNum[titlesNum]=d.thr$total.$t+' '+rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;timeR[titlesNum]=d.published.$t;if('media$thumbnail' in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjs5FcQGtJAF8u5ni_5i4aSvvaJGrx1IMDyxe6o6TSureZe0kaAUq16366dUDn3WAsCoIrpTQrKLY5d28MvKNCoNR0H9JWQvd-jPxtwwm9SiYgJbQnt8N9j_tC-STkjQXLCc_Tnn9OLpbKj/'};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf('?m=0');if(y!=-1){a=a.replace(/\?m=0/g,'')}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);timeR.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+='<div class="clear"/></div><ul>';while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+'?m=0'}if(commentYN=='yes'){comments[c]=' - '+commentsNum[c]}else{comments[c]=''};dw+='<div class="related-post"><div class="related-post-title">'+titles[c]+'</div><a href="'+urls[c]+'" rel="nofollow"><img border="0" class="post-thumbnail" alt="'+titles[c]+'" src="'+thumb[c]+'"/></a></div></div>';if(c<titles.length-1){c++}else{c=0}b++}dw+='</ul>'};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById('related-posts').innerHTML=dw};
//]]></script>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>var maxresults=5;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script>
</b:if>
</div>
<div class='clear'/>

7. Selesai
8. Simpan template blog anda kawan.

Catatan Yang harus anda perhatikan.

• maxresults=5 adalah jumlah artikel yang anda tapilkan pada Related Post. Silahkan anda tambahi atau kurangi sesuai keingan anda.
• 100px adalah ukuran gambar, baik tinggi maupun lebarnya. Silahkan anda ganti bila anda ingin memperkecil atau memperbesarnya.
• Tulisan Related Post silahkan anda ganti dengan sesuka anda, misalnya jadi Artikel Terkait, atau Mungkin Ini Anda suka" dan lain-lain sesuka anda.
• Bila gagal, coba ulangi lagi perlahan-lahan. Biasanya sih bisa.

Dah cuma segitu, tutorial mengenai Cara Membuat Related Post Dengan Gambar. Silahkan di coba yah. Semoga bermanfaat. Bila anda kendala silahkan bertanya di kolom komentar. Dan Salam Blogger.

---

Sumber

bos-tutorial 

Tested oleh Yanuabialwi pada blog sesehatan.blogspot.com

dengan perubahan penempatan script ke dua di atas

<b:includable id='postQuickEdit' var='post'>

Cara Membuat Auto Read More Sendiri di Blog Terbaru

Cara membuat auto read more. Read more yang berfungsi untuk mempersingkat tampilan posting di halaman awal blog. Read more ini berbeda dengan Read More Versi Blogger, yang harus di lakukan secara manual, read more ini otomatis. Jadi tidak perlu lagi menggunakan insert jump break. Untuk lebih jelasnya silakan lihat gambar dibawah ini.

Dari gambar diatas, read more dilengkapi dengan tampilan gambar dari salah satu halaman posting, posisi gambar disebelah kiri dan diteruskan dengan sedikit penjelasan dari isi artikel. Cara membuat auto read more. Ikuti langkah-langkah dibawah ini.

1. Login ke blogger. Dari halaman dasbor, pilih pengaturan template.
2. Dan Klik edit HTML, dan cari kode </head> gunakan Ctrl F untuk mempermudah Pencarian.
3. Selanjutnya, jika sudah ketemu, masukan kode berikut dibawah </head>
<!-- Auto read more script Start -->
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
    if(strx.indexOf("<")!=-1)
    {
        var s = strx.split("<");
        for(var i=0;i<s.length;i++){
            if(s[i].indexOf(">")!=-1){
                s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
            }
        }
        strx =  s.join("");
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2;
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
    strx = strx.substring(0,chop-1);
    return strx+'...';
}
function createSummaryAndThumb(pID){
    var div = document.getElementById(pID);
    var imgtag = "";
    var img = div.getElementsByTagName("img");
    var summ = summary_noimg;
        if(thumbnail_mode == "yes") {
    if(img.length>=1) {  
        imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
        summ = summary_img;
    }
    }
    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
}
//]]>
</script>
<!-- Auto read more script End -->
4.  Keterangan kode diatas:
summary_noimg = 430; Jumlah huruf tanpa gambar
summary_img = 340; Jumlah huruf dengan gambar
img_thumb_height = 150; Tinggi Gambar
img_thumb_width = 150; Lebar Gambar
5. Selanjutnya cari kode <data:post.body/> dan ganti dengan kode berikut ini.
<!-- Auto read more Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div style='text-align:justify;' expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<a class='more' expr:href='data:post.url'><font color='#1780dd'>Baca Selengkapnya &gt;&gt;&gt;</font></a>
</b:if>
</b:if>
<!-- Auto read more End -->
6. Ada 3 kode yang sama dengan <data:post.body/>, ganti semuanya dengan kode diatas.
7. Kode <font color='#1780dd'>Baca Selengkapnya &gt;&gt;&gt;</font></a> . Tulisan Baca Selengkapnya bisa diganti dengan kata yang kamu inginkan, <font color='#1780dd'> Ini kode warnanya, bisa diganti dengan warna lain. &gt;&gt;&gt; ini kode tanda >>> setelah tulisan Baca selengkapnya.
8. Terakhir, save template. Selesai. Semoga Bermanfaat.

 ---

Sumber

pengguna-komputer

Cara Menambahkan Komentar Facebook Di Blog

Cara Menambahkan Komentar Facebook Pada Blog. Sobat blogger menambahkan komentar facebook pada blog memang mempunyai beberapa keuntungan, diantarnya dapat mempermudah pengunjung untuk meningalkan komentar di blog anda tanpa harus login melalui akun google, karena pada dasarnya pengunjung tidak semua mempunyai akun google,jadi komentar facebook bisa jadi solusi untuk komentar menjadi lebih mudah dan juga mempermudah berkomentar pada versi mobile karena sudah di desain dengan responsive jadi bisa menyesuaikan ukuran termasuk dalam handphone atau tablet sekalipun

Lihat DEMO

Cara pasang komentar facebook ini sangat mudah sekali untuk di terapkan selain itu juga dengan menambahkan komentar facebook selain mempunyai kelebihan dan mempermudah komentator juga bisa sedikit lebih bergaya dan lebih keren dalam tampila,nah bagi anda yang ingin membuat komentar facebook di pasang di blog anda itu sangat mudah sekali sobat blogger, silahkan ikuti tutorial cara menambahkan komentar facebook sehingga bisa terpasang di blog anda.

Baca juga : Cara Pasang Like Box Fanspage Facebook Di Blog

Cara Membuat Komentar Facebook Pada Blog

1. Buka akun blogger anda
2. Pilih menu template > Klik edit Html
3. Lalu letakan kode dibawah ini tepat di atas kode ]]></b:skin> atau </style>

/* facebook comments By Madamvia.web.id */
.fbbox-comments {
box-sizing: border-box;
-moz-box-sizing: border-box;
background:#f6f6f6;
border:1px solid #e5e5e5;
margin: 0 0 20px;
}
.fb-comments{width: 100% !important;}
.fb-comments iframe[style]{width: 100% !important;}
.fb-like-box{width: 100% !important;}
.fb-like-box iframe[style]{width: 100% !important;}
.fb-comments span{width: 100% !important;}
.fb-comments iframe span[style]{width: 100% !important;}
.fb-like-box span{width: 100% !important;}
.fb-like-box iframe span[style]{width: 100% !important;
}

4. Selanjutnya letakan kode di bawah ini tepat di bawah kode <data:post.body/>  atau </article>

 <!-- facebook comments responsive-->
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
<script>
//<![CDATA[
$(window).bind("load", function(){  
 var container_width = $('.fbbox-comments').width();  
 var fburl=(window.location.href);
 var fbfix=fburl.indexOf('?');
 var fburlfix = fburl.substring(0, fbfix != -1 ? fbfix : fburl.length);
$('.fbbox-comments').html('<div class="fb-comments" ' +
'data-href="' + fburlfix + '"' +
' data-width="' + container_width + '" data-num-posts="5"></div>');
FB.XFBML.parse( );  
});
//]]>
</script>
<div class='fbbox-comments' style='width:100%;margin-top:20px'>
<div class='fb-comments' data-num-posts='2' data-width='555' expr:data-href='data:blog.url'/>
</div>
  </b:if>  

5. Klik save template.

Catatan : Biasanya kode <data:post.body/> ini lebih dari satu, anda bisa menecobanya satu persatu hingga posisinya benar di bawah artikel atau posting blog, atau kalo anda tidak mau ribet, bisa di pasang di bawah kode share button ataupun related post.

Nah cukup sekian sobat blogger di tutorial cara membuat komentar facebook di blog, lebih dan kurangnya saya mohon maaf. salam sukses.

Sumber

Cara Menghubungkan Domain Freenom .ga .tk .ml .cf ke Blog

Menghubungkan domain freenom ke blogspot tergolong mudah, karena freenom mempunyai kecepatan update DNS Server tercepat dibandingkan penyedia layanan hosting dan domain yang ada di Indonesia. Mungkin dalam waktu 2-5 menit domain freenom sudah bisa digunakan, sedangkan layanan di Indonesia membutuhkan kurun waktu 1-5 Jam untuk menghubungkan domain mereka ke blogspot.

Apasih gunanya dihubungkan?

Melihat panjanganya kata blogspot, membuat orang susah untuk mengingat nama domain. Berikut menurut saya keuntungan untuk menghubungkan domain freenom ke blogspot:

• Mudah diingat orang, karena domain tergolong pendek (.ga, tk, dkk)
• Support untuk membuat akun google adsense non hosted
• Lebih simple dan lebih elegan
• Lebih keren
• Menambah wawasan dan lain sebagainya.

Selanjnya, iniloo cara menghubungkan domain freenom ke blogspot:

1. Buka Account freenom yang telah dibuat (jika belum punya, silahkan buat dan lihat caranya disini)

2. Buka Account blogspot (blogger) dan masuk ke menu setelan (jika belum punya buat saja disini)

3. Pada menu setelan dasar, Siapkan URL Pihak ke-3 untuk Blog, tepat dibawah domain blogspot.

4. Selanjutnya, masukkan nama domain freenom yang telah dibuat misal www.iniloo.ga, kemudian klik simpan.

5. Maka akan muncul error URL, selanjutnya, copy satu persatu Host Name ke Manage DNS di Freenom.

Buka Freenom, My Domain --> Manage Domain dan Manage Freenom DNS

Masukkan Name (www dan xfwhramnici (bisa berubah-ubah) ke Host Name freenom.

Untuk Type pilih CNAME, TTL gak usah diubah kemudian target isi sesuai target Host Name Seperti gambar dibawah:

6. Setelah itu, masukkan Record IP Google. IP Google sebagai berikut:

216.239.32.21216.239.34.21216.239.36.21216.239.38.21

Masukkan IP tersebut pada kolom target. Dengan Type = A. Seperti gambar dibawah ini.

Selanjutnya klik Simpan, jika semua benar maka akan muncul notifikasi Successfully.

7. Kembali ke blogger, setelah setelan sudah selesai, maka tunggu 2-5 menit. Kemudian simpan perubahan domain. Jika masih error, tunggu beberapa menit dan simpan lagi.

8. Jika domain sudah berubah, selanjutnya edit kembali domain pihat ke-3 dan centang alihkan domain kamu, misa iniloo.ga ke www.iniloo.ga. Ini bertujuan ketika seseorang akses tanpa www didepan, maka otomatis langsung direct ke www. Jangan lupa simpan lagi.

Demikianlah, tutorial tentang cara menghubungkan domain freenom ke blogspot, semoga dapat menambah pengetahuan kalian dalam dunia blogspot. Penulis mengharapkan kepada teman-teman untuk menyebarluaskan artikel ini baik media sosial maupun blogspot kalian dengan catatan menuliskan sumber artikel ini. Penulis juga menyediakan artikel video, dipersembahkan untuk mereka yang lambat paham dengan tutorial tulisan dan gambar.

Sumber

Cara Pasang Iklan di Tengah Post Artikel Blog

PelangiBlog.Com – Sebelum menjelaskan tutorial seperti yang bisa Anda baca pada judul posting ini, ada dua posting sebelumnya yang sudah saya terbitkan tentang pembahasan mengenai tutorial memasang iklan adsense di tengah posting. 

Cara Memasang Iklan Adsense di Atas, di Tengah, dan di Bawah Posting

Cara Memasang Iklan Adsense Di Tengah Posting, Sempurna dan Rapi

Jika dibanding dengan tutorial pada 2 link di atas, tutorial ini sangat tepat dan lebih sempurna. Ok, langsung saja, mari simak langkah dan proses memasang iklan adsense di tengah posting dengan sempurna :

1. Login ke akun blogger

2. Masuk dashboard

3. Klik “Template” lalu klik “Edit HTML”

4. Cari kode di bawah ini, gunakan CTRL + F agar lebih mudah

<data:post.body/>

Catatan :

• Perlu diingat, biasanya Anda akan mendapati 3-4 kode yang sama seperti di atas. Silahkan pilih kode kedua saja, jika gagal maka cobalah satu persatu
• Jangan lupa untuk back up template Anda terlebih dahulu, ini penting untuk mencegah terjadinya error saat penyimpanan template 

5. Ganti kode <data:post.body/> dengan kode di bawah ini :

<div expr:id='&quot;post1&quot; + data:post.id'/>

<div class='googlepublisherads' style='margin:20px 0'>

<div class='separator' style='clear: both; text-align: center; '>

PASTE KODE SCRIPT IKLAN DI SINI

</div>

</div>

<div expr:id='&quot;post2&quot; + data:post.id'><data:post.body/></div>

<script type='text/javascript'>

var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);

var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);

var s=obj1.innerHTML;

var t=s.substr(0,s.length/2);

var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);

if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}

</script>

6. Simpan template

Contoh demo bisa di lihat pada gambara di bawah ini :

Saya telah menjelaskan kelemahan dari dua tutorial pada link paling atas dan juga tutorial pada posting ini, silahkan disimak pada 3 Cara Memasang Iklan Adsense Di Tengah Posting Blog.

Sumber