Combine Strom

RESPONSIVE DESIGN

Design By Harris Munahar, maka dapat berkreasi untuk menampilkan desain website yang indah pada perangkat seluler.

Responsive Design

Responsive Design merupakan teknologi terbaru yang memiliki karateristik tentang desain template website. Dalam hal ini sebuah tampilan website dapat dilihat melalui perangkat seluler yang telah diatur dengan media CSS, maka anonim dapat berkreasi untuk menampilkan desain website yang indah pada perangkat seluler.

Loading...

Modifikasi Homepage Sesuai keinginan

Modifikasi Homepage Sesuai keinginan

Pada kesempatan kali ini saya akan memberikan tips bagaimana membuat tampilan homepage atau halaman utama sesuai keinginan kita, seperti yang kita ketahui ada banyak cara agar membuat tampilan homepage menjadi simpel seperti mengurangi widget yang muncul pada homepage atau halaman utama dan memunculkanya hanya pada halaman posting ataupun menambahkan fitur image slider pada halaman utama saja, tapi jarang yang menghilangkan halaman posting ataupun sidebar pada homepage.
Seperti pada blog saya ini, saya menghilangkan halaman posting dan menggantinya dengan widget daftar isi navigasi dari DT:] dengan tujuan agar halaman utama saya bisa lolos dari w3c validator, karena kalau kita tetap menampilkan halaman posting pada homepage  dan ada beberapa artikel yang tampil itu sering dianggap error oleh w3c validator, makanya saya lebih suka menggantinya dengan widget recent post ataupun yang lainya.

Berikut beberapa cara merubah tampilan homepage/halaman utama pada blog.
1. Login Akun blogger anda
2. Pada dashboard pilih Template > Edit HTML
3. Untuk menghilangkan halaman posting ada 2 cara yang saya pakai yaitu dengan menggunakan tag conditional dan css {display:none}
#### Cara pertama Dengan menggunakan tag conditional berikut caranya:
Lihat kode berikut ini:

            <b:section id='main-wrapper' maxwidgets='1'>

<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>

</b:section> 
Lihat code main-wrapper itu merupakan kode yang membungkus halaman posting dan untuk kode yang berwarna biru itu adalah kode/widget halaman posting.
Agar halaman posting tidak tampil pada homepage kita akan menggunkan tag conditional untuk menghilangkanya, dan kodenya menjadi sepeerti berikut ini

<b:if cond='data:blog.url != data:blog.homepageUrl'> 

            <b:section id='main-wrapper' maxwidgets='1'>

<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>

</b:section> 

</b:if>
kode yang berwarna hijau merupakan tag conditional dan yang bawah merupakan kode penutup dari tag conditional tersebut


#### Cara kedua dengan menggunakan css {display:none;} pada ID halaman posting yaitu Blog1
Untuk cara kedua ini kita menggunakan tag conditional dan css untuk menghilangkannya, menggunakan cara kedua ini kita bisa lebih leluasa untuk mengatur lebar dari tampilan homepage
contoh code seperti ini

<b:if cond='data:blog.url==data:blog.homepageUrl'>

<style>

body {background-color:#fefefe}

#outer-wrapper {width:500px} /* yang membungkus halaman posting dan sidebar */ 

#Blog1 {display:none}

#main-wrapper {width:100%} /* halaman posting */

#sidebar-wrapper {width:100%} /* sidebar */

</style>

</b:if>
Silahkan anda sesuaikan sendiri, dengan kode diatas saya menghilangkan halaman posting dan hanya menampilkan sidebar saja. jika ingin menampilkan halaman posting saja rubah saja kodenya menjadi seperti ini  
#main-wrapper {width:100%;}
#sidebar-wrapper {display:none;}
Anda juga bisa merubah warna background ataupun yang lainya.
Kode tersebut di khususkan untuk homepage saja. jika anda ingin menerapkanya copy saja kode tersebut dan letakkan diatas kode </head>
Tapi perhatikan, karena pada setiap template ID elment tidak selalu sama.
Semoga bisa di mengerti dan semoga bermanfaat.
"Anda bisa berkreasi sendiri, tidak ada salahanya mencoba jangan takut melakukan kesalahan, karena dari kesalahan kita bisa menemukan sesuatu yang sangat menarik."

Relate Post: Modifikasi Homepage Sesuai keinginan

Comments ( 7 comments )
  1. Masih males ganti lagi vruh, masih demen yang kayak di blog gue sekarang..... tapi gue bookmark yaa sapa tau nantii gue khilaf dan berubah pikiran hehehe :)) tapi btw, keren juga homepage site ini vruh

    ReplyDelete
    Replies
    1. Hahah silahkan bro.. njir ganti homepage ajh harus khilaf dlu.. ada" ajh ente

      Delete
  2. mending ori bro :D tapi ane hargai usaha ente ngasih tips edit homepage ini :D btw ijin coba dlu ke blog ane yang satunya ( tumbal ) klo jadinya cool ane juga mau nyoba :D

    ReplyDelete
    Replies
    1. Kalo ori ga ada kepuasaannya bro.. mendingan buat sendiri jadinya ada kepuasan tersendiri.. silahkan bro di coba

      Delete
  3. Mantap bro tutorialnya bermanfaat nih kapan2 saya coba deh buat blog pribadi saya hehe :D thanks udah sharing bro (y)

    ReplyDelete
  4. aku mumet,, bro mikiri kaya kue,,, tapi saya simpen aja, lah buat belajar di sekolahan

    ReplyDelete
  5. thanks banget nh gan, pemebelajaran yang baru untuk newbie seperti saya :D hehe usulan donga gan untuk modifikasi templates/tampilan blog :)

    ReplyDelete
Show More Comment 7 comments
Delete More Comment

Komentar yang mengandung Link Aktif, Out Of Topic, Tidak Sopan, Berkata Kasar akan saya hapus untuk menghindari SPAM.

Gunakan Fasilitas di bawah ini apabila Anda perlu menggunakannya.
Terima Kasih Telah Berkunjung...

Copyright © Combine Strom | Dsign By: