Tip & Trik Modifikasi Sendiri Template BloggerLowongan kerja|tki ex magang jepang|resmi non imm|terbaru 2016


  kiri
titik tengah  CARI BARANG
banner kanan
---
  banner kiri
titik  MENU
banner kanan
  banner kiri
titik  ATURAN
banner kanan
---
  banner kiri
titik  LOGIN
banner kanan
Username
Password
 
---
  banner kiri
titik  CUSTOMER SERVICE
banner kanan
Yahoo Messenger:
Customer Services dagangku.comCustomer Services
  banner kiri
titik  BANNER
banner kanan

Video Shooting jakarta

Program Magang Jepang
User: Guest | Anda Belum Login
  TIPS & TRIK DETAIL
| Diposting oleh Admin | Dibaca 1796 kali dari Website Dagangku.com

Tip & Trik Modifikasi Sendiri Template Blogger

Tip & Trik Modifikasi Sendiri Template Blogger

Tip & Trik Modifikasi Sendiri Template Blogger

 

Sudah bosan dengan template Blogger yang itu-itu saja? Ada dua pilihan buat Anda. Cara pertama cukup praktis, cari dan download template Blogger dari pihak ketiga, lalu salin dan pasang kode template blogger baru pilihan Anda. Cara kedua lebih kreatif, modifikasi sendiri template Anda!

Berikut beberapa tip dasar yang bisa Anda gunakan untuk mengedit atau membuat template Blogger Anda:

Backup Template dan Komponen

Hal pertama yang harus Anda lakukan sebelum mengganti template Blogger adalahmembackup template lama dan elemen-elemen halaman yang telah Anda miliki. Komponen selain posting, arsip, dan komentar cukup rawan dengan resiko hilang saat template baru diterapkan (Blogger akan memberi peringatan berupadaftar widget yang akan terhapus jika template baru Anda terapkan).

  1. Login ke halaman pengelolaan blog, klik Layout > Edit HTML.
  2. Untuk membackup template awal, seleksi seluruh kode di kotak Edit Template (Ctrl+A), lalu copy (Ctrl+C).
  3. Buka Notepad, lalu salin kode ke dalam lembar kerja Notepad (Ctrl+V).
  4. Simpan backup template awal Anda.

Edit HTML Blogger

Sebagai catatan, jika Anda telah menambahkan elemen / widget pada halaman blog Anda, maka sebelum melakukan langkah ke-2, aktifkan dulu kotak pilihan Expand Template Widget (di bagian atas kotak Edit Template). Baru setelah itu salin seluruh kode dan Anda simpan sesuai langkah berikutnya.

Kini Anda sudah siap mengutak-atik template Blogger Anda. Jika hasilnya kurang memuaskan, Anda tetap dapat memulihkan template awal dengan cara menyalin kode backup dari Notepad ke kotak Edit Template.

Menghilangkan NavBar

Merasa tidak nyaman dengan tampilan NavBar di bagian atas halaman blog Anda? Singkirkan NavBar dan perluas tampilan halaman blog Anda dengan cara berikut:

NavBar Blogger

  1. Buka template Blogger Anda di Layout > Edit HTML.
  2. Temukan titik penyisipan, letakkan kursor persis di atas baris body {.
  3. Sisipkan baris kode di bawah ini untuk menghilangkan tampilan NavBar di halaman blog Anda: 

    #navbar-iframe {
       height:0px;
       visibility:hidden;
       display:none
    }
  4. Simpan perubahan template, preview blog dan nikmati hasilnya.

Penyisipan Kode Menghilangkan NavBar

Memodifikasi Lebar Halaman

Hal pertama yang perlu Anda pahami dalam memodifikasi halaman blog Anda adalah mengenai penetapan lebar komponen halaman (header, halaman posting, sidebar, dan footer).

Berikut adalah rumusan yang bisa Anda jadikan pedoman dalam mengutak-atik lebar halaman blog Anda :

#header-wrapper = #outer-wrapper = #footer = #main-wrapper + 30 + #sidebar-wrapper

Temukan dan ubah nilai width: di bagian tersebut sesuai kebutuhan :

  • #header-wrapper#outer-wrapper, dan #footer menjadi patokan lebar seluruh halaman blog.
  • #main-wrapper adalah ukuran kolom posting Anda.
  • #sidebar-wrapper adalah ukuran kolom sidebar Anda.
  • Nilai 30 digunakan untuk memberi jarak antara antara kolom posting dan kolom sidebar.

Dengan berpatokan pada rumusan di atas, maka Anda dapat mengubah ukuran halaman Anda dengan mengedit HTML dengan nilai seperti berikut :

Nilai width awal:
660px = 660px = 660px = 410px + 30px + 220px

Nilai width untuk modifikasi:
750px = 750px = 750px = 470px + 30px + 250px

Penjelasan langkah pengeditan:

  1. Timpa nilai width pada bagian #header-wrapper#outer-wrapper, dan#footer menjadi 750px.
  2. Timpa nilai width pada bagian #main-wrapper menjadi 470px.
  3. Timpa nilai width pada bagian #sidebar-wrapper menjadi 250px.

Nilai width #main-wrapper = 470px cocok untuk beriklan (ukuran ini bisa mengakomodasi banner 468x60 px). Silakan ubah ukuran sesuai selera dengan berpatokan pada rumusan di atas.

Memodifikasi Jumlah Kolom

Pilihan template yang disediakan Blogger umumnya tersusun atas dua kolom(kolom posting dan kolom sidebar). Anda dapat membuat kolom tambahan dengan menyalin kode sidebar dan mengatur ulang ukurannya.

Sebagai contoh, berikut cara membuat halaman blog dengan tiga kolom.

Penyisipan Kolom Sidebar Baru

  1. Buka template Blogger Anda di Layout > Edit HTML.
  2. Kita gandakan kode kolom sidebar yang sudah ada. Umumnya kode sidebar dinamai sidebar-wrapper, namun ada juga template yang menggunakan nama sidebar-wrap atau sejenisnya.
  3. Temukan, seleksi, dan salin bagian ini: 

    #sidebar-wrapper {
      width: 220px;
      float: $endSide;
      word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
      overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
    }
  4. Pindahkan kursor di bawah kode tersebut, lalu sisipkan kode yang telah Anda salin. Kini anda memiliki 2 kode di atas.
  5. Bedakan nama kode, edit nama #sidebar-wrapper yang telah Anda sisipkan menjadi #sidebar-wrapper2.
  6. Ubah nilai width di #sidebar-wrapper dan #sidebar-wrapper2, dengan cara membagi 2 nilai yang ada. Misalnya nilai awal 220px Anda bagi menjadi masing-masing 110px.
  7. Selanjutnya temukan, seleksi, dan salin bagian ini: 

    <div id='sidebar-wrapper'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
    ...
    ...
    </b:section>
    </div>
  8. Pindahkan kursor di bawah kode tersebut, lalu kembali sisipkan kode yang telah Anda salin. Kini anda memiliki 2 kode di atas.
  9. Edit nama <div id='sidebar-wrapper'> yang telah Anda sisipkan menjadi<div id='sidebar-wrapper2'>.
  10. Simpan Template. Preview blog Anda untuk memastikan tampilan 3 kolomtelah berhasil Anda buat.

Catatan, jika lebar sidebar pertama dan kedua menjadi sempit, maka gunakan rumusan Memodifikasi Lebar Halaman.

Selamat mencoba !


Sumber:smitdev.com

Artikel Tips dan Trik lainnya

    Comment
Nama
:
Email
:
Kategori
:  
Komentar
:
   

Chat Dengan Pakar:
errorHidup adalah bangun,bangun adalah hidup.Apakah hidup dan bangun itu sama??

  inspirasi
mutiara nasehat  MUTIARA NASEHAT
nasehat

"Pemulihanjiwa menguatkan hati dan mendewasakan, semoga kamu selalu tabah dalam hidup ini"

-:-----------------:-

  hot link
titik  HOT LINK
hot
  inspirasi
mutiara nasehat  COMMENT
nasehat

From : zico
Tanggal : 16 Oct 2009
Pesan : ini br web yg paling hot, top abis dah!!!!!

Banner dagangku