Membuat Tampilan Blog Berbeda di Halaman Tertentu

Buka template editor anda di blogger 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;goreng&quot;'>
<style>
//CSS dihalaman kategori goreng
</style>
</b:if>
<b:if cond='data:blog.searchLabel == &quot;insum&quot;'>
<style>
//CSS dihalaman kategori insum
</style>
</b:if>
<b:if cond='data:blog.searchLabel == &quot;labelsesuatu&quot;'>
<style>
//CSS dihalaman kategori labelsesuatu
</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;
Ganti bagian yang sudah di tandai dengan kategori yang ada diblog Anda dan terakhir sobat hanya perlu mengisi kode CSS pada bagian yang sudah disediakan untuk mengatur desain tampilan sesuai keinginan.
Next Post Previous Post