HOMECara Menukar Posisi Elemen biasanya dipakai untuk template magazine bertujuan untuk menambah variasi dari template magazine tersebut agar terlihat tidak monoton (menurut saya loh, kalau menurut sobat?). Trik blog yang satu ini biasanya digunakan pada halaman Single post, pada halaman Homepage posisi elemen tidak berubah namun setelah kita membaca atau berada dalam salah satu postingan, maka kita akan melihat efeknya (perubahan posisi). Cara Menukar Posisi Elemen ini merupakan permainan dari css, yang dimana Value dari Property di rubah menjadi sebaliknya dan biasanya Property-nya yaitu float dan Value-nya itu right, center atau left.
Memang untuk mengakali agar Pertukaran elementidak terjadi pada halaman depan, membutuhkan trik atau cara lagi, yaitu dengan menggunakan trik yang pernah saya jelaskan juga disini, Memunculkan Widget Di Halaman Tertentu 2 itulah cara yang digunakan. Namun pada trik tersebut dijelaskan bahwa, kita hanya dapat memunculkan atau lebih mudahnya menyembunykan widget tertentu untuk di tampilkan di halaman tertentu, sedangkan yang satu ini adalah menukar? Mungkin sobat bingung namun tidak usah bingung karena pada dasarnya trik ini dipengaruhi oleh css saja, asalkan kita mengerti sedikit tentang css maka dalam memainkan trik b if kita tidak pusing ataupun bingung.
Sekarang elemen yang akan saya berikan untuk contoh adalah elemen main-wrapper (elemen postingan) dengan elemen Sidebar-wrapper yang ada pada template minima dari blogger. Pada umumnya main-wrapper pada template minima blogger berada di kiri sedangkan Sidebar-wrapper di kanan pada Homepage (halaman depan) maupun pada halaman Single post (halaman postingan). sekarang kita rubah pada halaman Homepage, main-wrapper (elemen postingan) berada di kiri sedangkan Sidebar-wrapper (elemen sidebar) berada dikanan. Nah bagaimana cara merubahnya pada saat kita memasuki atau berada pada halaman Single post (halaman postingan) main-wrapper (elemen postingan) berada di kanan sedangkan Sidebar-wrapper (elemen sidebar) berada di kiri? sobat hanya menambahkan kode di bawah ini kedalam template sobat (Login >> Rancangan >> Edit HTML) tepat di bawah ]]></b:skin>.
<style type='text/css'>
<b:if cond='data:blog.pageType == "item"'>
#main-wrapper {
width: 410px;
float: right;
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 */
}
#sidebar-wrapper {
width: 220px;
float: left;
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 */
}
</b:if>
</style>
Nah hanya dengan kode tersebut sobat dapat menukar elemen pada template sobat, trik ini tidak terkecuali pada elemen manapun tapi elemen pada template y. Sekarang saya akhir dan oketrik mengucapkan , walaupun ucapannya terbilang lambat tapi tidak apa-apakan ^_^
1 Komentar:
terimakasih kak atas infonya