Edit Simple Fresh Template

Ternyata setelah saya share tentang Simple Fresh Template banyak juga sahabat blogger yang menngunakan template ini. Karena jelas sekali, Simple Fresh Template memiliki banyak fitur yang menguntungkan sekali bagi para penggunanya diantaranya designnya yang unik dan yang sangat penting adalah SEO Friendly. Tentunya hal ini akan sangat membantu dalam pengoptimalisasian blog untuk lebih dikenal oleh Search Engine.

Mungkin sebagian dari anda kaget dengan judul postingan ini, Edit Simple Fresh Template. Kenapa saya menggunakan judul tersebut? karena sepanjang saya menggunakan template ini ternyata ada beberapa kekurangan yang harus dan mesti diperbaiki untuk membuatnya enak dilihat. Diantaranya yang membuat saya kalang kabut cari solusinya kemarin adalah: Older dan Newer Post yang tidak sesuai pada tempatnya dan kolom footer yang agak jauh dari kolom diatasnya. Akhirnya, saya mendapatkan jawabannya dari seorang master blogger yang sangat rendah hati yaitu Mas Doyok yang menuntun saya mengutak-atik template ini. Baiklah berikut saya share kepada sahabat blogger terutama yang menggunakan template ini karena saya lah yang menyebabkan mereka menggunakannya.

Newer Dan Older Post Yang Tidak Pada Tempatnya
Trik berikut murni saya dapatkan dari Mas Doyok yang memberikan salah satu Link artikelnya kepada saya untuk dipelajari dan setelah dipraktekin berhasil. Berikut langkah-langkahnya:
  • Login ke Blogger.com
  • Kemudian Tata Letak
  • Pilih Edit HTML
  • Centang Expand Widget
  • Cari kode berikut:

#blog-pager-newer-link { float: left; }
#blog-pager-older-link { float: right; }
#blog-pager { text-align: center; }
  • Ganti kode diatas dengan kode dibawah ini:
#blog-pager-newer-link{float:left; line-height:1.8em; font-weight:bold}
#blog-pager-older-link{float:right; line-height:1.8em; font-weight:bold}
#blog-pager{width:600px; float:left; text-align:center; line-height:1.8em; font-weight:bold; color:white}
  • Kode berwarna merah ganti dengan lebar pada main-wrapper template anda, Bagi pengguna Simple Fresh Template tinggal Copas saja.
Note: Bagi Template dengan 2 Lebar Main-Wrapper Seperti Simple Fresh Template
  • Cari kode berikut: (Cirinya lihat kode warna merah)
<b:if cond='data:blog.pageType != &quot;item&quot;'>
#main-wrapper {
       width:372px;
       float:left;
       }
......................
</b:if>
</style> 
Note: Tanda (.............) mungkin berisi kode yang panjang
  • Kemudian sisipkan kode berikut diantara kode:
<b:if cond='data:blog.pageType != &quot;item&quot;'>
......letakkan kodenya disini........
#main-wrapper {
Kode yang harus disisipkan:
#blog-pager-newer-link{float:left; line-height:1.8em; font-weight:bold}
#blog-pager-older-link{float:right; line-height:1.8em; font-weight:bold}
#blog-pager{width:372px; float:left; text-align:center; line-height:1.8em; font-weight:bold; color:white}

  • Kode warna merah sesuaikan dengan width main-wrapper ke 2 template anda.
  • Maka kodenya akan seperti ini:
<b:if cond='data:blog.pageType != &quot;item&quot;'>
#blog-pager-newer-link{float:left; line-height:1.8em; font-weight:bold}
#blog-pager-older-link{float:right; line-height:1.8em; font-weight:bold}
#blog-pager{width:372px; float:left; text-align:center; line-height:1.8em; font-weight:bold; color:white}
#main-wrapper {
       width:372px;
       float:left;
       }
  • Kode berwarna biru adalah kode yang telah disisipkan dan yang merah adalah width main-wrapper ke 2 yang telah disesuaikan. Untuk pengguna Simple Fresh Template tinggal Copas saja.
  • Selanjutnya Save Template
Jarak Footer Yang Agak Jauh Dengan Kolom Diatasnya (kolom posting dan sidebar)
Tutorial berikut saya dapatkan waktu pertama kali gabung di chat SM (ShoutMix) Mas Doyok. Saya masih ingat, waktu itu adalah pertamakali saya chat dengan dia dan langsung mengajukan beberapa pertanyaan :D Berikut jawaban Mas Doyok yang mungkin bermanfaat untuk anda khususnya pengguna Simple Fresh Template dan sahabat blogger yang lain.
Tutorial berikut lebih dikhususkan bagi pengguna Simple Fresh Template
  • Dalam keadaan login seperti langkah-langkah diatas.
  • Cari kode berikut:
/**************   BOTTOM  *****************/
#column {
    width: 960px;
    position: relative;
    clear: both;
    margin: 10px 0 -15px -10px;
    color: #000;
    float: left;
  • Pada margin ganti kode berwarna biru(10px) ke 0px sehingga menjadi margin: 0px 0 -15px -10px;
  • Selanjutnya cari kode berikut:
#main-wrapper {
    float: left;
    width: 600px;
    margin: 0;
    padding: 0 0 20px; } 
  • Kode berwarna biru(20px) pada padding ganti ke 0px sehinngga menjadi seperti ini padding: 0 0 0px;
  • Selanjutnya Save Template dan lihat hasilnya.. 
Share on Google Plus

About Admin

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.