postingan kali ini bertajuk tentang pembuatan front page blog seperti sebuah website. pernahkah sobat kunjungi sebuah web site dan pada front page nya hanya terdapat menu dan content berada pada salah satu menu. ini adalah konsep pembuatan website yg ringan. nah saya pernah mencobanya pada blog saya namun tidak saya pakai lagi karena blog lebih enak di liat langsung ke content "2 d point" tp jika sobat berminat saya akan share sedikit cara pembuatan blog ala website
step 1 :
jika sobat ahli dalam membaca html maka akan terbagi 2 page pada template seperti keterangan di bawah<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- (untuk halaman frontpage) -->
<b:else/>
<!-- (untuk halaman blog) --> </b:if> step 2 :
nah sekarang kita urai menjadi 2 bagian seperti keterangan di atas . letakkan kode berikut di bawah <body>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- (kode HTML untuk halaman frontpage) -->
<b:else/> kemudian masukan pula ini diatas </body> :
</b:if> step 3 : Untuk menambahkan widget, masukan kode berikut (diatas <b:else/>) :
<div id='frontpage-wrapper'>
<b:section class='frontpage' id='frontpage'/>
</div> jika sudah di save maka di page elemen anda akan ada tulisan "ADD NEW WIDGET/TAMBAHKAN WIDGET BARU"" step 4 : kode CSS nya sobat buat style baru seperti berikut simpan diatas </head>:
<style type='text/css'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
/* kode cssnya di sini bro */
</b:if>
</style>
step 5 : anda perhatikan kode merah di atas disana anda isi html dengan format
<div id='frontpage'>
<h1><a href='/'><data:blog.title/></a></h1>
<ul class='nav'>
<li><a href='/'>Home</a><span class='special-character'>/</span></li>
<li><a href='/'>Category</a><span class='special-character'>/</span></li>
<li><a href='/atom.xml'>RSS</a><span class='special-character'>/</span></li>
</ul><!-- end nav -->
<div class='clear'>LongField</div> <div id='terbaru'>
<b:section class='terbaru' id='terbaru1'>
<b:widget id='Feed1' locked='false' title='Recent Post' type='Feed'/>
</b:section>
</div>
<p>LongField </p>
</div> yg berwarna kuning bisa anda kreasikan sesuai dengan yg anda inginkancontohnya dengan menu JQuery atau semacamnya tp jangan lupa sebelumnya anda sesuaikan dengan CSS yg anda style warna hijau
1 komentar:
bagus temanya bro
Post a Comment