15/03/12

Post Snippet Blogger

Begitu banyaknya langkah atau cara untuk memotong posting pada blogger sering kali membuat kita sedikit binggung untuk memilih cara mana yang cocok untuk kita terapkan dalam template blogger kesayangan kita. Diantaranya yaitu dengan menggunakan metode script auto read more dan bahkan ada yang menggunakan kode <!--more--> dalam mode posting html setiap ingin memotong posting artikel pada blogger. Seiring dengan berjalannya waktu, mungkin cara-cara tersebut sedikit kurang asyik jika kita terapkan pada template blogger, karena tentunya cara-cara tersebut selain memiliki kelebihan tersendiri, pasti juga memiliki beberapa kelamahan.

Belum lama ini blogger menambahkan fitur baru pada layanan blogspot mereka yaitu fitur snippet pada posting artikel, sehingga kita tidak perlu lagi menggunakan metode script auto read more atau metode <!--more--> untuk memotong posting artikel kita. Namun fitur tersebut tidak bisa secara otomatis kita nikmati, melainkan kita harus sedikit melakukan oprek pada template kita.

Post Snippet Blogger

Langsung saja jika Anda ingin mencobanya silahkan ikuti langkah-langkah berikut ini:
  1. Masuk akun blogger Anda. Pilih tab menu Rancangan -> Edit HTML.
  2. Beri centang pada 'Expand Widget Templates'.
  3. Masukan kode css berikut sebelum kode ]]></b:skin>
    .thumb img{float:left; margin:0 10px 10px 0}
  4. Setelah itu cari kode <data:post.body/>
    Mungkin Anda akan menemukan 2 kode yang sama, untuk itu pilih urutan yang pertama saja.
  5. Ganti kode tersebut dengan kode dibawah ini.
    <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/>
    <b:if cond='data:post.hasJumpLink'>
    <data:post.body/>
    <b:else/>
    <b:if cond='data:post.snippet'>
    <b:if cond='data:post.thumbnailUrl'>
    <div class='Image thumb'>
    <img expr:src='data:post.thumbnailUrl'/>
    </div>
    </b:if>
    <data:post.snippet/>
    <div class='jump-link'>
    <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
    <div class='post-comment-link'>
            <b:if cond='data:blog.pageType != &quot;item&quot;'>
              <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
                <b:if cond='data:post.allowComments'>
                  <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if 
    cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> 
    <data:top.commentLabelPlural/></b:if></a>
                </b:if>
              </b:if>
            </b:if>
          </div> 
    </div>
    <b:else/>
    <data:post.body/>
    </b:if>
    </b:if>
    </b:if>
    </b:if>
    

    Kode post snippet blogger tersebut sudah IdBlogDesign modifikasi sehingga dapat sekalian menampilkan jumlah komentar dalam post snippet dan tidak mengalami error pada saat menampilkan halaman statis atau static page.
  6. Sebelum Anda menyimpan template Anda, silahkan preview terlebih dahulu hasil modifikasi template blogger Anda.
Jangan lupa sebelum melakukan cara tersebut diatas, alangkah baiknya jika Anda melakukan backup template Anda terlebih dahulu. Dan sekedar untuk informasi, langkah-langkah tersebut sudah dilakukan uji coba pada sebagian template blogger buatan IdBlogDesign dengan menggunakan template yang diluncurkan tahun 2006 bawaan blogger. Selamat mencoba dan semoga bermanfaat.
7 Komentar:
  1. thanks sudah sharing, sangat mudah dicerna

    BalasHapus
    Balasan
  2. oia gan... untuk nambah summary nya gmn ya..

    BalasHapus
  3. Mantap...
    ini yang saya cari-cari.
    maklum masih pemula..

    Thanks ya...

    BalasHapus
  4. pas di ilangin snippet nya, post footernya juga ilang gan.

    rate dan review kok gak keluar gan dalam pencarian google?

    BalasHapus
    Balasan
    • Yub bener banget gan, soalnya post footernya saya masukkan ke kode snippet. :)

      untuk rate dan reviewnya bisa diuji coba dengan rich snippet dari google web master gan jika nampak berarti berhasil jika belum berarti ada yang kurang. Namun untuk penampakan dihasil pencarian nyata google, belum dipastikan berjalan normal karena dari pihak googlenya sendiri juga bilang begitu gan. :)

      Hapus
  5. rate dan review kok gak keluar gan dalam pencarian google?

    setelah di check ternyata muncul.. thanks masta.. nubie perlu bimbingannya

    BalasHapus

Mohon maaf sebelumnya, untuk komentar yang menyertakan LiveLink tidak kami publikasikan.