0 komentar

Cara Mengatur tata letak header untuk Pemula melalui Css

Menggapa Tertarik memilih blogger.com?Sebelum Kita Melangkah Lebih jauh  :
Pasti Sobat  Bertanya - tanya....
 Kenapa harus blogger, Ka ? kan masih banyak yang lainnya.
Memang selain blogger.com sebenernya masih banyak sekali layanan blogging yang bisa digunakan, tapi hampir kebanyakan orang di Indonesia lebih memilih blogger.com
Berikut adalah beberapa alasannya:
  • Lebih Mudah Membuatnya 
  • GratisTentunya..
  • Mudah digunakan untuk pemula
  • Fitur yang lumayan lengkap
  • Bisa digunakan untuk menghasilkan  Materi 
  • Terpercaya karena dikelola oleh Pihak Google 
Baiklah setelah sobat Membuat Blogger pasti sobat tertarik untuk Membuat atau melakukan sedikit perubahan pada design Templete yang di sediakan oleh pihak google .
untuk pengaturan tempelete yang di sediakan oleh pihak google apa bila teman - teman ingin mengatur header nya cukup masuk saja ke pengaturan  (Templete)

Kemudian silahkan anda pilih  untuk menyesuaikan besar halaman anda melalui
1. Sesuaikan Lebar
2. Tata letak  





  











hal tersebut di gunakan untuk templete  yang telah di sediakan oleh google ..
Tapi bagaimana cara dengan templete yang di download
maka akan muncul tampilan seperti tampilan tersebut ...
 
maka hal yang kita lakukan adalah melalakukan pengeditan pada bagian Css mungkin Sobat bertanya - tanya Apa yang di maksud Css pada lain hal kesempatan saya kan membahasnya ..
tapi langkah awal yang harus di lakukan adalah silah kan masuk sama seperti hal yang di atas cuman bedanya Masuk link yang telah di sediakan oleh pihak google pada Botom yang di sediakan
di tampilan ya itu Edit Html ..

pada
1.    Outer-wrapper : pada template ditandai dengan kode CSS #outer-wrapper, #outer-wrap atau #outer. Maksudnya adalah lebar/ukuran template secara keseluruhan dimana didalam outer-wrapper ini terdapat bagian header, posting, sidebar dan footer.
2.   Header-wrapper : pada template ditandai dengan kode CSS #header-wrapper, #header-wrap atau #header. Pada beberapa template bagian header ini ada juga yang terbagi dari 2 seperti pada template saya ini, maka kode CSSnya juga ada 2 seperti ini #header dan #header2. Yang membedakan posisinya adalah float right dan float left. Ukuran lebar menu navigasi yang ada dibawah atau diatas header juga biasanya sama.
3.   Content-wrapper : pada template ditandai dengan kode CSS #content-wrapper, #content-wrap atau #content. Jika pada template anda tidak terdapat kode ini, berarti untuk area posting dan sidebar pengaturan CSSnya ada pada bagian /* -----   MAIN   -----  */.
4.   Main-wrapper : pada template ditandai dengan kode CSS #main-wrapper, #main-wrap atau #main. Nah pada bagian main-wrapper inilah area posting anda berada.
5.   Sidebar-wrapper : pada template ditandai dengan kode CSS #sidebar-wrapper, #sidebar-wrap atau #sidebar. Pada template tertentu sidebar terkadang juga ada lebih dari 1. Jadi boleh jadi dalam template ada beberapa kode sidebar yang ditulis secara urut seperti #sidebar-wrapper, #sidebar1-wrapper atau #sidebar1 dan #sidebar2.
6.  Footer-wrapper : pada template ditandai dengan kode CSS #footer-wrapper atau biasanya juga terdapat dibawah kode /* -----Footer Content----- */ atau /* -----Footer Wrapper----- */.  

kemudian silahkan di cari tulisan Wrapper lalu silahkan dirubah untuk lebar panjang akan muncul tampilan seperti ini  <div id='outer-wrapper'><div id='wrap'>
<!-- skip links for text browsers -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>skip to main </a> |
      <a href='#sidebar'>skip to sidebar</a>
silahkan di rubah untuk header kebawah silahkan ruabah Wrapp menjadi Wrapp 2
Selamat Mencoba ...



 
read more