Cara Membagi Wrapper menjadi Kiri dan Kanan

loading...

Selamat datang di The Royal Moringa. Untuk menjawab pertanyaan pembaca yang sebelumnya ingin memasang widget sosial media di header maupun footer tetapi judul atau copyrightnya berada di tengah widget atau dengan kata lain center align. Nah, artikel kali ini akan membahas bagaimana cara agar kita bisa meletakkan widget sosial media atau yang lain pada widget yang sama dengan judul/copyright kita. Kita hanya perlu membagi widget utama menjadi 2 widget yang posisinya masing-masing terletak di kiri dan kanan widget. Untuk lebih jelasnya, langsung kita perhatikan langkah berikut.

1. Log in ke akun blog anda > Pada dashboard pilih Theme >Edit HTML > Cari ]]></b:skin> kemudian copy dan paste kode CSS berikut diatasnya.

                                  .content-left{ float:left; overflow:hidden; height:45px } .content-right{ float:right; overflow:hidden; height:45px }

2. Kemudian menuju tag body dan cari dimana elemen widget utama anda berada. Perhatikan contoh berikut.

<div id="header"> //widget utama anda yang berada di paling atas halaman blog//

<div id="blog-title">...</div> //judul blog anda yang terletak di tengah//

</div>

sekarang, anda perlu mengubah kode HTML tersebut menjadi demikian

<div id="header">

<div class="content-left"> //memposisikan judul blog disebelah kiri//

 <div id="blog title">...</div>

</div>

<div class="content-right"> //memposisikan widget sosmed disebelah kanan//

<div id="social-media">...</div>

</div>

</div>

3 Jadi, elemen yang perlu anda tambahkan adalah <div class="content-left"> dan <div class="content-right"> didalam tag widget utama anda. Lakukan seperti contoh.

4. Height pada kode CSS dapat disesuaikan dengan ukuran widget anda. Biasanya setiap template  mengatur margin kiri dan kanan semua konten di blog dengan ukuran width : 1200px dan margin : 0 auto sehingga widget kiri dan kanan tidak mepet dengan pinggir halaman blog tetapi ada margin sedikit seperti contoh gambar diatas.

5. Save Template dan lihat hasilnya

Perlu diketahui sebelumnya pembagian sebuah widget menjadi left dan right tidak hanya bisa dilakukan pada widget judul, copyright atau sosial media saja tetapi semua widget. Misal sebelah kiri widget link list menu sebelah kanan widget blog search, itu juga bisa dilakukan dan lain sebagainya. Sekian dulu artikel kali ini. Terima Kasih telah membaca!

loading...