Ky nya ada yang aneh diblog Ayas. Apa y?
Setelah bertapa selama beberapa hari, g makan g minum, paling juga cuma makan nasi putih, tahu tempe, kadang2 ayam, mie, lalapan ato sesekali soto..(sama jua boong!!)..akhirnya ketemu juga apa yang aneh!!
Dengan template 3 kolom, blog Ayas terlihat aneh dan agak g teratur, cz.....
Antara sidebar1, sidebar2 dan klom posting g sama tingginya...jadi kelihatan g teratur.
Klo blog sodara juga kaya gni, dengan template 3 kolom, sidebar kiri kanan, biasanya mengalami masalah kaya gini juga. Tinggi kolom g sama, jadi agak mengganggu.
Lha..gimana supaya tinggi kolom2 tsb bisa kompakan alias sama tinggi??
Yuuuuuuuuukkkzzzzzzzzz..................
========UPDATE==========
Untuk contoh penggunaan trick ini, silahkan menuju kesini.
========================
Cari informasi, cari trik..gimana caranya supaya sidebar n kolom posting bisa sama tinggi. Akhirnya nemu juga caranya di blog sang master. Tapi...........
Setelah dicoba, ternyata ada sedikit ganjalan. Kenapa? Bisa c tu sidebar jadi kompakan. Tapi, trick itu digunakan untuk sidebar yang berada dalam 1 wrapper. Jadi g yang kiri kanan kaya punya ayas ni..
Na, gimana supaya blog ayas ini bisa sama tingginya satu sama laen? Setelah utak atik sedikit, Alhamdulillah, berhasil deh....
Ni Ayas tunjukin buat temen2...
Caranya simple banget kok. Easy juga. Namanya juga easyblogtrick.
Sodara cuma perlu copy kode dibawah ini.......
<script type='text/javascript'>
function Sama_Tinggi(){
var mainwrapper = document.getElementById("main-wrapper");
var sidebarwrapper = document.getElementById("sidebar-wrapper");
var sidebar2wrapper = document.getElementById("sidebar2-wrapper");
var content = document.getElementById("content-wrapper");
Tinggimainwrapper = mainwrapper.offsetHeight;
Tinggisidebarwrapper = sidebarwrapper.offsetHeight;
Tinggisidebar2wrapper = sidebar2wrapper.offsetHeight;
Tinggicontent = content.offsetHeight;
TinggiSisa = Tinggicontent - Tinggimainwrapper;
TinggiSisa2 = Tinggicontent - Tinggisidebarwrapper;
TinggiSisa3 = Tinggicontent - Tinggisidebar2wrapper;
mainwrapper.style.paddingBottom = TinggiSisa + "px";
sidebarwrapper.style.paddingBottom = TinggiSisa2 + "px";
sidebar2wrapper.style.paddingBottom = TinggiSisa3 + "px";
}
</script>
function Sama_Tinggi(){
var mainwrapper = document.getElementById("main-wrapper");
var sidebarwrapper = document.getElementById("sidebar-wrapper");
var sidebar2wrapper = document.getElementById("sidebar2-wrapper");
var content = document.getElementById("content-wrapper");
Tinggimainwrapper = mainwrapper.offsetHeight;
Tinggisidebarwrapper = sidebarwrapper.offsetHeight;
Tinggisidebar2wrapper = sidebar2wrapper.offsetHeight;
Tinggicontent = content.offsetHeight;
TinggiSisa = Tinggicontent - Tinggimainwrapper;
TinggiSisa2 = Tinggicontent - Tinggisidebarwrapper;
TinggiSisa3 = Tinggicontent - Tinggisidebar2wrapper;
mainwrapper.style.paddingBottom = TinggiSisa + "px";
sidebarwrapper.style.paddingBottom = TinggiSisa2 + "px";
sidebar2wrapper.style.paddingBottom = TinggiSisa3 + "px";
}
</script>
Ada beberapa kode yang harus diperhatikan dan DISESUAIKAN dengan template sodara:
- main-wrapper, adalah id mainwrapper kamu. biasanya tertulis #main-wrapper, tempat dimana kamu posting artikel.
- sidebar-wrapper, adalah id sidebar pertama kamu. Bisa yang kiri ato kanan. Biasanya tertulis #sidebar-wrapper.
- sidebar-wrapper, id sidebar kedua sodara. klo ditempat ayas, tertulis #sidebar2-wrapper. Sesuaikan dengan template sodara.
- content-wrapper, adalah tempat dimana ketiga elemen tersebut (main-wrapper, sidebar1 n sidebar2) berada. Biasanya tertulis #content-wrapper.
Selanjutnya, paste kode tersebut diatas kode </head>
Lalu ganti kode <body> menjadi <body onload='Sama_Tinggi()'>
Trus disimpen, n preview. Jadi deh..........Keren khan???
Klo ada yang belum berhsil, coba terus n jangan sungkan2 untuk bertanya ke Ayas, barangkali Ayas bisa bantu....
Yang penting berani mencoba..Ups, hampir lupa, download dulu template sodara y....
GAMPANG KOK!!!
wah boleh juga neh infonya, kebetulan gw jg pake temp 3 kolom. thx
ReplyDeleteWaH boleh dicobah neh... tapi aku wordpress.com
ReplyDeletenggap apa dech siapa tahu nanti bisa diaplikasikan lain kali.
mau nanya juga ni mas. gimana biar link di alexa bisa ada datanya ya, yang saya rangkingnya ada tapi linknya NO DATA. mohon bimbingannya..
trims
Seep nich... klo' budhe sekarang kant pake temp 4 kolom trus supaya postingnya ada ditengah gimana dhonk..makasih yach...
ReplyDeleteAku udah coba2 tp kok ngak bisa ya.......
ReplyDeletemohon bantuan
tenkyu bos atas share ilmunya, semoga membawa manfaat bagi kita semua, amiiiinnn, halah kaya ustadz aja :D
ReplyDelete@cdewi g bisanya kenapa?
ReplyDeletegila...kamu jenius sekali...saya cari-cari kode supaya 3 kolom bisa sama tinggi. Kode kamu yang paling simpel dan tokcer. di blog lain rumit-rumit dan aneh-aneh (termasuk blogger buster). he..he...very..very good.
ReplyDeletemas setelah tak coba kok kolom sebelah kanan malah melorot yach....?
ReplyDeletetp makasih tipsnya
sekalian.........
ReplyDeletemo tanya mas...
kok postinganq meski udah di buat read more tp tinggi kolomnya menyesuaikan tulisan. mksdnya kl isi tulisannya banyak tinggi kolomnya jg bertambah sehingga ada jarak yg lumayan jauh gt?!
makasih
@minoriAyah
ReplyDelete1 Kalo dilihat template Anda, kemungkinan sidebar Anda bukan terdiri dari 2, tetapi 4 sidebar. masing2 sidebar (ki & ka) terdapat 2.nah, penggunaan kode diatas hanya berpengaruh pada 2 sidebar saja, sehingga sidebar yang tidak masuk dalam 'rumus', memberikan jarak, sehingga sidebar kanan menjadi melorot.
2 Coba di cek lagi, mungkin Anda memberikan 2 kode untuk readmore nya pada saat posting (kode 'spanclass=fullpost' nya, sehingga terjadi jarak, dan pada jarak sisa itu tidak ada tulisan terlihat (ter-hidden)
yupz mas aq ngerti sekarang.
ReplyDeletemkasih bgt utk perhatian n jawabannya.
moga jadi ibadahnya.........
makasih!!!
Duh,kok gak berhasil ya...Apa kode diatas diganti dengan angka?
ReplyDeletesuper sekali bung..
ReplyDeleteLuar Biasa!!
akhirnya dapet juga disini setelah seharian nyari2, ampek harus trnslate dari bahasa inggris.. :D
scriptnya berjalan normal di template saya,
thanks a lot and keep post brade!!
best regards,
khairul
http://tunasweb.com