cara membuat artikel postingan di halaman utama blogger


Membuat tampilan artikel postingan di Halaman Utama Blog tampil Minimalis atau hanya terlihat Judul artikel saja seperti yang terlihat di blog ecaknyo ini... 

 ..Hal ini tampaknya menjadi trend juga pada beberapa tampilan blog... adminnya berusaha membuat tampilan blognya sesimple mungkin tapi berkualitas.. salah satunya modifikasi cuplikan artikel postingan diblog...

...Ada ragam cara untuk membuat tampilan cuplikan postingan artikel di blog Minimalis... tapi disini saya akan membahas trik yang saya gunakan untuk meminimalis tampilan postingan artikel sehingga tampak judulnya saja beserta atribut jumlah komentar, tgl posting, label, dsb....

Oke.. langsung saja simak caranya...mudah saja... langkah-langkahnya sbb :
  
1.  Login ke blogger > Rancangan > Edit HTML > Edit Template ( Centang Expand Template Widget ) ...tekan CTRL+F lalu cari " <data:post.title/> " ... jika sudah ketemu lalu tambahkan kode dibawah ini...
<div style='border: 0px solid rgb(250, 252, 252); margin: 10px 0px; padding: 10px; -moz-border-radius: 0px 0px 0px 0px; width: auto; height: auto; background-color: rgb(250, 252, 252); '>

dan..

</div>
Lakukan Persis seperti contoh dibawah ini... Perhatikan ya cara penempatannya...
<div style='border: 0px solid rgb(250, 252, 252); margin: 10px 0px; padding: 10px; -moz-border-radius: 0px 0px 0px 0px; width: auto; height: auto; background-color: rgb(250, 252, 252); '>
      <h3 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>
</div>

    </b:if>
Ket :
background-color: rgb(250, 252, 252); = Warna Background-nya bisa kamu ubah sesuai keinginan .. >> cek warna disini   

..Jika sudah benar... Simpanlah template-nya..

TRik ini akan membuat Judul artikel postingan seperti gambar dibawah ini...

Post a Comment

Masukkan Komentar Anda disini !