Warna Biru untuk Link-Hyperlink Blog

APA warna link/hyperlink di blog Anda, terutama di bagian posting (single post)? Warna Biru? Good! Biru (blue) adalah warna terpopuler untuk hyperlink atau link. Google, Facebook, Twitter, Yahoo!, dan Wikipedia menggunakan warna biru di link/hyperlink.

Wikipedia bahkan menggunakan istilah "blue link" dalam tulisan atau referensi tentang pengertian  "Hyperlink".

Ahli desain web yang sering mengadakan riset soal desain website, NN Group, juga menggunakan warna biru (#03c) sebagai link.

Sebaiknya, kita "ikut biru" juga karena user sudah terbiasa dan memahami bahwa yang berwarna biru adalah link/hyperlink yang bisa diklik dan mengarah ke posting atau blog lain.

Kode HTML Warna Biru

Berikut ini kode-kode warna biru yang digunakan Google dan situs-situs terpopuler lainnya. Anda bisa gunakan untuk mengganti warna link di blog Anda. Daftar kode warna lainnya dan selengkapnya bisa dilihat di Kode Warna HTML.

1. Kode HTML Warna Biru Link Google: #1e0fbe
2. Kode HTML Warna Biru Link Facebook: #3b5998
3. Kode HTML Warna Biru Link Twitter: #00acee
4. Kode HTML Warna Biru Link Wikipedia: #0645ad
5. Kode HTML Warna Biru Link NN Group:  #03c
6. Kode HTML Warna Biru Persib Bandung: #0033CC

Kode warna biru lainnya bisa Anda "intip" di situs masing-masing dengan cara:

1. Select All tulisan atau area yang berwarna biru
2. Klik Kanan 
3. Pilih "Inspect Element"
4. Copy kodenya yang diawali dengan kode pagar (#)

Makna Warna Biru

Menurut berbagai sumber hasil Googling, warna biru memiliki beberapa arti atau makna kejujuran, ketenangan, kesetiaan, bisa diandalkan, dan keharmonisan. Biru juga memberi kesan lapang dan sensitif.

Dalam dunia psikologi, biru itu simbol kestabilan karena biru merupakan warna langit. Secara psikologis warna biru ini akan memberikan dampak menenangkan, mengurangi ketegangan, serta menciptakan "sensasi cool."

Prinsip Warna Link

Haruskah link-hyperlink blog kita berwarana biru? Tidak harus, tapi "sebaiknya", mengingat situs-situs terkemuka di dunia juga menggunakan warna biru dengan berbagai variasinya.

Prinsipnya, warna link HARUS BERBEDA dengan warna teks utama. Jika teks utama hitam, sebaiknya tidak menggunakan warna hitam juga untuk link --kecuali jika Anda bermaksud  "menyembunyikan" link itu.

Menurut para ahli desain, hindari juga "penggunaan warna yang menyala" pada link --juga background blog-- karena warna menyala --seperti merah atau orange-- bisa membuat mata user cepat lelah sehingga pengunjung tidak akan betah berlama-lama dalam membaca. Lebih fatal lagi, terjadi "bounce back" atau "bounce rate" --user cepat klik "back" di browsernya untuk menutup blog dan kembali ke indeks hasil pencarian Google.

Guna mengantisipai user yang buta warna (blue color blind), disarankan pula  menggunakan "garus bawah (underline) pada link blog.

Cara Mengubah Warna Link

Warna link di template blog biasanya ada dalam kode-kode HTML seperti di bawah ini:

a:link {color:#0033cc;text-decoration: underline;}
a:hover {color:#c00;text-decoration: underline;}
a:visited {color:#990099;text-decoration: underline;}

Link = tauutan; #0033cc = biru

Hover = tampilan jika cursor mouse diarahkan ke link itu; #c00 = merah

Visited = tanda bahwa link itu sudah diklik sebelumnya; #990099 = ungu

Cara mengubahnya, Template > Edit HTML,  temukan dan ganti kode warnanya sesuai dengan selera Anda. Hidup The Blues dan Pangeran Biru! :)

Read more ...

Cara Membuat Related Post dengan Gambar

POSTING tentang cara membuat related post dengan foto atau gambar thumbnail (Related Posts with Thumbnail Image) ini dibuat terkait pertanyaan dan permintaan seorang pengguna template New Johny Wuss. Ia ingin menggunakan posting terkait yang menampilkan foto dan judul.

CB menggunakan kode related post dengan gambar yang di-share oleh Help Blogger dengan sedikit modifikasi dan "membersihkannya" dari kemungkinan ada injeksi link.

Demonya bisa dilihat di blog CB Online Store atau Cibi Magz. Lihat bagian Related Posts di bawah postingan.

Pengguna New Johny Wuss lainnya boleh mempraktekan ini. Caranya, sebelumnya HAPUS dulu SEMU kode di template yang bertuliskan "related post, lalu lakukan dua langkah mudah berikut ini

Cara Membuat Related Post dengan Gambar di Blogspot

1. Copy + Paste kode di bawah ini DI ATAS kode </head>

<!--Related Posts with thumbnails Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #f2f2f2;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:100px;height:80px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;}
#related-title {color:#0033cc;text-align:center;padding: 0 5px;font-size:12px Arial; line-height:16px;text-shadow:0 2px 2px #fff;height:28px;width:100px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails End-->

Catatan: kode berwarna biru adalah ukuran gambar/foto yang akan ditampilkan, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

2. Copy + Paste kode di bawah ini DI ATAS kode <div class='post-footer'> (di template New Johny Wuss ada dua kode begini, pilih kode YANG KEDUA):

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'><b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'></b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;<b>Related Posts:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Catatan: kode berwarna biru adalah jumlah related post, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

Jangan lupa SAVE Template! Good Luck and Happy Blogging!

* Lihat Demo Related Post dengan Gambar
* Cara Membuat Related Post Tanpa Gambar (Hanya Judul Posting)

Read more ...

Cara Download Video Youtube dengan Mudah

SEKADAR menyimpan catatan tentang cara Download Video Youtube dengan mudah, cepat, dan tanpa harus install sofware e.q. Youtube Downloader.

Ada tiga situs yang biasa CB gunakan untuk mendownload Video Youtube, yang paling sering digunakan nomor 1. Ketiga situs ini bukan cuma bantu kita download video, tapi juga mengkonversinya (mengubah file video) menjadi MP3, MP4, atau 3GP.

Cara downloadnya mudah. Tinggal buka video yang mau didownload, lalu COPY LINK-nya yang ada di Address Bar, dan PASTE di kolom yang disediakan ketiga situs downloader video berikut ini:

1. Catch Video
2. Listen to Youtube
3. Save From 

Situs nomor 3 bahkan membantu kita download file dari situs-situs penyimpanan file terkemuka, seperti Rapid Share, File Factory, Vimeo, dll.

Selain ketiga situs tadi, masih banyak situs downloader video lainnya. CB simpan tiga ini buat memudahkan CB jika mau download video. Di-share di sini, siapa tahu ada yang belum tau :)

Download Video Youtube, untuk apa?
Download video youtube utamanya untuk kita simpan dan bisa ditonton saat sedang Off Line. Bagi Anda yang punya koneksi internet "lemot" atau "pas-pasan", download video youtube menjadi alternatif utama biar nontonya nyaman dan "fast loads".

Anda punya referensi lain soal Cara Download Video Youtube dengan Cepat dan Mudah? Please, share...!

Read more ...

Cara Menghapus Komentar Spam (Link Hidup) secara Otomatis

Cara memasang kode anti komentar spam yang menghilangkan link aktif secara otomatis.

COBA lihat komentar di blog Anda. Adakah yang menyertakan link hidup (live link)? Pastinya, jika sang komentator itu "tukang nyepam" (spammer), ia pasti akan menyertakan link hidup di komentarnya. Link hidup adalah link yang "tinggal di klik".

Ini contoh link hidup> CONTOH BLOG
Ini contoh link yang "tidak hidup" > http://contohblognih.blogspot.com

Jadi, jika ada yang komentar, misalnya begini: "Nice post! I'll bookmark you blog. Have a nice day http://contohblognih.blogspot.com atau Contoh Blog. 

Itulah komentar spam atau setidaknya komentar spammy (berbau spam).

((( Ssst....! Cara membuat lin hidup di komentar blog itu mudah lho! Tinggal tambah <a href="URL LINK">Link</a>. Kaya gini nih: <a href="http://contohblognih.blogspot.com">Contoh Blog</a> )))

Komentar spam merupakan "isu besar" bagi semua blogger. Blogger sebenarnya sudah membantu mendeteksi komentar spam dan menyimpannya di menu "Spam" di Dashboard. Tapi, spammer "cerdik" menghindarinya dengan hanya menyertakan satu-dua link hidup di komentarnya.

Kasarnya begini, komentar spam itu adalah komentar yang hanya bermaksud menyisipkan link blognya ke blog kita. Dia tidak benar-benar bermaksud komentari posting kita, tidak bermaksud apresiasi atau bertanya soal isi posting. Hanya mau nyepam alias nyisipin link!

Bagaimana Cara Menghapus Link Hidup secara Otomatis Komentar Spam Blog? 

Sebenarnya sih kita bisa hapus saja jika ada komentar yang menyertakan link hidup, tapi "kejam banget" :)

Pasang kode di bawah ini di template Anda, di atas kode ]]</b:skin>. Cara CB,  kode di bawah ini diletakkan di bawah kode-kode komentar (comment):

.comment-content a {display: none;}

Cara di atas cukup ampuh menghapus, menghilangkan, alias melenyapkan link hidup secara otomatis di komentar blog. It work for CB! Just try....!!!

Contoh link hidup yang hilang ada di komentar di bawah, tes komentar dari CB. Live linknya hilang tu 'kan...? Tadinya begini: Ini contoh link hidup> CONTOH BLOG

Kode Anti Spam Link Lainnya

Biar lebih mantap, pasang juga kode anti link spam berikut ini yang akan menghapus selamanya link yang ada di komentar.

Copas kode berikut ini di atas kode </body> 

<!--Stop Blog Comments -->
<script>$('.comment-content a[rel$=nofollow]').replaceWith(function(){return ($(this).text());});
</script>
<!--Stop Blog Comments -->

Kode-kode anti komentar spam itu WAJIB dipasang di blog Anda. Secara, banyak bingit admin blog yang "nakal" dengan menebar spammy & junk comment dan menyertakan link hidup (active link) demi mendapatkan backlink.

Kepada para tukang spam, termasuk "tukang obat", CB sarankan hentikan kebiasaan buruk yang dimusuhi para blogger itu. Good Luck and Happy Blogging! (http://contohblognih.blogspot.com/).*

Sumber

Read more ...

Haruskah Menampilkan Widget Alexa Rank di Blog?

Haruskah kita Memasang, Membuat, atau Menampilkan Widget Alexa Rank di Blog? Bagi blogger baru yang "belum tahu", Alexa Rank adalah peringkat blog kita di "klasemen" blog internasional (global rank) dan Indonesia (rank in Indonesia).

Jika Anda ingin tahu ada di urutan berapa popularitas blog Anda, tinggal buka Alexa --sekalian daftarkan blog Anda-- lalu masukkan url blog Anda. Adakah? Kalo no data? Daftarkan segera blog Anda.

Kembali ke soal Haruskah Menampilkan Widget Alexa Rank di Blog, CB berpendapat, relatif! Jika blog kita punya ranking bagus di Alexa, harus pasang! Jika blog kita masih di posisi jutaan, gak usah dulu deh, malu-maluin! He he......

CONTOHBLOG sendiri sudah pasang Widget Alexa Rank kok, tapi "ngumpet" di About. Menurut Alexa, saat posting ini dibuat (28/4/2014), Global rank CONTOHBLOG: 80,517 dan Rank in Indonesia: 897. Lumayan.... :)

Jadi, haruskah Menampilkan Alexa Rank di Blog kita dan dilihat pengunjung?

Widget Alexa Rank di blog kita akan membuat pengunjung dengan cepat tahu ranking blog kita di situs pemeringkat yang sudah diakui dunia itu.

Jika ranking blog Anda bagus, dengan widget alexa itulah kita "pamer" (show off) sekaligus meningkatkan kredibilitas blog di mata user.

Jika ranking trafik Alexa blog kita bagus, hal itu juga akan mengundang pemasang iklan potensial (potential advertisers).

Cara meningkatkan ranking Alexa

Cara terampuh meningkatkan ranking blog di Alexa adalah dengan menyajikan konten berkualitas (Quality Content) di blog. Content is STILL the King. Ini pula teknik SEO terbaik menurut Google.

Cara meningkatkan ranking blog kita di Alexa hakikatnya sama dengan cara meningkatkan pengunjung blog.

Intinya, blog kita harus berisi posting yang unik, asli, dibutuhkan pembaca, dan bermanfaat. Yang menentukan popularitas blog bukan jumlah posting, tapi kualitas! Istilahnya, "Quality is best Than Quantity".

Meski demikian, inilah cara tambahan guna meningkatkan peringkat alexa:

1. Avoid Errors. Hindari error, terutama Error 404. Baca: Cara Mengatasi Error 404.
2. Pasang Alexa Rank Widget di blog Anda. Dengan begitu, kunjungan Anda sendiri akan dihitung oleh Alexa.
3. Install "Alexa Toolbar" di Browser Anda. Caranya, daftar dulu ke Alexa dan download alexa toolbarnya. 
4. Tulis posting tentang "Alexa Rank". Ajak blogger dan pengunjung memasang Alexa Toolbar di browsernya. Alasan nomor 4 inilah yang membuat CB membuat posting ini :)

Dengan demikian, pertanyaan Haruskah Menampilkan Widget Alexa Rank di Blog, jawabannya... harus kayaknya ya...! Nggak yakin juga sih, karena situs-situs terkemuka di dunia kayaknya nggak pada pasang widget alexa rank tuh.... Wasalam. (http://contohblognih.blogspot.com/).*

Read more ...

Widget Media Sosial Keren untuk Blogspot

YANG CB maksud dengan Widget Media Sosial Keren untuk Blogspot adalah widget yang seperti CB pasang di bawah Related Posts. Kita juga bisa memasang widget Facebook, Twitter, Google Plus, dan RSS Feedburner ini di Sidebar blog.

CB dapatkan Widget Media Sosial Keren untuk Blogspot ini dari Atoz Buzz. Kodenya lalu di-parse di Blog Crowds dan disimpan di bawah kode Related Posts.

Cara Pasang di Sidebar:
1. Klik "Layout" > Klik "Add a Gadget".
2. Pilih "HTML/JavaScript"
3. Copy + Paste kode berikut ini di bagian "Content"

<style> .touchme a { display:block; height:50px; width:50px; padding:0 4px; float:left; background:transparent url(http://beautifulbloggerwidgets.googlecode.com/files/Sharing%20Touch%20Me.png) no-repeat; -webkit-transition: ease-in 0.2s all; -moz-transition: ease-in 0.2s all; -o-transition: ease-in 0.2s all; -ms-transition: ease-in 0.2s all; transition: ease-in 0.2s all; cursor:pointer; } .touchme a.googleplus { background-position: 0px -58px; } .touchme a.googleplus:hover { background-position: 0px 0px; } .touchme a.twitter { background-position: 0px -290px; } .touchme a.twitter:hover { background-position: 0px -232px; } .touchme a.facebook { background-position: 0px -406px; } .touchme a.facebook:hover { background-position: 0px -348px; } .touchme a.rss { background-position: 0px -174px; } .touchme a.rss:hover { background-position: 0px -116px; } </style> <p style="display:none;">Social Media Sharing by <a href="http://contohblognih.blogspot.com">CB Bloggerz</a></p> <div class='touchme'>
<!--RSS--> <a class='rss' href="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>
<!--Google Plus--> <a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='nofollow' target='_blank'></a>
<!--Facebook--> <a class='facebook' href="YOUR FACEBOOK LINK" rel='nofollow' target='_blank'></a>
<!-- Twitter --> <a class='twitter' href="YOUR TWITTER LINK" rel='nofollow' target='_blank' ></a> </div>

Jangan lupa, ganti/ubah tulisan berwarna merah!

Cara Pasang di Bawah Posting Blog:
1. Klik "Template" > "Edit HTML".
2. Cari (Ctrl+F) kode <data:post.body/>
3. Copy + Paste kode berikut ini di bawah <data:post.body/> tadi.

&lt;b:if cond=&#039;data:blog.pageType == &quot;item&quot;&#039;&gt;
&lt;style&gt; .touchme a { display:block; height:50px; width:50px; padding:0 4px; float:left; background:transparent url(http://beautifulbloggerwidgets.googlecode.com/files/Sharing%20Touch%20Me.png) no-repeat; -webkit-transition: ease-in 0.2s all; -moz-transition: ease-in 0.2s all; -o-transition: ease-in 0.2s all; -ms-transition: ease-in 0.2s all; transition: ease-in 0.2s all; cursor:pointer; } .touchme a.googleplus { background-position: 0px -58px; } .touchme a.googleplus:hover { background-position: 0px 0px; } .touchme a.twitter { background-position: 0px -290px; } .touchme a.twitter:hover { background-position: 0px -232px; } .touchme a.facebook { background-position: 0px -406px; } .touchme a.facebook:hover { background-position: 0px -348px; } .touchme a.rss { background-position: 0px -174px; } .touchme a.rss:hover { background-position: 0px -116px; } &lt;/style&gt; &lt;p style=&quot;display:none;&quot;&gt;Social Media Sharing by &lt;a href=&quot;http://contohblognih.blogspot.com&quot;&gt;CB Bloggerz&lt;/a&gt;&lt;/p&gt; &lt;div class=&#039;touchme&#039;&gt;
&lt;!--RSS--&gt; &lt;a class=&#039;rss&#039; href=&quot;YOUR RSS LINK&quot; rel=&#039;external nofollow&#039; target=&#039;_blank&#039;&gt;&lt;/a&gt;
&lt;!--Google Plus--&gt; &lt;a class=&#039;googleplus&#039; href=&quot;YOUR GOOGLE PROFILE LINK&quot; rel=&#039;nofollow&#039; target=&#039;_blank&#039;&gt;&lt;/a&gt;
&lt;!--Facebook--&gt; &lt;a class=&#039;facebook&#039; href=&quot;YOUR FACEBOOK LINK&quot; rel=&#039;nofollow&#039; target=&#039;_blank&#039;&gt;&lt;/a&gt;
&lt;!-- Twitter --&gt; &lt;a class=&#039;twitter&#039; href=&quot;YOUR TWITTER LINK&quot; rel=&#039;nofollow&#039; target=&#039;_blank&#039; &gt;&lt;/a&gt; &lt;/div&gt;
&lt;/b:if&gt;

Jangan lupa, ganti/ubah tulisan berwarna merah!

Alternatif: Vertical Style

Widget Media Sosial keren lainnya seperti berikut ini

• Follow us on Facebook
• Follow us on Google+
• Follow us on Twitter
• Subscribe via RSS

Ini kodenya. Silakan pasang/copas dengan lebih dulu mengubah link media sosialnya (warna merah) dengan "kepunyaan" Anda ^_^.

<style>
#abt{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;}
#abt a{text-decoration:none; font-family:trebuchet ms,sans-serif;}
#abt li{position:relative; height:38px; cursor:pointer; padding: 0 !important;}
#abt .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://lh6.googleusercontent.com/-O_eNfqyGbXY/Ua7QecE1aiI/AAAAAAAAA_M/CyeEAD56u1M/w35-h158-no/facebook+and+google%252B+.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;}
#abt li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;}
#abt .icon{overflow:hidden; color:#fafafa;}
#abt .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;}
#abt .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;}
#abt .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;}
#abt .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;}
#abt .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;}
#abt li:hover .icon,
.touch #abt li .icon{width:210px;}
.touch #abt li .facebook, #abt li:hover .facebook{background-color:rgba(59,89,152,1);}
.touch #abt li .twitter, #abt li:hover .twitter{background-color:rgba(64,153,255,1);}
.touch #abt li .googleplus, #abt li:hover .googleplus{background-color:rgba(228,69,36,1);}
.touch #abt li .pinterest, #abt li:hover .pinterest{background-color:rgba(174,45,39,1);}
.touch #abt li .rss, #abt li:hover .rss{background-color:rgba(255,102,0,1);}
</style><a href="http://contohblognih.blogspot.com" style="font-size:0pt">CB Blogger</a><ul id="abt">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="https://www.facebook.com/cbblogger" target="blank">Follow us on Facebook</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="https://plus.google.com/106869251529186655236/posts" target="blank">Follow us on Google+</a></li>
<li data-alt="Follow us on twitter"><a class="icon twitter" href="https://twitter.com/contohblog/" target="blank">Follow us on Twitter</a></li>
<li data-alt="Subscribe via RSS"><a class="icon rss" href="http://feeds.feedburner.com/contohblognih" target="blank">Subscribe via RSS</a></li>
</ul>

Cara pasangnya juga sama, namun karena bentuknya list vertikal, sebaiknya dipasang di Sidebar atau di About seperti punya CB.

Media Sosial  dan Blog itu saling mendukung. Trafik blog bisa meningkat karena kita share atau di-share pengunjung. Sebaliknya, follower dan "liker" akun media sosial juga bisa bertambah dengan cara memasang link sosial media kita di blog. Simbiosis mutualisme gitu kali ya... :)

CB harap Anda juga Follow dan Join akun Sosmed CB di bawah ini, biar kita saling Follow dan Like, sekaligus keep update masing-masing blog.

Sebelumnya CB sudah share soal Cara Share Otomatis Posting Blog ke Sosmed.

Good Luck and Happy Blogging!

Read more ...

Liverpool Kalah dari Chelsea, Persaingan Juara Makin Panas!

KALI ini CB posting bukan soal blogging, tapi sepakbola liga inggris alias EPL atau BPL, yaitu tentang Liverpool yang kalah dari Chelsea 0-2 alias Chelsea mengalahkan Liverpool 2-0 di Anfield, kandang Liverpool! (See > Video Liverpool 0-2 Chelsea Goals and Highlights 27/04/2014)

Dalam pertandingan yang baru saja usai, Minggu (27/4/2014) malam WIB, yang CB saksikan via TV Live Streaming Siaran Langsung Sepakbola VipBoxAsia itu, Liverpool  dipermalukan di kandang sendiri, dengan skor 0-2.

Kedua gol The Blues dicetak oleh Demba Ba menit akhir babak pertama dan Willian juga di menit akhir (injury time) babak kedua.

Liverpool 0-2 Chelsea Goal and Highlights 27/04/2014

Mengutip detikSport, hasil laga ini membuat persaingan menjadi juara English Premier League (EPL) makin panas. Liverpool memang masih di puncak klasemen dengan poin 80, namun dikuntit Chelsea di posisi kedua dengan nilai 78. Hanya selisih dua angka.

Kalo melihat klasemen, kemenangan Chelsea atas Liverpool ini juga membuka jalan bagi peringkat tiga klasemen, Manchester City, untuk jadi juara. Jika bisa memenangi seluruh pertandingan sisa yang dipunya, City akan punya poin sama dengan Liverpool. Namun The Citizenspunya selisih gol yang lebih baik dibanding Liverpool saat ini.

Kita lihat klasemen Liga Inggris yang CB kutip dari LiveScore.

1. Liverpool 80
2. Chelsea 78
3. Manchester City 77
4. Arsenal 70
5. Everton 69
6. Tottenham Hotspur 66
7. Manchester United 60
8. Southampton 52
9. Newcastle United 46
10. Stoke City 44
11. Crystal Palace 43
12. Swansea City 39
13. Hull City 37
14. West Ham United 37
15. West Bromwich Albion 36
16. Aston Villa 35
17. Sunderland 32
18. Norwich City 32
19. Fulham 31
20. Cardiff City 30

Read more ...

Hati-Hati dengan Komentar (Spam) yang Memuji Blog Anda!

JANGAN "ke-GR-an" ya kalo ada  komentar yang memuji blog Anda. Hati-hati, biasanya itu SPAM atau blogger yang "nyepam".

Spam adalah penggunaan perangkat elektronik untuk mengirimkan pesan secara bertubi-tubi tanpa dikehendaki oleh penerimanya. Orang yang melakukan spam disebut spammer. Tindakan spam dikenal dengan nama spamming. (Wikipedia)

Blogger pemula biasa "bangga" jika tiba-tiba banyak komentar masuk, memuji blognya, pake bahasa Inggris lagi! Wuihhh.... banyak komentar euy! :)  Ini contohnya:

I absolutely love your site.. Excellent colors & theme.
Did you build this website yourself? Please reply back as I’m wanting to create my own personal site and would love to know where you got this from or just what the theme is named.
Cheers!

Komentar di atas, aslinya, di mengandung banyak link, terutama di bagian akhir. Dia juga mengisi Name/URL dengan link yang panjaaaaaaang...! Yang pendek juga banyak.

Di blog ini "sebenarnya" banyak komentar SPAM, tapi CB mah baik... dipublish sajalah komentarnya kalo yang nyepam itu blogger Indonesia... "Demi membantu sesama" :)

Selain banyak menyertakan "link hidup" (live link), para "penyepam" (spammer) juga biasanya berkomentar terkesan "asal" dan "pendek". Misalnya, "nice share 'gan", "artikel yang bermanfaat", dsb., lalu dia cantumkan link.

Untuk MENGHAPUS LINK HIDUP atau "sekadar" menyembunyikan link spam di komentar blog kita, silakan simak "how to auto hide links in blogger comments".

Untuk mencegah masuknya komentar spam, selain dibantu Blogger, kita juga setting kolom komentarnya dengan cara:
1. Setting > Posts and Comments
3. Who can comments? Pilih "Anyone"
4. Comment Moderation Pilih "Always"

Baca deh:  Cara Setting Kotak Komentar - Tips Agar Blog Banyak Komentar

Jika linknya berupa "blog positif", tidak masalah, kita bisa publish. Tapi kalo linknya berupa "blog negatif" yang melanggar "norma bangsa Indonesia yang beradab", apalagi blog berbau judi dan pornografi, maka HAPUS SAJA!

Bagaimana kalo linknya berupa "blog bisnis/toko online"? Hmm.... publish juga deh! "Demi Membantu Sesama"......! Kan ada ungkapan: the more you give, the more you get in return! Semakin banyak Anda memberi (sedekah), maka semakin banyak pula Anda akan mendapatkan imbalannya. Setuju...???

Mari, ngeblog yang positif. Cari uangnya juga yang positif dan dengan cara yang FAIR aja deh....! Amin......! Setuju....??? Good Luck and Happy Blogging! (http://contohblognih.blogspot.com/).*

Read more ...

Cara Mengatasi Error 404 Page Not Found dari Google

POSTING cara mengatasi Error 404 Page Not Found ini dibuat setelah CB membuka Google Webmaster Tools untuk mengecek trafik. Ada pesan dari Google bahwa 5 link posting CB tidak bisa dibuka alias Error 404 - Page Not Found (Kesalahan 404 - Halaman Tidak Ditemukan).

Posting ini juga sekaligus "uji coba SEO Blog dan Posting" mengingat sudah banyak posting tentang Error 404 ini. Kita lihat nanti, apakah postingan CB bisa "mengalahkan" posting lain di indeks Google seperti yang sudah-sudah? :)

Ok, lanjut... bagaimana cara mengatasi Error 404 di Blog Blogspot? Sebentar, kita simak dulu deh pesan dari Google soal Error 404 kepada CB. Ini dia kutipannya:

Dear owner or webmaster of http://contohblognih.blogspot.com/
While crawling your site, we have noticed an increase in the number of transient soft 404 errors around 2014-04-16 23:00 UTC (London, Dublin, Edinburgh). Your site may have experienced outages. These issues may have been resolved. Here are some sample pages that resulted in soft 404 errors:

http://contohblognih.blogspot.com/2014/01/link-download-adobe-dreamweaver-free.html
http://contohblognih.blogspot.com/2013/10/cara-membuat-featured-imagepost-di.html
http://contohblognih.blogspot.com/2014/02/9-cara-menghasilkan-uang-dari-blog.html
http://contohblognih.blogspot.com/2013/10/cara-membuat-password-di-halaman-blog.html
http://contohblognih.blogspot.com/2013/10/cara-membuat-openid-blog-untuk-komentar.html

For more information, see our Help Center:
Soft 404 errors

Penyebab Error 404 Page Not Found

Menurut Google, laman 404 adalah yang akan dilihat pengguna saat mereka mencoba untuk menjangkau laman yang tidak ada di situs Anda (karena mereka mengeklik tautan rusak, laman telah dihapus, atau mereka salah mengetikkan URL).

Laman 404 disebut demikian karena menanggapi permintaan untuk laman yang hilang, server web mengirimkan kembali kode status HTTP 404 yang mengindikasikan bahwa sebuah laman tidak ditemukan. 

"Meskipun laman 404 standar berbeda-beda tergantung ISP Anda, laman ini tidak memberikan informasi yang bermanfaat bagi pengguna, dan sebagian besar pengguna hanya akan pergi dari situs Anda.".

Cara Mengatasi Error 404 Page Not Found Blogspot

Ini solusi mengatasi Error 404 dari Support Google, "Customizing your 404 page", yaitu dengan cara menambah widget bagi custom 404 page.

Tahapannya:

1. Template > Edit HTML

2. Temukan (CTRL+F) kode <body> dan Copy Paste kode berikut ini di bawahnya. Atau.....

3. Temukan (CTRL+F) kode </body> dan Copy Paste kode berikut ini di atasnya.

Intinya, COPY paste kode berikut dan PASTE di antara kode tag <body> dan </body>. Be sure to replace the URL http://www.example.com with the URL of your own site. Jangan lupa, ganti www.example.com dengan URL blog Anda!

<script type="text/javascript">

  var GOOG_FIXURL_LANG = 'in';

  var GOOG_FIXURL_SITE = 'http://www.example.com'

</script>

<script type="text/javascript"

  src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js">

</script>

Itu dia Cara Mengatasi Error 404 Page Not Found dari Google.

CARA LAIN

Cara lainnya yaitu dengan nge-redirect Error 404 ke HOME atau halaman depan dengan menggunakan Javascript ala Help Blogger.

1. Di Dashboard Blog, klik Settings > Search preferences > Custom Page Not Found.

2. Copy dan Paste kode berikut ini kedalam kotak yang tersedia:

Maaf, halaman yang Anda cari tidak ada di blog ini.
Anda akan segera diredirect ke halaman utama.
<script type = "text/javascript">
BSPNF_redirect = setTimeout(function() {
location.pathname= "/"
}, 5000);
</script>

Kalimat berwarna merah bisa Anda ganti dengan versi Anda. Demikian juga angka 5000 (5 detik), misalnya menjadi 4000 (4 detik) --waktu untuk redirect.

Jika ingin mengarahkan Error Page ke halaman lain, misalnya ke Halaman Daftar Isi, ubah saja pathname menjadi href dan tanda garis miring (/) dengan url halaman yang akan dituju. Misalnya menjadi begini:

Maaf banget.... Posting yang Anda cari tidak ada di blog ini.
Anda akan segera diredirect ke halaman utama.
<script type = "text/javascript">
BSPNF_redirect = setTimeout(function() {
location.href= "http://contohblognih.blogspot.com/p/daftar-isi.html/"
}, 3000);
</script>

Cara CB

Berikut ini kode Error Page Not Found yang digunakan di blog CB ini:
1. Template > Edit HTML
2. Copas kode berikut ini di atas kode  </head>

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<!--<title>404: Page Not Found ~ <data:blog.title/></title>-->
<!--Redirect jika 404 -->
<script type='text/javascript'>
BSPNF_redirect=setTimeout(function() {
location.href= &quot;http://contohblognih.blogspot.com/&quot;
}, 1);
</script>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
</b:if>

3. Save Template!

DEMO: 

Link posting ini adalah:
http://contohblognih.blogspot.com/2014/04/cara-mengatasi-error-404-page-not-found.html

Silakan ubah di address bar jadi, misalnya:
http://contohblognih.blogspot.com/2014/04/cara-mengatasi-error-404.html

Maka otomatis halaman akan redirect ke home (halaman depan)

Fungsi Kode  Error 404 - Page Not Found

Guna atau fungsi mengatasi  Error 404 - Page Not Found  ini, intinya sih agar blog kita tetap SEO dan User Friendly. Begitu kata Google. Good Luck and Happy Blogging!

Read more ...

Silakan Gunakan OpenID untuk Komentar di Blog Ini

MENGGUNAKAN OpenID dengan URL/Alamat blog untuk komentar di sebuah blog sangat bagus buat "menjaring" atau "mengundang" pengunjung baru. Kelebihan komentar di blog dengan OpenID berupa alamat blog antara lain hal itu akan menjadi "backlink" yang sangat bagus buat SEO Blog. Blogger lain "klik" link tersebut, dan akan langsung dibawa menuju blog kita, BUKAN ke Profil Blogger.

CB sendiri sangat senang jika ada yang komentar di blog ini dengan menggunakan OpenID. Makanya, silakan gunakan OpenID Anda untuk komentar di blog ini. Dengan begitu, CB dan blogger lain akan mudah dan langsung klik URL blog Anda, tidak "muter" dulu ke Blogger Profile.

Anda yang belum punya OpenID blog untuk komentar, silakan baca Cara Membuat OpenID Blog untuk Komentar. Silakan tes hasilnya di blog ini. Jika ada kesulitan, konsultasikan dengan ahlinya :)

Selain itu, jadilah blogger yang baik dengan setting kolom komentar seperti yang CB lakukan. Dengan setting kolom komentar seperti pada gambar di bawah ini, kita mempersilakan pengunjung untuk berkomentar menggunakan OpenID, URL/Name, atau bahkan Anonymous.

Cara Setting Kolom Komentar Blog yang Baik (versi CB)

1. Klik "Setting"
2. Klik "Posts and Comments"
3. Comment Location > Embedded
4. Who can comment? > Anyone
5. Comment Moderation> Always
6. Show word verification > No
7. Show backlink > Yes

Perhatikan No. 6. Pilihlah "NO" agar pengunjung tidak merasa dipersulit untuk berkomentar. Pasalnya, deretan angka yang muncul sebelum klik "publish" kadang sulit dibaca. Ini menyusahkan! Ini tidak membuat nyaman pengunjung yang akan komentar!

Kita pilih "Anyone" di "Who can comment" karena di nomor 5 kita klik "Always", sehingga komentar yang tidak patut, "nyepam" (Komentar Spam), bisa kita hapus.

Kembali ke topik posting ini, intinya... Silakan Buat OpenID dan Gunakanlah OpenID untuk Komentar di Blog Ini agar CB dan pengunjung bisa SEKALI KLIK saja menuju blog Anda.

Jika belum atau tidak berminat punya OpenID, maka pilihlah "Comment as URL/Name" dan masukkan alamat blog Anda di sana.

Good Luck for us and Happy Blogging !!!

Read more ...

Template Blog SEO dan Responsif New Max Mag

Kali ini CB bagikan template blog SEO Friendly dan responsif New Max Mag, hasil modifikasi template Max Mag.

Tidak terlalu banyak yang diedit, namun Anda bisa melihat beberapa perbedaan dari demonya. Yang jelas, New Max Mag lebih simple dan lebih mudah digunakan.

Kelebihan Template Blog SEO dan Responsif New Max Mag ini adalah dalam aspek Readability, Scannability, dan Usability sehingga sangat User Friendly.

Pembaca akan lebih nyaman dan "betah" membaca posting blog kita, jika kita gunakan template blog SEO Friendly, Responsive, dan User Friendly karya Templateism ini.

Template aslinya ada dua versi, yaitu versi "with slider" dan versi "without slider". CB pilih Max Mag yang tanpa slider biar lebih ringan alias Fats Loading. Lagi pula, edit slidernya lumayan menyulitkan bagi blogger pemula karena harus masuk Edit HTML dan ganti satu per satu posting yang akan ditampilkan di sana.

Semua elemen SEO sudah ada dan ditambahkan di template blog SEO respinsif New Max Mag ini, termasuk fasilitas social share dan related posts.

CB juga mengedit ukuran huruf di Heading Tag yang di template aslinya, Max Mag, tampak "terlalu besar", apalagi di bagian "Post a Comment".

DEMO - DOWNLOAD

Installation Guide for Max Mag Blogger Template

Ada beberapa bagian yang harus Anda edit dalam tempate blog SEO friendly yang fast loading dan responsif ini. Template blog ini memang bukan untuk blogger pemula.

1. Edit Headline - ganti dengan link dan judul posting pilihan Anda.
2. Edit Author Box - ganti dengan versi Anda. Demikian pula gambar avatarnya.
3. Edit Menu - ganti dengan navigasi menu versi Anda.
4. Edit Social Media Link - ganti atau isi dengan link sosmed Anda.
5. Edit Middle Widget Post - ganti dengan label versi Anda. Di blog demo labelnya "News" dan "Views".
6. Edit Footer! Important. Jangan hapus credit link di footer. Blog Anda akan error, minimal "dimusuhi Google" :)
7. Edit Kode Google Adsense di Header. Cari kode Google Adsense di Edit HTML, ganti dengan versi Anda atau bisa juga dihapus.

Sekian. Good luck and Happy Blogging! (http://contohblognih.blogspot.com).*

Read more ...

Cara Membuat Navigasi Blog SEO Friendly

BLOG Anda sudah memiliki navigasi? Jika sudah, pertahankan dan jika perlu percantik biar "catchy". Jika belum ada, segera buat atau lengkapi karena navigasi blog (blog navigation) sangat penting bagi user dan mesin pencari.

Navigasi (navigation) adalah istilah dunia pelayaran dan penerbangan. Menurut Kamus Besar Bahasa Indonesia (KBBI), navigasi artinya (1) ilmu tentang cara menjalankan kapal laut atau kapal terbang; (2) tindakan menempatkan haluan kapal atau arah terbang; 3 pelayaran.

Dalam dunia blogging atau desain website, navigasi itu petunjuk atau panduan bagi user (pembaca/pengunjung) untuk mengeksplorasi konten blog dan menemukan informasi yang mereka cari.

Karenanya, navigasi merupakan salah satu aspek terpenting dalam desain blog. Navigasi blog itu seperti rambu lalu-lintas, papan penunjuk jalan, peta, atau direktori barang di sebuah mal.

Tujuan Navigasi Blog

Misi terpenting desain navigasi blog/website adalah memandu pembaca dan memudahkan mereka menemukan posting, tulisan, data, atau informasi yang mereka cari/butuhkan. Jadi, navigasi dalam istilah SEO merupakan aspek usability, kegunaan bagi pembaca.

Menurut Ecreative Internet Marketing, navigasi blog yang baik adalah bagian penting dalam search engine optimization (SEO) guna memastikan bahwa mesin pencari mengindeks setiap halaman dan merangking blog Anda.

Pastikan setiap link (tautan) navigasi berisi kata kunci yang sesuai guna memastikan relevansi dan meningkatkan pank rank. "Menu Anda adalah 'peta jalan utama' ke blog Anda, baik bagi mesin pencari maupun bagi pelanggan potensial (pembaca)".

Navigasi blog akan membuat pembaca tidak melewati posting baru atau spesial, juga gambaran seluruh konten blog.

Navigasi Universal: Menu Wajib dalam Blog

Navigasi universal yaitu navigasi blog yang wajib ada. Dengan navigasi universal, yakni navigasi menu yang umumnya terpasang di bawah nama blog, judul blog, atau logo blog, pembaca akan mendapatkan gambaran tentang seluruh konten blog.

Navigasi universal ini bisa berisi halaman statis (static page) --HOME, ABOUT, DAFTAR ISI (SITEMAP), KONTAK (CONTACT)-- dan label/kategori. Bisa ditambah link dan menu menarik lainnya. Jadi, pastikan blog And memiliki navigasi menu:

• Home --> navigasi untuk menuju halaman utama blog (main page) atau halaman depan (front page).
• About --> navigasi blog berisi "identitas blog".
• Daftar Isi. Sitemap. Baca: Cara membuat daftar isi blog.
• Kontak --> email, akun sosial media, dll. Optional karena bisa disatukan di halaman About.
• Label/Kategori --> daftar isi posting blog berdasarkan label/kategori
• Search Box (Kotak Pencarian). Bisa disejajarkan dengan menu navigasi, bisa juga di Sidebar. (Baca: Cara Membuat Kotak Pencarian di Blog).
• Page Navigation --> Navigasi Halaman. Biasanya di bagian bawah blog sebelum bagian Footer.

Navigasi Onpage - Single Post Page

Pastikan di "halaman tunggal", yakni halaman posting/tulisan yang kita kenal dengan Singe Post, ada menu navigasi menuju posting lainnya.

Navigasi yang wajib ada di single posts ini antara lain Link Internal (Internal Link) berupa:

1. Related Posts --Posting terkait, tulisan terkait, di bawah setiap posting/artikel. Ini navigasi terpenting karena berisi daftar tulisan dengan topik terkait yang sedang/sudah dibaca user. (Baca: Cara Membuat Related Posts)
2. Recent Posts. Postong terbaru. Ini penting banget agar user tahu posting terkini yang diupdate. (Baca: Cara membuat Recent Posts).
3. Popular Post --Posting terpopuler atau terbanyak dibaca, di Sidebar. Widgetnya sudah disediakan blogger di Layout -> Add Gadget.
4. Random Posts --> posting yang muncul secara acak, di Sidebar. (Baca: Cara Membuat Random Posts).
5. Blog Archive --> Arsip blog, di Sidebar. Ini opsional jika sudah ada menu Daftar Isi di halaman statis. Widgetnya sudah disediakan blogger di Layout -> Add Gadget.
6. Labels/Categories --> Daftar label atau kategori posting, di Sidebar. Widgetnya sudah disediakan blogger di Layout -> Add Gadget.
7. Breadcrumbs. Navigasi blog di atas judul posting berisi home - label - judul posting. (Baca: Cara Membuat Breadcrumbs).
8. Subscribe Form --> Formulis berlanganan posting via email agar pembaca bisa mengikuti update blog via inbox email mereka. (Baca: Cara membuat subsribe form). Namun, sebelumnya pastikan blog Anda sudah terdaftar di Google Feed Burner.

Internal Link juga bisa berupa link dalam text ke posting terkait sebagaimana lazim digunakan di situs Wekipedia.

Jelas, paparan di atas menunjukkan pada kita agar jangan mengabaikan navigasi blog, agar blog kita SEO Friendly dan User Friendly! 

Bingung? Gunakan saja Template Blog SEO Friendly. Sebagian besar navigasi blog sudah didesain di sana.

Good luck and Happy Blogging! (http://contohblognih.blogspot.com/).*

Read more ...

Simple SEO Responsive - Template Blog SEO Responsif Terbaru

TEMPLATE Blog Simple SEO Fast Responsive ini merupakan modifikasi Template Blog SEO Responsif Johny Ajaib. Modifikasi dilakukan "terutama" karena demo asli template blog seo responsif ini sudah tidak ada.

Dinamakan Template Blog Simple SEO Fast Responsive karena memang tampilan template blog ini SIMPLE, sederhana; SEO = Search Engine Optimization (SEO) Friendy, dan FAST = Fast Loading, tampilannya enteng, ringan, cepat!

Benar! Template Blog Simple SEO Fast Responsive ini mirip banget dengan template blog SEO responsif lainnya --New Johny Wuss. Bedanya terutama di bagian Featured Post halaman depan yang "otomatis", yaitu menampilkan posting terbaru.

Skor SEO Simple SEO Responsive Blogger Template menurut CHKM.ME 100% !!! WOW banget 'kan..? :)



CARA SETTING:
Cara setting Template Blog Simple SEO Fast Responsive ini adalah sebagai berikut:
1. Untuk kustomisasi recent post paling atas (Featured Post), silahkan masuk ke Setting > Posts and Comments >> Show at Mosts, pilih angka/jumlah 1 (jika Anda ingin tampilan seperti pada demo).

2. Anda bisa merubah jumlah post itu sesuai keinginan. Tapi mesti diingat, Anda harus sesuaikan juga dengan jumlah tampilan post widget daftar isi yang ada di bawahnya agar tidak terjadi double post pada halaman muka. Caranya, perhatikan kode ini pada Template > Edit HTML

var showPostDate = true, showComments = true,
idMode = true,
sortByLabel = false,
labelSorter = "",
loadingText = "Loading...",
totalPostLabel = "Total Post :",
jumpPageLabel = "Page",
commentsLabel = "Comments",
rmoreText = "Read more &#9658;",
prevText = "Prev",
nextText = "Next",
siteUrl = "http://namabloganda.blogspot.com/",
postsperpage = 9,
numchars = 160,
imgBlank = "http://2.bp.blogspot.com/-uitX7ROPtTU/Tyv-G4NA_uI/AAAAAAAAFBY/NcWLPVnYEnU/s1600/no+image.jpg";

3. Ganti

• namabloganda dengan nama blog Anda :)
• angka 9 dengan jumlah posting yang Anda inginkan di halaman depan
• URL imgBlank dengan URL Image versi Anda (opsional)

4. Kode HTML Kotak Pencarian
Jika Anda ingin menggunakan kotak pencarian di Sidebar seperti di blog demo ini, gunakan kode HTML berikut ini di Layout > Add Gadget:

<form action="/search" style="display:inline;" method="get">
<input id="s" name="q" type="search" placeholder="Search here..."/>
</form>
<style>
#s {
    margin: 0 auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 12px 48px 12px 12px;
    -webkit-border-radius: 290px;
    -moz-border-radius: 290px;
    border-radius: 290px;
 width: 290px;
    height: 17px;
    color: #3a4449;
    border: none;
    outline: none;
    -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
 position: relative;
    z-index: 2;
    background: #fff url(http://2.bp.blogspot.com/-RdCoLqn34t4/UDeUFSTJ17I/AAAAAAAAKqg/GxdClZ5RjXg/s1600/Search.png) center right no-repeat;
}
#s::-webkit-input-placeholder, #s:-moz-placeholder {
    color: #607078;
}
</style>
<br/><br/>

Template Blog Simple SEO Fast Responsive FREE alias Gratis!
Mohon JANGAN HAPUS credit link Mastemplate & CB Blogger!
Good Luck.......!!!

Simple SEO Responsive - Template Blog SEO Responsif Terbaru. Mau...?

DEMO
DOWNLOAD 

Read more ...

Top 5 Template Blog SEO Responsif

KALI ini CB akan berbagi Lima Template Blog SEO Friendly, Fast Loading, dan Responsif. Menurut CB beberapa template di bawah ini merupakan Top 5 Best Responsive Blogger Templates 2014 yang layak dipertimbangkan bagi para "pemburu" template blog yang adaptif dengan segala layar --Desktop Monitor, iPhone, iPad, HP Android, atau mobile devices.

Banyak sekali pilihan Template Blog Responsif, mulai yang simple-minimalis hingga "rumit" (News and Magazine Style). CB koleksi beberapa template yang kemungkinan CB gunakan untuk blog baru di masa mendatang.

Pertimbangan pemilihan Template Blog SEO Fast Responsif berikut ini "sederhana": CB suka. Jadi, ini soal selera dan "subjektif" banget tentunya. Anda boleh setuju, boleh juga tidak setuju. Bebas lah.. yang penting jangan Golput! :)

Ini dia Template Blog Responsif yang SEO Friendly dan Fast Loading pilihan CB. Kalau tanya yang terbaik, tentu New Johny Wuss dong :) yang dipakai oleh CB.

Anda yang "bingung" apakah harus mengganti template blog menjadi responsif atau tidak, jangan cemassss..... blogger sudah menyediakan "default template for mobile devices" kok.

MaxMag Responsive Magazine Blogger Template

DEMO - DEMO HASIL MODIF - DOWNLOAD

Easy News Responsive Magazine Blogger Template

DEMO - DOWNLOAD

Thesis SEO Responsive Blogger Template

DEMO - DOWNLOAD

MyExtraNews Responsive Blogger Template

DEMO - DOWNLOAD

FlatMag Responsive Blogger Template

DEMO - DOWNLOAD

Masih kurang? Cukup lima saja karena Pancasila juga 5 sila 'kan? All of these Top 5 Template Blog SEO Responsif  is free to download and use. Good Luck and Happy Blogging! (http://contohblognih.blogspot.com).

JANGAN LEWATKAN!

Simple SEO Responsive - Template Blog SEO Responsif (NEW!)

Read more ...

Mengurangi Bounce Rate Blog dengan Mengubah Ukuran Huruf

UBAH ukuran huruf (font-size) blog Anda menjadi lebih besar guna mengurangi Bounce Rate (Rasio Pentalan) yang mempengaruhi PageView dan PageRank blog. Itulah saran Daily Blog Tips  dalam Reduce Your Bounce Rate In One Second.

Atas saran itu pula, CONTOHBLOG mengubah ukuran huruf di single post/post body menjadi 14px, lebih besar dari sebelumnya, sekaligus mengubah jenis hurufnya, dari Tahoma, Arial, lalu kini Droid Sans.

Kenapa 14px dan Arial? Simple saja, CB "ngikutin" Wikipedia yang juga ganti ukuran dan jenis hurufnya menjadi Arial 14px. Situs-situs berita "terkemuka" di dunia juga kebanyakan menggunakan Arial 14px. Lihat saja misalnya CNN dan BBC.

Apakah huruf bisa menjadi penyebab Bounce Rate blog? Jawabannya, menurut Daily Blog Tips, adalah YA. "There are many case studies around the web where people used A/B testing to find how they could reduce the bounce rate, and increasing the font size works on most situations," tulisnya.

"Pertimbangkan juga usia pengunjung yang makin tua sehingga makin banyak orang yang butuh huruf berukuran besar dan nyaman dipandang --tidak membuat mata lelah," imbuhnya.

Bisa jadi, gara-gara ukuran huruf di blog kita terlalu kecil, pengunjung buru-buru menutup blog kita dan mengklik tombol back di Google. Mereka mencari blog lain yang ukuran hurufnya lebih besar dan enak dibaca (dipindai/scan).

Hanya membuka sekilas blog, lalu cepat-cepat menutupnya dan kembali ke indeks hasil pencarian Google, itulah yang disebut Bounce Rate. (Selengkapnya baca Penjelasan Google tentang Bounce Rate).

Kata Google, banyak faktor penyebab "rasio pentalan" ini, salah satunya masalah desain (site design) atau kegunaan (usability issues).

Ada sejumlah faktor yang berkontribusi pada rasio pentalan Anda. Misalnya, pengunjung mungkin keluar dari situs Anda dari laman masuk jika ada masalah pada desain situs atau masalah kegunaan. Atau, pengunjung mungkin juga keluar dari situs setelah melihat satu laman jika mereka menemukan informasi yang mereka butuhkan ada di laman tersebut dan merasa tidak perlu atau tidak berminat untuk mengunjungi laman yang lain.

Clear...? Mari, kita lakukan langkah kecil yang bisa berdampak besar ini. Sepele, cuma ngubah ukuran huruf doang, tapi bisa "bernilai SEO"!

Kita bisa juga "bercermin" pada situs-situs berita seperti Republika Online, Inilah.com, Tempo.co, atau Kompas.com yang menggunkan jenis huruf besar, yaitu Arial 14px, di single-post-nya. Situs berita terkemuka, detik.com, menggunakan huruf Arial 13px.

Jangan lupa, pilih juga jenis huruf yang "Web Safe" atau huruf yang baik untuk blog/website, seperti, Arial, Helvetica, dan Tahoma, atau gunakan Google Font. Good Luck and Happy Blogging! Wasalam.

Read more ...

Apa Paket Internet Terbaik Saat Ini?

APA paket internet terbaik saat ini? Kartu apa atau provider internet apa yang terbaik? Menurut pengalaman, paket internet terbaik ya... dari Speedy Telkom. Kebetulan selama ini lancar jaya, gak pernah ada masalah, dan kecepatannya relatif stabil.

Tabel Daftar Harga Paket Internet Speedy Terbaru

Masalahnya... paket internet speedy di atas 'kan buat di rumah atau di kantor, gak bisa mobile! Lalu, Apa Paket Internet Terbaik Saat Ini untu bisa mobile, bisa akses internet kapan dan di mana saja, pake modem ataupun pake Android?

Ternyata .... kita harus setuju bahwa saat ini di Indonesia TIDAK ADA provider internet terbak, yang bagus. Pasalnya, kriteria Paket Internet Terbaik itu adalah yang bisa digunakan di mana saja (di kampung atau di kota, di sawah atau di laut, di mall atau di warung kopi), kapan saja, dengan mutu koneksi yang cepat dan stabil!

Jadi, bukan Simpati bukan Indosat, bukan XL bukan Smarfren, bukan Tri bukan Telkomsel, karena semuanya RELATIF. Simpati bisa bagus di desa, tapi sering juga jelek di area tertentu. XL bagus di kota, di kampung bisa saja bagus (?). Begitu seterusnya.

So, mana nih kartu terbaik buat paket tnternet terbaik? Jawabannya, ya itu tadi... relatif! Rupanya stabilitas dan kecepatan provider internet kita belum merata, sebagaimana belum meratanya kesejahteraan rakyat Indonesia :) Wasalam.

Read more ...

Mengubah Nama Penulis dengan Judul Blog untuk SEO

By default, setiap posting blog menampilkan nama blogger atau nama penulis/pengarang (post author/author name) di bawah judul posting (tulisan), seperti "Posted by Nama Blogger" atau "Diposkan oleh Nama Blogger". Bagaimana jika kita ingin mengubah nama penulis itu dengan nama/judul blog (blog title)? Apakah ini bagus untuk SEO Blog?

Mengubah Nama Penulis Blog dengan Nama Blog sangat mudah. Namun, apakah bagus untuk SEO blog atau tidak, CB belum menemukan jawaban pasti.

Hanya mengira-ngira saja, bahwa itu bagus buat SEO blog. Karena, dengan begitu, kita memasukkan nama blog dalam tiap posting. Sedangkan posting blog yang baik itu relevan dengan meta tags, kata kunci, dan memenuhi prinsip "kepadatan kata kunci" (keyword density).

Yang pasti, kita bisa mengubah nama penulis blog (post author) dengan nama judul blog (blog title) atau teks lainnya dengan sangat mudah, sekaligus memasang link profil Google Plus di sana, sebagaimana dilakukan CB Blogger. Coba deh klik link "Posted by CB Blogger" di atas, nge-link ke Google Plus CB Blogger 'kan?

Cara Mengubah Nama Penulis dengan Nama/Judul Blog

1. Template > Edit HTM:L
2. Cari (CTRL+F) kode <data:post.author/>
3. Ganti SEMUA kode itu dengan <data:blog.title/>. Bisa juga diganti/diubah dengan teks biasa: Nama Blog Anda.

Jika mau menyisipkan link profil Google Plus Anda di sana, gunakan kode seperti ini:
<a href="Link Google Plus Anda" rel="author">Nama Profil Google+ Anda</a>
atau

<a href="Link Google Plus Anda?rel="author">Nama Profil Google+ Anda</a>

Contoh kode punya CB Blogger:

Posted by <a href="https://plus.google.com/106869251529186655236?rel=author">Contoh Blog</a>

Kita bebas menggunakan link apa saja di sana, bisa di-link-kan ke akun Facebook atau Twtter juga bisa. 

Good luck! Wasalam.

Read more ...

Cara Menghapus Virus Malware/Adware Canadaalltax Com

AKTIVITAS blogging, browsing, dan surfing kita kadang terganggu dengan munculnya malware atau virus seperti canadaalltax com dan sejenisnya. Ketika kita klik sebuah link di email atau di blog/website, ia redirect ke canadaalltax com atau situs lainnya yang bukan laman yang ada di link.

Virus malware lain yang sering mengganggu adalah MySearchResults dan ValueDealShopper. Yang terakhir ini penampakkannya berupa garis bawah dua berwarna hijau dalam kata-kata sebuah blog/web.

Virus-visur malware atau adware semacam itu biasanya disebabkan karena kita kurang hati-hati dalam menginstall sebuah program atau software, terutama software hasil download di situs gratis. Maka, hati-hati pula dalam download. Jangan asal download, pastikan situs itu aman, misalnya dengan memilih situs ekstensi dot dom dan lihat dulu profilnya (about us).

Cara Menghapus Malware

Ada beberapa cara menghapus virus malware seperti Canadaa dan ValueDealShipper itu di komputer kita, salah satunya dengan AdwCleaner. Thanks to Malware Tips for this great tips.

1. Download AdwCleaner di link ini: ADWCLEANER DOWNLOAD LINK (This link will automatically download AdwCleaner on your computer).
2. Sebelum install program AdwCleaner, tutup semua program dan browser internet yang sedang dibuka.
3. Doble klik ikon AdwCleaner hasil download tadi (proses intall).
4. Setelah install selesai, program AdwCleaner akan terbuka.
5. Klik tombol Scan
6. Selai scanning, klik tomblol Clean. Bunuh semuanya!

Cara Lain
Cara lainnya, khususnya menghapus link CanadaAllTax.com adalah dengan Uninstall Plugin tertentu di browser. Malware juga sering menyerang komputer kita dari arah Google/Firefox Extensions.

Maka, cek setting extensions/plugin dan temukan plugin yang "mencurigakan", lalu DISABLE/REMOVE, seperti: Keep Me, safewEB, dan YoutubeAdblocker.

Kedua cara Menghapus Malware Canadaalltax Com dan MySearchResults sudah CB lakukan dan sukses. Semoga Anda juga. Good luck and happy blogging!

Read more ...

Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori

Membuat daftar isi blog (peta situs, sitemap, table of content) berdasarkan label atau kategori posting sangat baik untuk mesin pencari juga user.

Menu daftar isi blog akan memudahkan pembaca mengakses bagian-bagian atau konten blog secara cepat dan mencari tulisana, artikel, atau posting yang mereka butuhkan.

Demo: Contoh Daftar Isi

Menu navigasi daftar isi ini juga dianjurkan Google guna memudahkan user menjelajahi blog kita. Google memang "selalu berpihak" pada user. Apa yang disukai user, disukai pula oleh Google. Hidup user!!!! :)

Fungsi Daftar Isi Blog

Menurut Social Media Tutorial, daftar isi juga bagus untuk optimisasi mesin pencari (Good for SEO) karena menyajikan kata kunci yang benar yang sudah digunakan (provided correct keywords have been used).

Fungsi lainnya, terjemahin sendiri ya :)

• Delivers a good overview of the information that awaits the reader
• Avoids duplicate posts in diverse labels and remove the bewilderment of search engine bots.
• Supports for creating internal links of blog posts, which boost up page rank
• It can be used as “Related posts” link, on any blog-post.
• Last, but not the least, to show a certain requirement of the blog posts to explore under Specific label.

Cara Membuat Daftar Isi Blog

1. Klik menu Page di Dashboard Blog

2. Klik New Page > klik tombol menu HTML

3. Copy dan Paste salah satu kode HTML daftar isi di bawah ini. Jangan lupa ganti dulu contohblognih dengan nama blog Anda.

4. Klik Publish! 

Setidaknya ada dua macam daftar isi blog, yaitu Berdasarkan Label/Kategori dan Berdasarkan Tanggal Publikasi. Kode-kode HTML daftar isi di bawah ini di-copas dari googlecode.com . Masih banyak kode daftar isi di sana yang di-share oleh para "author" yang baik hati dan tidak sombong :)

1. Kode HTML untuk Daftar Isi Berdasarkan Kategori/Label

<script src="http://me-sitemap.googlecode.com/files/mysitemap.js" type="text/javascript">
</script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Alternatif: untuk tampilan daftar isi "lebih cantik" bisa gunakan kode di bawah ini:

<style type="text/css">
#toc{
width:99%;
margin:5px auto;
border:1px solid #2D96DF;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
}
.labl{
color:#FF5F00;
font-weight:bold;
margin:0 -5px;
padding:1px 0 2px 11px;
background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%);
background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
border:1px solid #2D96DF;
border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;
}
.labl a{
color:#fff;
}
.labl:first-letter{t
ext-transform:uppercase;
}
.new{
color:#FF5F00;
font-weight:bold;
font-style:italic;
}
.postname{
font-weight:normal;
background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);
background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));
}
.postname li{
border-bottom: #ddd 1px dotted;
margin-right:5px
}

</style>

<div id="toc">
<script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>

2. Kode HTML untuk Daftar Isi Berdasarkan Tanggal Publikasi

<script src=" http://mastergomaster.googlecode.com/files/daftar%20isi%20blog.js "></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

3. Kode HTML untuk Daftar Isi Berdasarkan Tanggal Publikasi Plus Kotak

<div style="background-color: none; border: 1px solid #000000; height: 400px; margin: auto; overflow: auto; padding: 3px; text-align: left; width: 100%;">
<script src=" http://mastergomaster.googlecode.com/files/daftar%20isi%20blog.js "></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script></div>

Ada juga format daftar isi blog yang "interaktif" dan (mungkin) lebih menarik, seperti yang di-share oleh My Blogger Lab dan HiFiFan. Moggo... dipilih....! Good Luck!

Read more ...

Cara Memasang Tombol Like (Suka) Mirip Facebook di Bawah Komentar Blog

BLOGGER yang baik akan membalas setiap komentar yang masuk di blognya, apalagi jika berupa pertanyaan. Namun, bagi blogger yang "sibuk" sehingga tak sempat membalas atau merespons komentar yang masuk, alternatifnya adalah memasang tombol Like (Suka)  berupa ikon jempol (thumb-up) mirip "Facebook Like" di Bawah Komentar Pengunjung di Blogspot.

Jadi, jika sang blogger "tidak sempat" membalas/merespons komentar yang masuk, daripada kesannya "cuek", minimal bisa "ngasih jempol", sebagaimana bisa dan biasa kita lakukan di Facebook.

Cara Memasang atau Menambahkan Tombol Like (Suka) di Bawah Komentar Pengunjung di Blogspot ini, tutorial dan kode-kodenya CB dapatkan di blog Duypham. Silakan dicoba.

TAHAPAN MEMASANG TOMBOL SUKA UNTUK KOMENTAR DI BLOGSPOT
Seperti biasa, login ke blogger. Di dashboard, klik menu Template > Edit HTML, dan lakukan dengan teliti tahapan berikut ini:

1. Tambahkan kode berikut ini sebelum kode/tag ]]></b:skin>.

.like-cm{margin-top:15px;width:10px;height:10px;background:url(http://lh6.ggpht.com/-smRIL9DaITs/UM9cIp-I8bI/AAAAAAAABeM/wAw1Z1sgj78/s10/like.png)  no-repeat}

2. Replace (ganti) kode (function() { dengan kode di bawah ini:

items_copy var = [];
 (Function () { 

3. Replace (ganti) kode var items = <data:post.commentJso/>; dengan kode di bawah ini:

var items = <data:post.commentJso/>;
 items_copy = items; 

4. Tambahkan kode berikut ini di bawah kode <data:post.commentHtml/>

<script type='text/javascript'>
 likeurl var = '<data:blog.url/>';
 / / <! [CDATA [
for(i=0;i<items_copy.length;i++){a=document.getElementById('c'+items_copy[i].id);gl="'"+items_copy[i].id+"'";b=a.innerHTML+'<div  class = "like-cm" onmousemove = "likecom ('+ gl +')"> class='story_text'> id="like-cm'+items_copy[i].id+'"> </ div> </ div> ', a. likecom innerHTML = b} function (i) {var a = document.getElementById ('like-cm' + i) if (a) {a.innerHTML = '<iframe style = "margin: 0 0-13px-6px" frameborder = "0" allowtransparency = "true" scrolling = "no" height = "20" src = "http://www.blogger.com/blog-post-reactions.g?options = [Like] & textcolor =% 23,666,666 # '+ likeurl + i +' "width =" 100 "> <\ / iframe> '}}
 / /]]>
 </ Script> 

5. SAVE! and... Good Luck!

Read more ...