Pages

Jumat, 11 Februari 2011

Cara Membuat Read More dengan Tombol

blogger read more
Teknik Seo Blogger - Mempersiapkan tombol yang dirancang untuk read more
Kenapa anda harus  siap dalam mempersiapkan Read more dengan tombol? Hal pertama adalah tentu tombol dirancang berdasarkan ciptaan Anda sendiri. Berikut ini adalah contoh dari desain tombol read more
read more
Meng-upload tombol read more
Hal kedua yang harus Anda lakukan adalah meng-upload membaca tombol lebih ke dalam gambar hosting Anda.
Membuat kode HTML untuk tombol read more
Menciptakan kode HTML untuk tombol read more. Sebagai contoh, silahkan lihat di bawah kode:
<img alt='more' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxI8C8or0hue-ypvhP8Vzqka3ABGDNddnxg6hQErl5tK1e1HuAYMDJ2jE9JAEeiVzbE7yIbucySrNOeJzS-aryCq0UEYcn6r9ERhl-k1c2nja7fcxruMKiVXXYPeDxqqh_xC0vI0c5bG1R/s1600/read-more.png' title='read more'/>
Mengedit kode HTML template blogger
Mengedit template blogger yang Anda gunakan. Ikuti langkah-langkah di bawah ini:
1. Silahkan login ke blogger anda. 
2. Klik Design. 
design in blogger
    3. Click Edit HTML.
    blogger edit html

    4. Harap template backup terlebih dahulu dengan mengklik Download Template Lengkap.
     download full template 

    5. Centang kotak kecil di samping Expand Template Widget.
    6. Cari kode ]]></ b: skin>
    7. Copy dan kemudian paste kode berikut tepat di atas kode
    ]]></ b: skin>
    .jump-link a img{
      border:0;
      float:right;
      margin:10px 0;
    }
    8. Cari Kode dibawah:
    <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
    9. Hapus <data:post.jumpText/> kode dan kemudian ganti dengan kode HTML dari tombol read more. Contoh
    <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img alt='more' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxI8C8or0hue-ypvhP8Vzqka3ABGDNddnxg6hQErl5tK1e1HuAYMDJ2jE9JAEeiVzbE7yIbucySrNOeJzS-aryCq0UEYcn6r9ERhl-k1c2nja7fcxruMKiVXXYPeDxqqh_xC0vI0c5bG1R/s1600/read-more.png' title='read more'/></a>
    10. Simpan template
    11. Selesai

    Note:
    Tutorial tentang Membuat read more dengan tombol ini dirancang untuk blog versi standar template. Jika Anda sebelumnya telah membuat setiap variasi untuk fungsi membaca lebih lanjut, tutorial ini bisa menjadi agak sulit untuk diterapkan.

    Tidak ada komentar:

    Posting Komentar