buat blog bergaya majalah

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by mukhammad nur Rabu, 20 Juli 2011 2 komentar

Membuat Blog Bergaya Magazine Style Template

Semenjak kemunculan Wordpress Theme bertajuk Magazine Style Theme, sebut saja Mimbo Theme,Revolution ThemeArthemia Theme, dan banyak lagi yang lainnya, seakan ada trend baru dalam membuattheme atau template yaitu mengadopsi Magazine Style Theme atau Magazine Style Template. Salah satu korban nyata atas trend tersebut adalah Kang Rohman sendiri Big Grin, pada dua template yang release paling akhir kang Rohman beri nama magazine Template walaupun keduanya belum benar-benar mengadopsi Magazine Style Template
Ciri khas dari magazine style template adalah ada kolom atau isi dari blog tersebut yang bisa hilang di saat kita membaca keseluruhan artikel atau bahkan sebaliknya yaitu ada kolom yang tadinya tidak muncul menjadi muncul.
Apakah template blogger bisa memakai sistem  seperti itu? jawabannya adalah bisa. Coba lihat contohnya dihttp://magazine-1.blogspot.com  silahkan perhatikan semua widget yang ada, kemudian klik pada tombol Read Full story, dan yang terjadi adalah ada sebagian widget yang menghilang dari pandangan, dan begitupun sebaliknya ada yang tadinya tidak muncul menjadi muncul (sidebar bawah).
Teknik yang di gunakan sangatlah sederhana, anda tinggal membubuhkan kode tambahan pada widget yang ingin di hilangkan atau bahkan di munculkan, berikut adalah kode tambahannya :

Muncul menjadi tidak muncul :
 <b:if cond='data:blog.url == data:blog.homepageUrl'>
Widget yang ingin di hilangkan
</b:if>

Tidak muncul menjadi muncul :
 <b:if cond='data:blog.pageType == "item"'>
Widget yang ingin di di munculkan
</b:if>

Sebagai contoh, silahkan anda lihat kode template anda. anda akan melihat kode yang mirip seperti kode di bawah ini :

<div id='sidebar'>
<b:section class='sidebar' id='sidebar' preferred='yes'> 
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/> 
<b:widget id='HTML7' locked='false' title='Get Update Via Email' type='HTML'/> 
<b:widget id='HTML1' locked='false' title='' type='HTML'/> 
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/> 
<b:widget id='Label2' locked='false' title='Browse by Categories' type='Label'/> 
<b:widget id='HTML2' locked='false' title='Site Info' type='HTML'/> 
</b:section> 
</div>
Satu kode widget seperti :
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/>
Kode seperti di atas berarti mewakili satu widget atau Gadget yang kita pasang di sidebar atau di footer. Widget tersebut akan muncul di halaman depan blog anda. Apabila pada template biasa pada umumnya,walaupun di klik menu read more atau baca selengkapnya, widget –widget tersebut akan selalu muncul. Jika anda menambahkan kode yang saya tulis di atas, maka widget tersebut akan tidak tampil, contoh :

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/>
</b:if>

Itu jika untuk satu widget saja, jika anda mempunyai widget banyak yang berderet kebawah dan ingin menyembunyikan semuanya, maka kode yang di pasang seperti ini :
<div id='sidebar'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:section class='sidebar' id='sidebar' preferred='yes'> 
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/> 
<b:widget id='HTML7' locked='false' title='Get Update Via Email' type='HTML'/> 
<b:widget id='HTML1' locked='false' title='' type='HTML'/> 
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/> 
<b:widget id='Label2' locked='false' title='Browse by Categories' type='Label'/> 
<b:widget id='HTML2' locked='false' title='Site Info' type='HTML'/> 
</b:section>
</b:if> 
</div>

Itu untuk membuat widget dari yang muncul menjadi menghilang. Jika untuk yang dari yang tidak muncul menjadi muncul lumayan sedikit repot karena anda harus membuka expand template anda terlebih dahulu dengan memberi tanda ceklis pada kotak kecil di samping tulisan Expand Template Widget. Contoh, jika anda belum membuka expand widget template, kode widget akan terlihat seperti ini :
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/>

Maka jika setelah di expand akan terlihat seperti ini (perhatikan judul widgetnya) :
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'> 
<b:includable id='main'> 
  <!-- only display title if it's non-empty --> 
  <b:if cond='data:title != &quot;&quot;'> 
    <h2 class='title'><data:title/></h2> 
  </b:if> 
  <div class='widget-content'> 
    <data:content/> 
  </div>
  <b:include name='quickedit'/> 
</b:includable> 
</b:widget>

Jika widget tersebut tidak ingin tampil di halaman depan, kemudian ingin tampil apabila masuk halaman artikel, maka anda harus menambahkan kode seperti ini :
<b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'> 
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'> 
  <!-- only display title if it's non-empty --> 
  <b:if cond='data:title != &quot;&quot;'> 
    <h2 class='title'><data:title/></h2> 
  </b:if> 
  <div class='widget-content'> 
    <data:content/> 
  </div>
  <b:include name='quickedit'/>
</b:if> 
</b:includable> 
</b:widget>
Jangan lupa untuk klik tombol SIMPAN TEMPLATE dan nikmati tampilan blog anda yang bergaya Magazine style Template.

At wits end Bingung.. bingung… bingung, kang Rohman suka bikin bingung orang, kalau bikin tutor setengah-setengah begitu Angry . Eithhh.. tenang dulu donk, kan belum selesai, artikel nya saja belum saya tutup. Bagi anda yang masih bingung dengan keterangan di atas, coba langkah-langkah di bawah ini :
Untuk Widget muncul kemudian menghilang
  1. Login ke blogger dengan ID anda.
  2. Klik Tata Letak
  3. Klik tab Edit HTML
  4. Silahkan klik tulisan Download Template Lengkap. Silahkan di backup dulu templatenya (penting!)
  5. Cari kode yang mirip seperti ini di template anda :
    <div id='sidebar'>
    <b:section class='sidebar' id='sidebar' preferred='yes'> 
    <b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/> <b:widget id='HTML7' locked='false' title='Get Update Via Email' type='HTML'/> 
    <b:widget id='HTML1' locked='false' title='' type='HTML'/> 
    <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/> 
    <b:widget id='Label2' locked='false' title='Browse by Categories' type='Label'/> 
    <b:widget id='HTML2' locked='false' title='Site Info' type='HTML'/> 
    </b:section> 
    </div>
  6. Pilih widget mana yang mau di sembunyikan, kemudian tambahkan kodenya, contoh :
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'/>
    </b:if>
  7. Klik tombol SIMPAN TEMPLATE
  8. Selesai.

Untuk Widget Menghilang kemudian muncul
  1. Login ke blogger dengan ID anda.
  2. Klik Tata Letak
  3. Klik tab Edit HTML
  4. Beri tanda ceklis pada kotak di samping tulisan Expand Template Widget, tunggu beberapa saat sampai proses selesai.
    expand-template
  5. Cari kode widget yang mau anda modifikasi, contoh :
    <b:widget id='HTML8' locked='false' title='Blog Tutorial Untuk Pemula' type='HTML'> 
    <b:includable id='main'>
    <b:if cond='data:blog.pageType == "item"'> 
      <!-- only display title if it's non-empty --> 
      <b:if cond='data:title != &quot;&quot;'> 
        <h2 class='title'><data:title/></h2> 
      </b:if> 
      <div class='widget-content'> 
        <data:content/> 
      </div>
      <b:include name='quickedit'/>
    </b:if> 
    </b:includable> 
    </b:widget>
  6. Klik tombol SIMPAN TEMPLATE.
  7. Selesai.

Mudah-mudahan dapat dengan mudah di fahami, selamat bereksperimen!
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul: buat blog bergaya majalah
Ditulis oleh mukhammad nur
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://cintafido.blogspot.com/2011/07/buat-blog-bergaya-majalah.html. Terima kasih sudah singgah membaca artikel ini.

2 komentar:

LutFiiy Lavhalitya mengatakan...

hehe, kalo yg ini udah diterapin alhamdulillah .... aku mau nanya, agar home < beranda> blog tidak ikut kocarkacir karena blogazine gimana caranya ya...

coba mengatakan...

kalo kocar kacir yaaa di pungut aja ckckckkc...
coba isi nama lengkap anda :
tngl lahir :
status :
pekerjaan :
suka pada alam ?
suka pada manusia ?
hahahahahahha cepat sebelum terlambat wkwkwkwkkw

Posting Komentar

Panduan blog dan SEO support Online Skill - Cinta fido Fido | Kopi kanan Akherat | Kisah Nabi Muhammad | Sahabat | Belajar Blogger | Template | HTML | Tutorial | Komputer.

investasi semoga anda senang

kurs mata uang BCA-2


Selamat datang di blog cinta fido, semoga anda diberi keSehatan oleh alloh SWT

Islam itu Cinta Damai Agama Islam Cinta Damai
jihad Damai adalah amal kebaikan yang Allah perintahkan dan menjadi sebab kokoh dan kemuliaan umat islam