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 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>)

2. Untuk halaman dalam/halaman posting saja:

<b:if cond='data:blog.pageType == "item"'>
</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>


KODE WARNA BIRU HTML:

Biru Facebook: #3b5998
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


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>

GOOGLE AUTHORSHIP:

<link rel="author" href="Google Plus URL"/>
<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>

Kode Alternatif:

<script type='text/javascript'>
var this_url = window.location.href;
var new_url = this_url.replace(&quot;namaBlogLama&quot;,&quot;namaBlogBARU&quot;);
window.location = new_url;
</script>


SUBMIT SITEMAP ke Webmaster Tools:

1. atom.xml?redirect=false&start-index=1&max-results=500
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 -->


Kode SHARE FACEBOOK
Agar muncul Deskripsi Post/Alinea Pertama Saat di-Share ke Facebook

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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>


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&amp;alt=json-in-script&amp;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 != &quot;item&quot;'>
 <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
            <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;
}


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);
}

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
Show comments
Hide comments

36 comments on Koleksi Kode Rahasia

  1. 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

    ReplyDelete
    Replies
    1. Ini kodenya warnanya: #c00. Cari kode berikut ini dan samakan!
      #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;}

      Delete
    2. Sip. (y) Trimakasih banyak master.

      Delete
    3. Siang CB, maaf nih ga ada puasnya brtanya. smoga CB juga ga bosen mnjawab. hehe..
      Untuk mmbuat halaman sperti TIPS SEO BLOG punya CB gimana ya.? Trmksh

      Delete
    4. This comment has been removed by the author.

      Delete
    5. Itu bukan halaman, tapi LINK. Ini kodenya:
      http://contohblognih.blogspot.com/search/label/Tips%20SEO%20Blog
      Buat di linknya di template > edit html > menu

      Delete
    6. o iya.. hahaha baru sadar saya. makasih mas bro.

      Delete
  2. mas..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?

    ReplyDelete
  3. Kalau warna 'home' yang selalu merah itu bagaimana ya?

    Oh ya, saya cari #menu a.home tapi ngga ada, hehe...

    ReplyDelete
    Replies
    1. Ini kodenya warnanya: #c00. Cari kode berikut ini dan samakan!
      #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

      Delete
    2. Terimakasih, jugaran.
      Sukses penerapannya... hehe...

      Delete
  4. Kalau untuk warna background terpopuler pekan ini gimana ?
    mksudnya punya juragan warna abu abu.
    saya pingin warna ini #FF9933

    ReplyDelete
  5. Yang SUBMIT SITEMAP ke Webmaster Tools: cara taronya gmana CB?

    ReplyDelete
  6. Saya 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.

    ReplyDelete
  7. cara memperlebar header gimana mas?

    ReplyDelete
  8. cara menagtur widget di dalam gimana mas? Ketika dibuka salah satu artikel, widget yang dimaksud langsung keluar

    ReplyDelete
  9. wah mantep gan blog gw jadi berubah lbih cpat
    makasih kang

    ReplyDelete
  10. Thanks Gan Semoga blognya semakin Maju.maju...dan maju....

    ReplyDelete
    Replies
    1. YW :) Amin amin dan amin..............!

      Delete
  11. kang gimana ya caranya membuat from login di blogger please?

    ReplyDelete
    Replies
    1. http://www.maskolis.com/2011/02/membuat-sliding-loginregister-form.html

      Delete
  12. min, kode submit sitemap ke webmaster tu, pada point ke 2.
    sitemap.xml atau sitemap.xlm

    Terima kasih postingannya, sangat bermanfaat

    ReplyDelete
  13. Mas maksutnya submit sitemap ke webmaster itu gimana ya :/

    ReplyDelete
    Replies
    1. mendaftarkan konten blog ke Google biar cepat terindeks
      Ini tipsnya: http://www.contohblog.net/2015/02/cara-submit-sitemap-blog-custom-domain.html

      Delete
  14. Cara memasangnya gimana mas? ._.saya masih bingung cara memasang "Efek Zoom pada Gambar Blog:"

    ReplyDelete
    Replies
    1. simpan di tempat kode css lainnya, di bawah kode ] ] >< / b : skin >

      Delete
  15. CB Blogger memang tempat yang tepat buat belajar blogging, dari pas baru tau blog sampe skrng udh bsa ngasilin saya belajar disini.

    ReplyDelete
  16. maaf min kalau cara buat sendiri temanya gmn ya min

    ReplyDelete
  17. Gan saya mau ngehack FB pacar saya tapi gak kode html websitenya mohon bantuannya gan. Kode?

    ReplyDelete

Contact Form

Name

Email *

Message *