Membuat setiap halaman berbeda

Ada salah seorang sobat kita bertanya bagaimana cara membuat halaman postingan berbeda-beda?dan membuat halamn depan di blogger?
dan saya mencoba memcahkan nya dari beberapa nara sumber yg ada,mungkin membuatan halaman depan di blog saya salah tapi beberapa sobat ada juga yg pengen tahu cara bikin nya,dan ini bukan copas ^_^
membuat setiap halaman berbeda-beda ini yg saya ketahui mempunyai 2 cara,dan sobat harus memahami setiap css yg di pakai di template blog sobat
dan cara pertama melalui Edit HTML di postingan : sobat letak kan style css nya di box postingan dan sobat tidak perlu lagi menggunakan kode <b:if cond='data:blog.url == &quot;alamatpostingan&quot;'> ini ,
cukup di mulai dari <style> dan di tutup dengan </style> seperti ini :

Copy Codeprint?

1. <style>  
2.     body{background:#red;}  
3.     #content {width:820px;}  
4.     #sidebar-wrapper{display:none !important}  
5.     #footer{display:none !important}  
6.     #html2 {display:none !important}  
7. </style>  
8.   
9. <---TEMPAT SCRIPT JQUERY --->  
10. <script src="jquery/1.4.4/jquery.min.js">  
11. </script>  
12.       

<style>
    body{background:#red;}
    #content {width:820px;}
    #sidebar-wrapper{display:none !important}
    #footer{display:none !important}
    #html2 {display:none !important}
</style>

<---TEMPAT SCRIPT JQUERY --->

    

cara kedua menempatkan css di template dengan kode :

Copy Codeprint?

1. <b:if cond="data:blog.url == "alamatpostingan""><style>  
2.    <---KODE CSS DI SINI--->  
3.      
4. </style></b:if>  
5.       

Atau sobat pengen melebarkan area content nya silahkan sobat cari tag css di template sobat buat melebar kan area content template,setiap template mempunyai kode - kode css yg berbeda kalau di template saya menggunakan tag css seperti ini #content-area ,mungkin di template blog sobat kode css buat melebarkan content area(lebar postingan)nya menggunakan kode: .content,#content,div#content,#content-wrapper,#post-wrapper atau yg lain2 nya,silahkan sobat cari sendiri apa yg menjadi fungsi buat melebarkan area content di template blog sobat kalau sobat sudah mengetahui tag css di template sobat ,sekarang kita mulai  untuk melebarkan content halaman postingan ,tadi yg di atas kita mebuat background di halaman tersebut menjadi merah(red)
sekarang kita mulai  melebarkan area content nya,maka kode yg di gunakan seperti ini :

Copy Codeprint?

1. <b:if cond="data:blog.url == "alamatpostingan""><style>  
2. body{background:#red;}  
3.  #content {width:820px;}  
4. </style></b:if>  
5.       

<style>
body{background:#red;}
 #content {width:820px;}
</style>
    

atau sobat pengen menghilangkan sidebar,footer,widget,atau yg lain-lain,
sobat gunakan{display:none !important}untuk widget sobat harus tau tag id dari widget tersebut misal nya id widget sobat Html1 atau Html2 lalu sobat merapkan di css seperti ini #html2 {display:none !important}

• Contoh nya :

Copy Codeprint?

1. <b:if cond="data:blog.url == "alamatpostingan""><style>  
2.         body{background:#red;}  
3.          #content {width:820px;}  
4.          #sidebar-wrapper{display:none !important}  
5.         #footer{display:none !important}  
6.         #html2 {display:none !important}  
7.           
8. </style></b:if>  
9.       

<style>
        body{background:#red;}
         #content {width:820px;}
         #sidebar-wrapper{display:none !important}
        #footer{display:none !important}
        #html2 {display:none !important}
        
</style>
    

kalau sobat mau bikin menu di halamn tersebut penerapan nya gini:

Copy Codeprint?

1. <b:if cond="data:blog.url == "alamatpostingan"">  
2.     <style>  
3.     ..................................... .  
4.     di sini letak css menu nya  
5.     #menu {....}  
6.     #menu li{....}  
7.     #menu li a{...}  
8.     ........................................  
9.       
10. </style>  
11.     ....................................... .  
12.     di sini letak buat kode html buat pemanggil css menu nya nya.  
13.     <ul class="menu">  
14. <li><a href="http://www.blogger.com/...">...</a></li>  
15. <li><a href="http://www.blogger.com/...">...</a></li>  
16. <li><a href="http://www.blogger.com/...">...</a></li>  
17. <li><a href="http://www.blogger.com/...">...</a></li>  
18. >  
19.     ..........................................  
20.     </b:if>  
21.       

    <style>
    ..................................... .
    di sini letak css menu nya
    #menu {....}
    #menu li{....}
    #menu li a{...}
    ........................................
    
</style>
    ....................................... .
    di sini letak buat kode html buat pemanggil css menu nya nya.
    <ul class="menu">
...
...
...
...
>
    ..........................................
    
    

dan seterus nya kalau sobat pengen menghilangkan atau mengedit css,widget,sidebar,area content,atau apa aja yg ada di template sobat cara nya seperti itu,penerapan di halaman depan juga seperti di atas,inti nya
Platform blogger itu memiliki halaman-halaman yg berbeda,dimana setiap halaman digunakan untuk menempatkan postingan dengan tujuan tertentu. Selain halaman content atau posting (entri), sobat dapat membuat artikel berupa page (laman).dan cara edit css nya seperti yg di tunjukan di atas Halaman page ini memiliki sifat berbeda dengan posting, diantaranya:

   1. Bersifat static, maksudnya halaman tidak diurutkan berdasarkan waktu.
   2. Halaman banyak digunakan untuk menampilkan informasi tertentu, seperti contact person, about us, sitemap, dan sebagainya.
   3. Biasanya untuk mengakses halaman ini juga anda dapat menambahkan gadget baru yang hanya tampil pada halaman page ini.

Begini kesimpulannya, setiap halaman yang ada di blogger memiliki karakteristik masing-masing. Berikut saya paparkan saja setiap halaman yang terdapat di blogger secara keseluruhan:

   1. Homepage merupakan halaman utama blog anda, yakni halaman depan blogger.
   2. Archivepage adalah halaman arsip blogger.
   3. Itempage adalah halaman postingan yang diurutkan berdasarkan waktu penulisan.
   4. Indexpage adalah halaman muka, halaman label, dan halaman pencarian.
   5. Staticpage adalah feature baru google yakni halaman yang tidak masuk pada postingan yang telah saya jelaskan tadi.
   1. Homepage merupakan halaman utama blog anda, yakni halaman depan blogger.
   2. Archivepage adalah halaman arsip blogger.
   3. Itempage adalah halaman postingan yang diurutkan berdasarkan waktu penulisan.
   4. Indexpage adalah halaman muka, halaman label, dan halaman pencarian.
   5. Staticpage adalah feature baru google yakni halaman yang tidak masuk pada postingan yang telah saya jelaskan tadi.
ini ada beberapa kode buat template mungkin ada guna nya buat sobat:


Menampilkan widget hanya di Homepage

Copy Codeprint?

1. <b:if cond="data:blog.url == data:blog.homepageUrl"><style>  
2.         .......isi css......  
3.           
4. </style></b:if>      

Menampilkan widget selain di Homepage

Copy Codeprint?

1. <b:if cond="data:blog.url != data:blog.homepageUrl"><style>  
2.         .......isi css......  
3.           
4. </style></b:if>  

Menampilkan widget hanya di Archivepage

Copy Codeprint?

1. <b:if cond="data:blog.pageType == "archive""><style>  
2.         .......isi css......  
3.           
4. </style></b:if>   

Menampilkan Widget selain di Archivepages

Copy Codeprint?

1. <b:if cond="data:blog.pageType != "archive"">  
2.         .......isi css......  
3.         </b:if>  

.......isi css......
        

Menampilkan Widget hanya di Itempages / Postingan

Copy Codeprint?

1. <b:if cond="data:blog.pageType == "item""><style>  
2.         .......isi css......  
3.           
4. </style></b:if>    

Menampilkan widget selain di Itempages

Copy Codeprint?

1. <b:if cond="data:blog.pageType != "item""><style>  
2.         ..........................  
3.           
4. </style></b:if>  

Menampilkan widget hanya di Staticpages

Copy Codeprint?

1. <b:if cond="data:blog.pageType == "static_page"">  
2.         .......isi css......  
3.         </b:if>   

.......isi css......
         

Menampilkan widget selain di Staticpages

Copy Codeprint?

1. <b:if cond="data:blog.pageType != "static_page""><style>  
2.         .......isi css......  
3.           
4. </style></b:if>  

Menampilkan widget pada URL atau halaman tertentu

Copy Codeprint?

1. <b:if cond="data:blog.url == "alamatpostingan""><style>  
2.         .......isi css......  
3.           
4. </style></b:if>  

Menampilkan widget selain di URL atau halaman tertentu

Copy Codeprint?

1. <b:if cond="data:blog.url != "alamaatpostingan""><style>  
2.         .......isi css......  
3.           
4. </style></b:if>