Koleksi Kode Rahasia Sukses Blog versi CB Blogger
Kode-kode HTML/CSS yang biasa CB gunakan untuk modifikasi template blog atau membuat template blog jadi SEO Friendly dan Fast Loading.
Kode Script Anda Di Sini
Kotak Kode HTML
Klik dulu Mode HTML lalu Copas Kode berikut ini:
<div style="border: 1px solid #444; padding: 10px; background-color: #f9f9f9; text-align:left;">
Kode Script di Sini
</div>
Kode Script di Sini
</div>
Kode GARIS
<hr style="border-top: dotted 2px;" />
MENGATUR POSISI SIDEBAR WIDGET
Widget Position:
1. Widget Hanya untuk homepage / halaman depan saja
<b:if cond='data:blog.url == data:blog.homepageUrl'>
(setelah <b:includable id='main'>)
</b:if> sebelum kode penutup widget
(sebelum kode </b:includable>)
(setelah <b:includable id='main'>)
</b:if> sebelum kode penutup widget
(sebelum kode </b:includable>)
2. Untuk halaman dalam/halaman posting saja:
<b:if cond='data:blog.pageType == "item"'>
</b:if> sebelum kode penutup widget
</b:if> sebelum kode penutup widget
Menyembunyikan link hidup, gambar pensil/edit, Atribusi Blogger, dan Navbar:
.comment-content a {display: none;}
.quickedit{display:none;}
#Attribution1 {display: none;}
#navbar { height: 0px; visibility: hidden; display: none;}
Simpan di atas kode </b:skin>
.quickedit{display:none;}
#Attribution1 {display: none;}
#navbar { height: 0px; visibility: hidden; display: none;}
Simpan di atas kode </b:skin>
KODE WARNA BIRU HTML:
Biru Facebook: #3b5998
Biru Twitter: #55acee
Biru Persib: #03C
Biru Detikcom: #284296
Biru oxford: #09223e
Biru Twitter: #55acee
Biru Persib: #03C
Biru Detikcom: #284296
Biru oxford: #09223e
KODE MENYEMBUNYIKAN TANGGAL POSTING:
<style>
.date-header {display:none;}
</style>
Simpan di bagian akhir tulisan/posting
.date-header {display:none;}
</style>
Simpan di bagian akhir tulisan/posting
Kode Membuat OpenID Blog:
<link href='https://openid.stackexchange.com/openid/provider' rel='openid2.provider'/>
<link href='https://openid.stackexchange.com/user/a413bc62-f457-4377-830a-8a159428fc89' rel='openid2.local_id'/>
Simpan di bawah kode <head>
<link href='https://openid.stackexchange.com/user/a413bc62-f457-4377-830a-8a159428fc89' rel='openid2.local_id'/>
Simpan di bawah kode <head>
GOOGLE AUTHORSHIP:
<link rel="author" href="Google Plus URL"/>
<link rel="publisher" href="Google Page URL"/>
Simpan di bawah kode <head>
<link rel="publisher" href="Google Page URL"/>
Simpan di bawah kode <head>
Blog REDIRECT CODE. Redirect URL Nama Blog lama ke Blog baru:
Simpan di bawah <head> :
<script type='text/javascript'>
var d='<data:blog.url/>';
d=d.replace(/.*\/\/[^\/]*/, '');
location.href = 'http://blogtimenow.com';
</script>
var d='<data:blog.url/>';
d=d.replace(/.*\/\/[^\/]*/, '');
location.href = 'http://blogtimenow.com';
</script>
Kode Alternatif:
<script type='text/javascript'>
var this_url = window.location.href;
var new_url = this_url.replace("namaBlogLama","namaBlogBARU");
window.location = new_url;
</script>
var this_url = window.location.href;
var new_url = this_url.replace("namaBlogLama","namaBlogBARU");
window.location = new_url;
</script>
SUBMIT SITEMAP ke Webmaster Tools:
1. atom.xml?redirect=false&start-index=1&max-results=500
2. sitemap.xlm
2. sitemap.xlm
KODE SOCIAL SHARE di Bawah Postingan
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-
5156a09e76c1568f"></script>
<!-- AddThis Button END -->
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-
5156a09e76c1568f"></script>
<!-- AddThis Button END -->
Kode SHARE FACEBOOK
Agar muncul Deskripsi Post/Alinea Pertama Saat di-Share ke Facebook
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.snippet'>
<meta expr:content='data:post.snippet' name='description'/>
</b:if>
</b:if>
Biasanya berhasil disimpan di atas kode <p><data:post.body/></p> yang ketiga
Jangan lupa semua kode <data:post.body/> ditambah <p> ... </p> sehingga menjadi:
<p><data:post.body/></p>
<b:if cond='data:post.snippet'>
<meta expr:content='data:post.snippet' name='description'/>
</b:if>
</b:if>
Biasanya berhasil disimpan di atas kode <p><data:post.body/></p> yang ketiga
Jangan lupa semua kode <data:post.body/> ditambah <p> ... </p> sehingga menjadi:
<p><data:post.body/></p>
Error Google Richsnippet - Structur Dara Blog
1. Ganti hfeed dengan h-feed
2. Ganti hentry dengan h-entry
3. Gunakan kode:
<div class='post-footer-line post-footer-line-1'>
<span class='author vcard'>
<span class='fn'>Contoh Blog</span>
</span>
<span class='post-timestamp'>
</span>
<span class='author vcard'>
<span class='fn'>Contoh Blog</span>
</span>
<span class='post-timestamp'>
</span>
Kode Membuat DAFTAR ISI BLOG (Sitemap)
<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&alt=json-in-script&callback=loadtoc">
</script>
</script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>
Kode Box Shadow - Bayangan Warna di Main Content Area Blog:
box-shadow: 0 10px 10px #999;-moz-box-shadow: 0;-webkit-box-shadow: 0 10px 10px #999;
Kode Heading Tag H1 untuk Header Logo Image/Gambar:
Simpan di bawah kode:
<!--Show the image only-->
<div id='header-inner'>
Kodenya:
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
</b:if>
</b:if>
Sebelum kode:
<a expr:href='data:blog.homepageUrl' style='display: block'>
<!--Show the image only-->
<div id='header-inner'>
Kodenya:
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
</b:if>
</b:if>
Sebelum kode:
<a expr:href='data:blog.homepageUrl' style='display: block'>
Kode Agar Gambar Nge-Pas dengan Lebar Kolom Postingan Blog:
Simpan (Copas) di atas ]]></b:skin>
.post-body img {
width:100%;
height:100%;
display: block;
}
.post-body img {
width:100%;
height:100%;
display: block;
}
Efek Zoom pada Gambar Blog:
.post img:hover {
-o-transition: all 0.9s;
-moz-transition: all 0.9s;
-webkit-transition: all 0.9s;
-moz-transform: scale(1.7);
-o-transform: scale(1.7);
-webkit-transform: scale(1.7);
}
-o-transition: all 0.9s;
-moz-transition: all 0.9s;
-webkit-transition: all 0.9s;
-moz-transform: scale(1.7);
-o-transform: scale(1.7);
-webkit-transform: scale(1.7);
}
KODE RAHASIA LAINNYA:
Nanti Di-Update :)
Cara Baru Sangat Cepat Terindeks Google
1. Daftarkan ke http://www.google.com/addurl
2. Lakukan ping: ping.sg atau pingomatic
3. Gunakan http://www.google.com/webmasters
Mantep mas. saya tertarik menggunakan template yg sama dgn CB. Tapi roll over pada menunya warna biru, untuk mengubah warnanya menjadi merah seperti CB ini gimana ya.? trmksh
ReplyDeleteIni kodenya warnanya: #c00. Cari kode berikut ini dan samakan!
Delete#menu li:hover > a,#menu li a:hover{background:#c00}
#menu a.home {background: #c00;}
#menu ul.menus a:hover{background:#c00;}
.page-menu li a:hover{color:#c00;}
Sip. (y) Trimakasih banyak master.
DeleteSiang CB, maaf nih ga ada puasnya brtanya. smoga CB juga ga bosen mnjawab. hehe..
DeleteUntuk mmbuat halaman sperti TIPS SEO BLOG punya CB gimana ya.? Trmksh
This comment has been removed by the author.
DeleteItu bukan halaman, tapi LINK. Ini kodenya:
Deletehttp://contohblognih.blogspot.com/search/label/Tips%20SEO%20Blog
Buat di linknya di template > edit html > menu
o iya.. hahaha baru sadar saya. makasih mas bro.
Deletemas..tema ini ketika saya terapkan, ada sedikit yang ane bingung mas. ketika saya posisikan posisi terataras, widget bagian kanan tidak bisa terlihat. namun jika sudah saya tarik ke bawah baru terbuka otomatis..gimana caranya agar bisa terlihat langsung mas?
ReplyDeleteKalau warna 'home' yang selalu merah itu bagaimana ya?
ReplyDeleteOh ya, saya cari #menu a.home tapi ngga ada, hehe...
Ini kodenya warnanya: #c00. Cari kode berikut ini dan samakan!
Delete#menu li:hover > a,#menu li a:hover{background:#c00}
#menu a.home {background: #c00;}
#menu ul.menus a:hover{background:#c00;}
.page-menu li a:hover{color:#c00;}
Kalo gak ada menu a home, bikin aja! Copas kodenya
Terimakasih, jugaran.
DeleteSukses penerapannya... hehe...
Kalau untuk warna background terpopuler pekan ini gimana ?
ReplyDeletemksudnya punya juragan warna abu abu.
saya pingin warna ini #FF9933
Yang SUBMIT SITEMAP ke Webmaster Tools: cara taronya gmana CB?
ReplyDeleteKlik ADD A SITEMAP
Deletemaksudya gimana mas?
DeleteSaya coba untuk belajar blog dari sejak dulu, susah membuat blog yang bisa seo frendly. tapi sejak baca di contohblognih.blogspot.com saya merasa ngeblog itu mudah. sekarang saya mau ganti konten isi aja yang bagus. membuang isi postingan hasil copas. makasih CB.
ReplyDeleteYW and Good Luck.............
Deletecara memperlebar header gimana mas?
ReplyDeleteubah width-nya di header-wrapper
Deletecara menagtur widget di dalam gimana mas? Ketika dibuka salah satu artikel, widget yang dimaksud langsung keluar
ReplyDeletewah mantep gan blog gw jadi berubah lbih cpat
ReplyDeletemakasih kang
Thanks Gan Semoga blognya semakin Maju.maju...dan maju....
ReplyDeleteYW :) Amin amin dan amin..............!
Deletekang gimana ya caranya membuat from login di blogger please?
ReplyDeletehttp://www.maskolis.com/2011/02/membuat-sliding-loginregister-form.html
Deletemin, kode submit sitemap ke webmaster tu, pada point ke 2.
ReplyDeletesitemap.xml atau sitemap.xlm
Terima kasih postingannya, sangat bermanfaat
euh iya... yang benar sitemap.xml
DeletePerbaiki dong CB :D
DeleteMas maksutnya submit sitemap ke webmaster itu gimana ya :/
ReplyDeletemendaftarkan konten blog ke Google biar cepat terindeks
DeleteIni tipsnya: http://www.contohblog.net/2015/02/cara-submit-sitemap-blog-custom-domain.html
Cara memasangnya gimana mas? ._.saya masih bingung cara memasang "Efek Zoom pada Gambar Blog:"
ReplyDeletesimpan di tempat kode css lainnya, di bawah kode ] ] >< / b : skin >
DeleteCB Blogger memang tempat yang tepat buat belajar blogging, dari pas baru tau blog sampe skrng udh bsa ngasilin saya belajar disini.
ReplyDeletemaaf min kalau cara buat sendiri temanya gmn ya min
ReplyDeleteGan saya mau ngehack FB pacar saya tapi gak kode html websitenya mohon bantuannya gan. Kode?
ReplyDeleteArtikel ni modus wkwkwk
Delete