Buat Tampilan Blog Berbeda Pada Halaman Yang di Inginkan

» » Buat Tampilan Blog Berbeda Pada Halaman Yang di Inginkan

Buka template editor anda diblogger dan letakkan ini di atas kode </head>



<b:if cond='data:blog.url == &quot;http://blog_anda.com/1999/09/sesuatu.html&quot;'>
<style>
// CSS disini
</style>
</b:if>


Itu adalah dasarnya untuk membuat tampilan berbeda di setiap halaman yang kita inginkan berdasarkan url nya. Berikut ada beberapa lagi yang mungkin ingin anda coba



<b:if cond='data:blog.pageType == &quot;index&quot;'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style> //CSS dihalaman home/beranda </style>
</b:if>
<b:if cond='data:blog.searchLabel'>
<style> //CSS dihalaman kategori </style>
<b:if cond='data:blog.searchLabel == &quot;lorem&quot;'>
<style> //CSS dihalaman kategori lorem </style>
</b:if>
<b:if cond='data:blog.searchLabel == &quot;ipsum&quot;'>
<style> //CSS dihalaman kategori ipsum </style>
</b:if>
<b:if cond='data:blog.searchLabel == &quot;dolor&quot;'>
<style> //CSS dihalaman kategori dolor </style>
</b:if>
</b:if>
<b:if cond='data:blog.searchQuery'>
<style> //CSS dihalaman pencarian </style>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;>
<style> //CSS dihalaman static </style>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;>
<style> //CSS dihalaman item/postingan </style>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;>
<style> //CSS dihalaman arsip </style>
</b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;>
<style> //CSS dihalaman error </style>
</b:if>
</b:if>


Dibawah ini untuk membuat tampilan postingan berbeda berdasarkan kategori postingan



<&lt;--
<b:section id='labels-style'>
<b:widget id='Blog9' locked='true' title='Posting Blog' type='Blog'>
<b:includable id='main' var='top'>
--&gt;
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
</b:if>
&lt;!--
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='comment-form' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='comment_count_picker' var='post'/>
<b:includable id='comment_picker' var='post'/>
<b:includable id='comments' var='post'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>
<b:includable id='nextprev'/>
<b:includable id='post' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;lorem&quot;'>
<style> //CSS untuk postingan dengan kategori lorem </style>
</b:if>
<b:if cond='data:label.name == &quot;ipsum&quot;'>
<style> //CSS untuk postingan dengan kategori ipsum </style>
</b:if>
<b:if cond='data:label.name == &quot;dolor&quot;'>
<style> //CSS untuk postingan dengan kategori dolor </style>
</b:if>
</b:loop>
</b:if>
</b:includable>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='shareButtons' var='post'/>
<b:includable id='status-message'/>
<b:includable id='threaded-comment-form' var='post'/>
<b:includable id='threaded_comment_js' var='post'/>
<b:includable id='threaded_comments' var='post'/>
</b:widget>
</b:section>
--&gt;


Gantilah bagian yang saya tandai dengan kategori yang ada diblog sobat dan terakhir sobat hanya perlu mengisi kode CSS pada bagian yang sudah disediakan untuk mengatur desain tampilan sesuai keinginan sobat. Jika sobat belum tau apa itu CSS, ada baik sobat belajar CSS dulu, bisa cari di Google.

Komentar (2)

Berkomentarlah yang relevan dengan isi postingan.
Untuk menyisipkan gambar, gunakan kode [img]URL GAMBAR[/img]
Untuk membuat quote's, gunakan kode [blockquote]KATA ANDA[/blockquote]
Untuk menyisipkan kode, gunakan tag [code]KODE ANDA[/code]
Untuk menyisipkan kode panjang bisa menggunakan tag [pre]KODE PANJANG ANDA[pre]

Batal Balas Komentar

Beauty