Tuesday, September 21, 2010

Membuat Beberapa Artikel Tampil Minimalis Di Homepage Hanya tampak Judul Dan Atributnya


Di homepage artikel tidak akan tampil seperti biasanya namun minimalis hanya terlihat judul artikel saja seperti pada gambar yang terlihat di bawah ini. 



Namun masih tetap menyertakan atribut jumlah komentar, tanggal posting, label, readmore dan share.

Berikut ini langkah-langkahnya :
 
1.  Login ke blogger > Rancangan > Edit HTML > Edit Template ( Centang Expand Template Widget ). 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.
<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); = Ubah sesuai keinginan. Gunakan Color Picker 

Jika sudah benar. Simpan template.


Cara ini akan membuat beberapa artikel terakhir akan tampil di homepage seperti gambar dibawah ini.



2. Beralih ke Rancangan > Elemen Halaman > Edit pada posting blog, lalu aturlah seperti gambar di bawah ini atau aturlah sesuai keinginan.



3. Saya pakai editor entri baru dari blogger ( Cek editor kamu di Pengaturan > Dasar > Setting Global > Editor Entri > Pilih option Editor yang diperbarui) lalu pada awal postingan (tambahkan) klik Insert Jump Break, baru setelahnya isilah dengan materi artikel kita.

Selesai.



Selamat Mencoba.


85 comments:

  1. mantabs nih bang ...
    ijin disimpan tuk dipelajari.

    ReplyDelete
  2. @Warna Tulisan:

    silahkan dipelajari.. ini trik minimalis tampilan postingan artikel yg simple.. :)

    ReplyDelete
  3. nice post gan,

    kpan2 gw coba dah

    ReplyDelete
  4. Oooo... gitu...keren mas!hehe Salam blogger... :D

    ReplyDelete
  5. Ooia mas... gambar avatar yang ada d komentar saya ilang mas... kira2 yang kehapus kode yg mana ya mas? kalo tau kasi tau ya mas...hehe Makasih sebelumnya...

    ReplyDelete
  6. Wah klo ini kebetulan aku udah nyoba Sob... soalnya blogku yg lain cuma judul doank di Home hhe...... males pake2 read more hhe...


    Jiah.. kata2 terakhirnya.. tapi aneh ya? haha......

    ReplyDelete
  7. @irwan:

    silahkan kapan2 dicoba.. di save aj dulu gan.. :)

    ReplyDelete
  8. @Herlan:

    ..caranya mudah.. hasilnya yaaa lumayanlah bwt minimalis postingan artikel di hal.utama blog.. sm kayk trik lainnya.. :D

    ReplyDelete
  9. @Ferdinand:

    Siip.. baguslah kalo udah bisa... tapi masih byk ragam cara loh.. triknya pun berbeda-beda.. ngak tw sama kagak dg trik yg kupakai di tutor ini.. :)

    ReplyDelete
  10. Iy mas... keren yang minimalis template mah...hehe makasih banget mas komentar yang panjaaaaaaang banget!hehe... :)) tapi brmanfaat... d coba dlu deh mas... :D

    ReplyDelete
  11. @Herlan:

    semakin modern semakin minimalis ya.. liat aj rumah2 skrg..aplagi baju2 cewe model skrg.. minimalis smua...kekekekek.. naah template blog ikut2an jg.. :D ...hahahaha...

    ReplyDelete
  12. tips bgus gan.. Lagi2 sya dibwt bingung oleg template sya.. Kodex gag da yg spt itu.. Bntu gan.. Bingung kalo mslh html

    ReplyDelete
  13. @rudycyber:

    ..dicentang expand template widget-nya ya..

    ..coba cari "post:title" aj sob.. pake CTRL+F (ketik : post:title) sj biar lebih mudah.. :)

    ReplyDelete
  14. Pagi Sob.. aku datang hhe.. maaf nie telat... waktu aku bikin judul di home,,, masalah pertama yg muncul labelnya tetep kaya biasa... SOb.. baru tuh aku rubah lagi biar si label jadi judul doank... jadi kayanya klo diposting, lengkap tuh tutorialnya sob hhe.... cuma saran hhe....

    Semangat N happy blogging Sob...

    ReplyDelete
  15. Mas, ada award buat mas... kalo mau di ambil ya mas...hehe

    ReplyDelete
  16. hai braaada, gue punya blog baru nih..dah Q pasang Addthis, tapi setelah Q coba Share lewat facebook kok g muncul gambarnyanya,? hanya ada tulisan "TANPA JUDUL"
    kenapa?
    bisa bantu gak?
    silahkan cek di blog q yang baru http://www.downloadlagugratis.co.cc


    Q tunggu bantuannya loh..

    ReplyDelete
  17. keren keren keren...
    mbah ini y,slalu saja buat postingan tu yg lg bnyak dicari...
    like it....

    ReplyDelete
  18. @Ferdinand:

    gkppa telat.. yg penting kamu berkunjung & komen di blogku ini gan.. :)

    ReplyDelete
  19. @Herlan:

    wow.. mau dwong.. gw ambil ya awardnya.. thx bgt sob.. :)

    ReplyDelete
  20. @Ganden:

    itu mungkin ada masalah url blog di addthis-nya..kurang http:// atau memang dari addthis / facebook yg lagi bermasalah.. cuma saran sob.. kalo mw sharing posting artikel blog ke fesbuk bisa lewat NETWORKED BLOG yg sdh disediakan oleh fesbuk.. otomatis kalo kita posting di blog maka akan tampil pula di fesbuk..gw pake itu & selama ini tdk ada masalah.. ini lINK-nya >> http://networkedblogs.com/blog/

    ReplyDelete
  21. @sibutiz:

    hehe.. thx gan.. ntar gw berkunjung balik yaa.. :)

    ReplyDelete
  22. iya ya, jadi kelihatan judulnya saja, artikelnya masih tersembunyi, jadi menarik.
    terima kasih info dan tipsnya. bermanfaat.
    Bali Villas Bali Villa Villas in Bali

    ReplyDelete
  23. Terima kasih infonya, memang bener, yang tampil cuma judulnya saja, jadi lebih cantik ya. juga buat penasaran juga akan isinya.
    makasih tipsnya.
    Bali Villas Bali Villa Villas in Bali

    ReplyDelete
  24. @Ikutan Ngeblog:

    kamu punya 2 blog ya..itu terlihat dari komennya yg sama :D

    ReplyDelete
  25. @Kang Musa:

    maksih... oke..ke TKP skrg sob :)

    ReplyDelete
  26. kok ga bisa ya??
    malah ada tulisan apa gitu, intinya ga bisa di save+ga bisa ke langkah ke-2....

    ReplyDelete
  27. Mantaap gan !!
    tuker link yuk ?
    di tunggu kedatanganya yah !!

    ReplyDelete
  28. ane mau link exchange , kebetulan sidebar rada kosong, tapi diaprove gak kalau saya pasang :)

    ReplyDelete
  29. kalau dikasih contohnya sekalian gimana?
    saya tungguu kelanjutanya...

    ReplyDelete
  30. bagus nih....mantap....
    nanti semplenya kaya apa|?

    ReplyDelete
  31. makasih boz infonya, udah dicoba tpi,karna template saya yang dulu berat, sekarang ganti template bru ehehe

    ReplyDelete
  32. halo bung lama gak jumpa
    tambah pinter aja

    ReplyDelete
  33. @weBi:

    heumm..itu berarti ada penempatan kode yang salah atau bisa juga ada kode html yg kurang..

    ReplyDelete
  34. @imam77:

    makasih gan..oke..xchange link.. sung k TKP ;)

    ReplyDelete
  35. @andrihdt:

    Xchange LInk ..boleh gan.. gw pasang skrg Link blogmu.. :)

    ReplyDelete
  36. @Data kami:

    kan contohnya sdh ada gan... secara Real time lagi...itu di Hal Utama blog ecaknyo ini.. :)

    ReplyDelete
  37. @Ganden:

    contohnya sdh ada tuh... secara Real time lagi...itu di Hal Utama blog ecaknyo ini.. :)

    ReplyDelete
  38. @gianogt:

    tes emo smiley ya.. tp js smileynya sdh aq remove gan.. :)

    ReplyDelete
  39. @hasbi:

    eeiitss... template baru ya..liaaat aaaah :D

    ReplyDelete
  40. @Yohan Wibisono:

    tentu gan.. gw akan berkunjung ke blogmu.. :)

    ReplyDelete
  41. keren nih blog, simple tapi padat berisi. :))

    ReplyDelete
  42. bang, gimana caranya supaya artikel di frontpage tampil normal (bukan cuma judulnya) tapi archive per kategori bisa tampil cuma judulnya aja? btw, tuker link sama ecaknyo gimana ya?

    ReplyDelete
  43. Nice article. Tapi kalau saya sendiri sih minimal lebih suka menampilkan gambar preview pada artikelnya biar yg berkunjung bisa dapat gambaran soal artikel yg akan mereka buka :D

    ReplyDelete
  44. nice post sobat....

    salam knl aja ya....

    sukses slalu sobat

    ReplyDelete
  45. Really appreciate you sharing this article post.Thanks Again. Really Cool.

    ReplyDelete
  46. salam kenal, kunjunganblik ditunggu di sini http://ramlannarie.wordpress.com/ dan http://ramlannarie.blogspot.com/

    ReplyDelete
  47. bagus juga mas tutorialnya apalagi buat gw yg nebwie :D , link balik ya mas , link blog mas ada di blog aku ... thanks

    ReplyDelete
  48. @Resensi Film:

    ow..itu tinggal diatur di Pengaturan> Format > di Tampilkan sebanyak mungkin isi dg 1 Posting.... nanti otomatis di halaman blog akan tampil 1 hal penuh postingnya...

    kalo mau nampilin arsip perkategori hanya judulnya saja itu sdh byk yg bahas di blogger.. tapi sobat mesti nambahin widget ini secara manual..alias utak-atik script HTML..ntar kalo sy ad byk waktu luang mudah2an bisa sy bahas (bantu).. :)

    ReplyDelete
  49. @Republican Wasp:

    ..betul gan.. emg tampilan blog tergantung empunya maunya gimana.. lebih unik makin asik.. :)

    ReplyDelete
  50. @Tutorial Edit Blog:

    Slm knal jg sobat.. smoga sukses jg.. :)

    ReplyDelete
  51. thanks bos
    http://endriagus.blogspot.com/

    ReplyDelete
  52. postingnya bagus, salam kenal n' met berkunjung balek.

    ReplyDelete
  53. @DEALER PULSA MURAH:

    sama2 gan... gw Follow balik ya.. thx ;)

    ReplyDelete
  54. @kangmahfudz:

    waduh kang.. pake domain co.cc ya... soalnya domain itu kena blok di t4ku krj.. jd blm bisa kunjung balik.. tapi nanti gw akan kunjungi balik..

    ReplyDelete
  55. @Andi Wong: udah saya coba di blogger saya.. tapi kok jadi nya pendek banget yya :D

    ReplyDelete
  56. @nisa sanjaya:

    betul gan.. mmng utk nampilin jdul posting doang.. :D

    ReplyDelete
  57. Tx atas manfaat artikelnya sob...
    Sukses !!!

    ReplyDelete
  58. wadohhh gan kok triknya gk bisa di blog ayae plis donk ah malah hilang jdulnya bowzzz

    ReplyDelete
  59. minta cara buat menu yang kalo di klik ntar ada tulisannya ke bawah tu gimana ea ...........lam knal

    ReplyDelete
  60. sep nih om...
    sukses yah om ..?? ^_^

    ReplyDelete
  61. maaf,pak saya masih pusing tolong kirimi email ke ebook.32@gmail.com...
    atau bisa mampir ke http://www.bloggame.co.cc

    ReplyDelete
  62. wah bagus itu infoya . please untuk datang ke blog kami ini dan jgn lupa follow yah www.master-blog-lamongan.blogspot.com :-o

    ReplyDelete
  63. hmm... makasih ya... kan saya coba nanti...

    ReplyDelete
  64. Mantap gan..ni yg ku cari2. smoga berhasil. thanks to infonya gan

    ReplyDelete
  65. This comment has been removed by the author.

    ReplyDelete
  66. mantap gan....
    joit blog aku juga ya..
    http://all-4you-download.blogspot.com/

    ReplyDelete
  67. tapi kok punya ku gk ada y bossssssssss

    ReplyDelete
  68. kunjung balik ea ke http://fajar-juli.blogspot.com
    dan follow .aku sudah follow

    ReplyDelete
  69. kaya'nya keren ya tampilannya..

    ReplyDelete
N.B.
1. Berkomentarlah dengan sopan.
2. Dilarang membuat spam, terutama yang mengandung SARA/ Pornografi/ Judi dan Iklan.