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.
- Cari kode berikut: (Cirinya lihat kode warna merah)
<b:if cond='data:blog.pageType != "item"'>Note: Tanda (.............) mungkin berisi kode yang panjang
#main-wrapper {
width:372px;
float:left;
}
......................
</b:if>
</style>
- Kemudian sisipkan kode berikut diantara kode:
<b:if cond='data:blog.pageType != "item"'>Kode yang harus disisipkan:
......letakkan kodenya disini........
#main-wrapper {
#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 != "item"'>
#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
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..
templatenya buat sendiri ya??
ReplyDeletekeren juga nih.... :m:
gak sobat..
ReplyDeletetemplate karya mas ndyteen..
hanya aku share disini dan edit2 dikit..
tapi aku ga' pakai tempat itu sob.. tapi ga' pa pa juga untuk dipelajari
ReplyDeleteYang simpel begini biasanya ramah SEO.
ReplyDeleteSalam ukhuwah
manteb soob, eh coba liat blog aku, minta pencerahannya niih..
ReplyDeletecoba klik dunia islam, trus kan masih 3 kolom tuuh, cara ngilangin kolom ke dua gimana??
Wah, emang bener apa yg kamu bilang sob. Aku pernah coba-coba pake template buatan NdyTeen ini tapi karena Home , Page Newer Link and Page Oldest Linkny gak karuan tempatnya jadi aku copot lagi dehh templateny. Tapi thanks atas pencerahannya. ^_^
ReplyDeleteMantap kali mas
ReplyDeleteCool Keep Modif :a:
ReplyDeletenice artikel sob.. makasih ni buat tutornya.
ReplyDeletesuatu saat pasti berguna kalau di timpa masalah yang sama.
salam sukses......
Wah Mantep emang Template Simple Fresh...
ReplyDeleteTx sobat.. Keep Blogging :s:
makasih mas akhrnya request saya di p0sting ntar langsung dc0ba he he he kaMsia Gan :x:
ReplyDeletetemplet modif ta shob, terimakasih atas pencerahannya, saya simpan dulu ya
ReplyDeletemantab
ReplyDeleteMantaf..gan..sedot dlu ahhh...
ReplyDeleteselamat berkreasi teruz sob..
ReplyDeletenantinya kebanggaan dan kesuksesan akan menghampiri sobat.
templatenya memang keren sob ...
ReplyDeletemantab sob tutorialnya.
ReplyDeletehmmmm...cssnya kok ada inline ada eksline yak...hmmm
ReplyDeletebawaan template memang beda2 yak master...
kalo aku trik ini gak ngaruh...wkwkkwkw
master doyok selain rendah hati, rendah darah, rendah lain-lainya....wkwkkwkwkwk
Setelah diedit berarti semakin baik dan sempurna ya. Keunggulan ramah SEO banyak dicari blogger, buktinya template ini digunakan banyak blogger juga.
ReplyDeleteSalam ukhuwah
mantap mas templetnya :) simple tapi elegan
ReplyDeletebaru mampir sob....
ReplyDelete.
.he makasih yaw atas informasinya artike nie....
templatenya enak nih, patut di contoh :u:
ReplyDeleteTemplate friendly like this blog, trima kasih infonya sob...di copy dulu codenya ya, thanks
ReplyDeletethanks atas tipsnya brow...
ReplyDeletesory baru mampir
Mendukung template ramah SEO seperti ini. Ditunggu posting berikutnya
ReplyDeleteSalam ukhuwah
bagus bangetz.....good guid for me,thankz brow.....
ReplyDeletesob, uuntuk komentar jadi seperti tmpmu gimana ??
ReplyDeletetest
ReplyDelete