Jumat, 27 September 2013

Cara Membuat Read More Otomatis Artikel Di Homepage




Selamat sore sobat blogger, pada sore hari ini saya akan menulis artikel tentang Cara Membuat Read More Otomatis Artikel Di Homepage.
Mungkin sudah banyak artikel yang membahas artikel serupa, tapi tidak ada salahnya juga saya menulis artikel ini untuk sobat blogger agar kita bisa belajar bersama dan menjadi lebih baik ke depannya :).

Oke sobat, simak yaa...


Dalam posting artikel berikut ini menunjukkan bagaimana Cara Membuat Read More Otomatis Artikel Di Homepage.  Ada beberapa cara untuk membuat Read More otomatis (Auto Read More). Biasanya Fitur Auto Read More ini ditambahkan di bawah postingan artikel blog Di Homepage/Beranda
Berikut langkah-langkah Cara Membuat Read More Otomatis Artikel Di Homepage (Beranda).
Perhatian: bagi yang sudah memasang auto read more yang ada sebelumnya harus dihapus terlebih dahulu.

1. Login Ke Blogger.
2. Klik Template, Backup template untuk jaga2 bila diperlukan, 
    atau langkah berikut bisa di uji coba menggunakan Blog percobaan yang lain.
3. Klik Edit HTML.
4. Klik Kiri 1 x Dimana saja dalam kotak template.
5. Klik Ctrl+F (Supaya mempercepat pencarian kode), 
    Dan cari kode berikut  ]]></b:skin>
    Masukan kode tersebut dalam kotak pencarian, kemudian enter untuk mencari.
6. Masukan Kode berikut diatas ]]></b:skin>

/* Gambar autoread more
----------------------------------------------- */
.post-thumbnail { width:100px;  height:70px;  float:left;  margin:0px 10px 0px 0px; }

7. Kemudian Cari Kode <data:post.body/>
    Kode tersebut diatas jumlahnya biasanya ada 2 atau 3 , Cari yang versi web, 
    biasanya yang kedua (ke-2), kalo tidak berhasil mungkin yang ke-3.

8. Hapus Kode <data:post.body/> yang kedua/ketiga (salahsatu) dan Ganti dengan kode dibawah ini.
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.thumbnailUrl'>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' expr:src='data:post.thumbnailUrl'/></a>
    <b:else/>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkHly4-pl4eMgTk8FHkaH8r9qfEQi4JtOscPNyoLzeNcIbw5ybJEhm69iB-4SD0KxonRLdE6uIpUGE_qexZf7yBp8kWSFva3dRD3u4LZ_uNpTGvQKdgon0WpCqG1bGEDSSDUBbW7p8WMg/s1600/no+image.jpg'/></a>
    </b:if>
    <div class='post-snippet'><data:post.snippet/></div>
            <a class='button' expr:href='data:post.url'>Baca Selengkapnya »</a>
    </b:if>
</b:if>
<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:if>
</b:if>

warna hijau adalah gambar pengganti jika dalam artikel tidak ada gambar dan bisa diganti dengan url gambar sesuai keinginan. "Baca Selengkapnya" juga bisa diganti

9. Untuk Merubah Ketinggian deskripsi artikel text, Cari Kode 
.post-body { atau .post {
    Masukan atau Ganti { line-height: 1.8; ...
    bisa juga ditulis line-height: 23px; atau disesuaikan ketinggiannya.
10.Save Template, dan lihat hasilnya

Demikian tips Cara Membuat Read More Otomatis Artikel Di Homepage,
semoga bermanfaat dan selamat mencoba :)
yang masih bingung silahkan tanya - tanya di komentar...
Comments
0 Comments

Tidak ada komentar:

Posting Komentar