BloonOnline GoTemplatez VersiEdan
Facebook Twitter You Tube Friendfeed
Blog Seo Intermezo

Bikin Blog Lebih Dinamis

kali ini saya akan menulis bagaimana blog kita biar lebih dinamis lagi, atau sedikit merasakan pengelola-an  halaman blog gaya website berbasis content manajemen sistem (CMS). 

terutama mengelola elemen  yang ada di halaman depan blog  berbeda penampilanya dengan halaman yang di buka.

Untuk lebih jelasnya silahkan saudara pilih  salah satu judul tulisan yang ada pada blog ini.kemudian saudara perhatikan perubahan tampilan di bagian sidebarnya. Maka elemen profile, shoutbox dan recent komentar akan menghilang. Sedang elemen lain, yaitu elemen feed yang saya beri judul Template, tiba-tiba Tampak pada halaman yang di buka.

Coba kembali kebagian halaman utama tekan tab menu bertuliskan Home di bagian atas.
Berbeda bukan ? pada hal saya lakukan ini pada satu blog, dan tak perlu membuat blog baru lagi.

Gaya page dinamis ini sangat cocok sekali, bagi blog yang contentnya ingin menampilkan banyak link seputar ilmu pengetahuan, kumpulan tutorial dsb. juga sangat cocok bagi saudara yang ingin menampilkan diri anda dan kesukaannya.- artinya dari pada bernafsu memasang semua  elemennya pada halaman muka, lebih baik jika di bagi pada halaman lainnya.- tinggal kita pandai-pandai memilah dan memilah, elemen mana yang cucok di tampilkan pada halaman depan, dan elemen mana yang pas buat tampil di halaman selanjutnya.

Cara Install.

untuk menginstall-nya ke dalam blog sangatlah mudah, kita hanya menambahkan dua baris kode pada setiap halaman elemen yang di tambahkan atau yang terpasang.

Pertama : Menampilkan elemen hanya ada pada halaman frontpage atau halaman depan.

Pilih salah satu elemen yang hanya tampil di halaman depan blog, misalkan saya memilih elemen text  kemudian buka Template->Edit Html dan jangan lupa tandai kotak kecil di samping tulisan Expand Template Widget. kemudian cari tulisan atau kode elemen Text1. setelah ketemu tambahkan dan letakan dua baris kode pada posisi seperti tulisan yang saya  beri warna.

<b:widget id="Text1" locked="false" title="" type="Text">
<b:includable id="main">
<b:if cond="data:blog.url == data:blog.homepageUrl">

<!-- only display title if it's non-empty -->
<b:if cond="data:title != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>

<div class="widget-content">
<data:content>
</data:content>
</div>
</b:if>

<b:include name="quickedit">  

</b:includable>
</b:widget>

Kedua : Menampilkan elemen hanya ada pada halaman selanjutnya.

Setelah kita memilih elemen mana yang akan tampil pada halaman selanjutnya, lakukan seperti langkah pertama. kemudian tambahkan dan letakan dua baris kode pada posisi seperti di bawah ini.

<b:widget id="Text1" locked="false" title="" type="Text">
<b:includable id="main">
<b:if cond='data:blog.pageType == "item"'>

<!-- only display title if it's non-empty -->
<b:if cond="data:title != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>

<div class="widget-content">
<data:content>
</data:content>
</div>

<b:include name="quickedit">

</b:if>   

</b:includable>
</b:widget>

Mencari kode elemen atau widget.

Perlu saudara ketahui setiap menambahkan sebuah elemen   secara default blogger telah memberi nama sesuai dengan elemennya. misalkan elemen Html/javascript di namai Html, elemen Daftar Link di namai LinkList, elemen Teks di namai text, Label di namai label. dst.
Dan setiap menambahkan elemen yang sama misalkan elemen text, maka blogger menemainya dengan Text1, Text2, Text3 dst. Html/javascript jadi Html1, Html2,Html3 dst.

Atau agar mudah mencari elemen yang kita tambahkan, bagusnya saudara memberikan judul pada setiap elemen. misalkan untuk elemen daftar liks atau linklist dengan judul bloggrol dst.

Mudah bukan smile_sad

Sumber tulisan dari :

1. adding-front-page-to-your-blog by Hoctro's place

2. related-posts by purplemoggy

Technorati tags: ,
Page views this post: reader

19 komentar:

ridbay said...

info berguna nih, buat yg lagi belajar kayak saya.

lam kenal, link balik ya, udah ta taro duluan link nya

remixstation said...

Hello friend, You create a nice blog... my blog.. http://www.softwarecomplex.blogspot.com/ Thanks for the comment in my blog.
http://iearnmoneyhelper.blogspot.com/
Contact me.. I will show how to earn money with your blog.. I have some easy ideas... my mail is nanthan.smix@gmail.com. I am earning more than 500$ per month.

have a nice day

utha_de_hikaru said...

duh..pas blogger ganti layout pake format xml...gw jadi gak ngerti pasang widget.ngga bisa asal gitu.mesti bikin format icnludable apalah.sumpha,gw ngga ngerti.bantu gw dong.send me email ya?^^
utha_de_hikaru@yahoo.co.id

dheXjhe said...

tahnx berat y, ilmunya...soalx sy gy blajar ne...tetp sharng2 ilmunya.

tukeran link juga y sm sy!

internetworkwireless.blogspot.com/

subagya said...

wekekekekkeke..... siiip... di cobain ah..

Meubel dan Souvenir said...

sip buat tips-nya... butuh pencerahan mohon dibantu

kojek said...

mantaf triknya, akan saya coba bro

just4share said...

mantap bro elmunya,

Kojek said...

Terimakasih bro, aku berhasil mengatur elemen halaman jadi lebih dinamis, dan loading pagenya lumayan ngebut jadinya, mampir donk bro ....

Radith Prawira said...

kang kalo mo "nge-hide" header piye carane?

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='me, my words, my blog (Header)' type='Header'/>
</b:section>
</div>

JALOE said...

@ Radith Prawira

tambahin saja di kode css na.. contoh

#header-wrapper; display:none; atau hidden.

Radith Prawira said...

Dahsyat! cpt bgt kang balesnya.. hatur nuhun.. ^_^ hooh, tp kalo begitu kan jadinya di frontpage jadi nda keluar headernya, maunya saya header itu sembunyi kalo di selain frontpage.. maaf kang ga jelas td nanyanya.. :Peace:

JALOE said...

@ Radith Prawira

ooo masukan saja kode ini

<b:if cond="data:blog.url == data:blog.homepageUrl">

di atas kode yg ente tulis itu.. dan jangan lupa di akhiri dengan penutupnya </b:if>

hasilnya seperti ini kira2

<b:if cond="data:blog.url == data:blog.homepageUrl">

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='me, my words, my blog (Header)' type='Header'/>
</b:section>
</div>
</b:if>

Radith Prawira said...

Thx bgt kang.. rebes dah sekarang :D td ane salah berarti naro kodenya, hehehehe, *masih saja berkutat ngutak-ngatik template tanpa mengupdate blog :hammer:

Anonymous said...

Siap boz

iwan kurniawan said...

Kang kok kotak widgetnya masih keliatan?
gmana cara ngilanginnya???
(contohnya liat blogku aj)

ireng_ajah said...

Pada cara pertama : Menampilkan elemen hanya ada pada halaman frontpage atau halaman depan

Ada dua kode yang bisa digunakan. Perbedaan terdapat pada klik Kategori Post / Label dan klik readmore (membaca artikel secara keseluruhan)

lebih lanjut, klik disini

Dody said...

Mas Makasih Buanyak
Berkat Dari Sini Blog Saya yg awalnya ga ada apa2nya
Sekarang dah Banyak Tambahannya
Tapi saya Rasa Buanyak Kekurangannya
Tolong Kasih Saya Masukan Donk Mas
Thanks b4 ya Mas

Ini Alamat Blog Saya Mas : http://dody-ptcitsmylive.blogspot.com/

Ahmad Choirun Najib said...

makasih mas atas infonya ,,,,thank's

Post a Comment

" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah

Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"

Makacih Atas Komentar-Nya

 

Copyright 2009. Home | Serba Serbi Google | XHTML | CSS Design by Catalog-Tutorial