Template Mirip Chordfrenzy Untuk Blogger

Advertisement.

Template Mirip Chordfrenzy Untuk Blogger - Kali ini saya ingin membahas topik lain selain Objek Pariwisata Indonesia. Saya ingin berbagi template untuk sahabat blogger yang entah ini melanggar hak cipta atau tidak, saya kurang tahu. Karena Template Chord gitar yang ingin saya bagikan ini saya Desain mirip dengan Chordfrenzy.com, akan tetapi tidak saya samakan persis, karena saya kira akan melanggar hak cipta. Dan template ini hanya saya buat mirip saja, entah bagaimana juga saya tidak tahu kalau mirip melanggar atau tidaknya? oke langsung saja tanpa berbelit-belit lagi, karena tutorial ini mungkin akan cukup panjang.

Demo | Download

Template ini saya beri nama Minimalis Template karena simple, akan tetapi tidak untuk pemasangannya cukup ribet sedikit. Saya akan menerangkannya dari atas sampai bawah.

Untuh Header yang bergambar Gitar bisa sobat ganti dengan Baner blog milih sobat sendiri seperti contoh kalau punya saya Looking Your Eyes. Gambar ukuran berapa saja tidak masalah karena akan otomatis menjadi kecil seperti contoh di atas. langkah pemasangannya :

Langkah Pertama :

1. Login Blogger
2. Masuk Dasbor Blogger Sobat
3. Pilih menu Layout / Widget >> Edit Header >> Upload gambar Baner Blog sobat
4. Centang pada bagian "Instead of title and description"

Langkah Kedua :

Seperti yang sobat lihat, template di atas memiliki ruang Iklan yang cukup banyak dan bisa sobat gunakan untuk memasang iklan atau mau di pasang yang lainnya juga boleh, terserah sobat. Untuk contoh Iklan pada Widget HTML yang ada Pada Header2 dan Header4 serta Widget HTML2 yang terletak di bawah, tepat di atas Footer, untuk sementara bisa di Isi dengan gambar Iklan google yang ada dahulu :

Masukkan Script code di bawah ini kedalam widget HTML Header2/HTML20, Header4/HTML19 dan Widget HTML2 yang terletak di bawah :

<a href='http://yoshiewafa.blogspot.com/' target='_blank'>
<img align='right' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAg20rzWy69aHoO478BiogF2K9_oqCfDivA7QCdppa27oQKf8nIqSIk7DdKhGVYWes1lVnhbfZsWRfwIjoUkw2xCTxmyjAbVhdhj85G0_RCsO4y9J0xRJI-7CuxHOGw-fx40oaAc3EicE/s1600/Contoh+Iklan+Google+yoshiewafa.jpg' width='728'/></a>

Ganti url berwarna biru dengan url blog sobat.

Langkah Ketiga :

Di Dalam template ini sudah tersedia banyak Widget yang tidak saya anjurkan untuk di hapus karena jika dihapus, tampilan tidak akan sempurna. Pada Halaman Homepage bisa sobat lihat di demonya, disitu ada Widget-widget bernama :

Chord Gitar Terbaru >>> (Hanya muncul pada halaman homepage)
Chord Gitar Terupdate >>>  (Hanya muncul pada halaman homepage)
ADS ada 3 widget  >>> (Muncul pada semua halaman blog)
Sitemap Chord Gitar  >>> (Hanya muncul pada halaman homepage)
Sitemap Chord Gitar V 2  >>> (Hanya muncul pada halaman homepage)
Kategori Nama Band  >>> (Hanya muncul pada halaman homepage)
Featured Chord  >>> (Hanya muncul pada halaman homepage)
Facebook  >>> (Hanya muncul pada halaman homepage)
Twitter  >>> (Hanya muncul pada halaman homepage)

Untuk Chord Gitar Terbaru bisa sobat isi dengan script code di bawah ini :

<div style=" height: 544px; overflow: auto; width: auto;">
<script src="http://yoshiwafa-blogspot.googlecode.com/files/recentpost_tanpa_tumbnail.js"></script> <script>var numposts = 17; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script> <script src="http://chordkuncikordgitar.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp" target="_blank"></script>
</div>

Ganti url berwarna biru dengan url blog milik sahabat, var numposts = 17 berfungsi untuk mengatur jumlah Posting yang ingin di munculkan. Fungsi dari script code di atas adalah untuk memunculkan artikel yang baru saja sobat Update.

Chord Gitar Terupdate
Sitemap Chord Gitar
Sitemap Chord Gitar V 2
Featured Chord
Facebook
Twitter
Bisa sobat ganti dengan apa saja, dan hanya untuk contoh bisa sobat isi dengan script code di bawah ini :

<div style=" height: 250px; overflow: auto; width: auto;">
<ul>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
<li><a href='http://yoshiewafa.blogspot.com' target='_blank'>Contoh Saja</a></li>
</ul>
<div/></div></div>

Ganti url berwarna biru dengan url artikel milik sobat. dan tulisan Contoh Saja di ganti dengan judul artikel.

Untuk ADS 300x250 ada 3 biji, untuk sementara dapat sobat isi dengan Script code di bawah ini :

<a href='http://yoshiewafa.blogspot.com/' target='_blank'>
<img align='right' height='250' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv9zkvJV79KCDp6N0zPlnKiFg0S7j5C4FPzH2zyIedj53yccxV96rnV718am1POzFmcRN0sZm_u0P_H8KfZX4kRI1Qcd4sk2SZBLteV-ZvxuszOVn9_cLgjsLQsRM4t2LdCu510QaCaVT_/s1600/Iklan+Google.jpg' width='300'/></a>

Dan kira-kira seperti itulah kurang lebihnya untuk pemasangan pada halaman Homepage dari template ini. tidak begitu sulit bukan? sobat hanya tinggal Edit saja Widget-widget yang sudah ada dan jangan di hapus untuk tampilan yang maksimal, jika di hapus dan di ganti widget yang baru sebenarnya tidak masalah akan tetapi yang berlu sobat lakukan untuk penyempurnaan kembali adalah menggunakan tutorial di bawah ini :

Menampilkan widget hanya di (Homepage) Halaman Utama Blog :

<b:if cond='data:blog.url == data:blog.homepageUrl'>
Kode widget sobat
</b:if>

Menyembunyikan widget yang ada di (Homepage) Halaman Utama Blog :

<b:if cond='data:blog.url != data:blog.homepageUrl'>
Kode widget sobat
</b:if>

Dan sebagai contoh adalah cara menampilkan widget hanya pada Homepage atau halaman utama blog adalah sebagai berikut :

<b:widget id='HTML9' locked='false' title='Judul Widget' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if> <b:include name='quickedit'/>
</b:includable>
</b:widget>

Merah adalah code untuk menampilkan atau menyembunyikan widget dan biru adalah kode widget yang ingin di tampilkan atau di sembunyikan. saya kira cukup jelas ya? kalau kurang jelas bisa bertanya dengan berkomentar di bawah.

Langkah terakhir adalah 3 Widget HTML pada Footer yang tidak muncul pada halaman Homepage akan tetapi hanya muncul pada halaman posting dan label, 3 widget tersebut dapat sobat isi dengan apa saja dan sebagai contoh saja dapat di isi sama dengan Chord Gitar Terupdate atau Iklan.

Dalam segi widget sudah selesai dan sekarang kita lanjutkan ke langkah Edit HTML template, dan yang perlu sobat ganti sudah saya tandai dengan tulisan tertentu seperti Ketik nama Sobat Disini atau Nama Blog Sobat dan lain sebagainya dengat tanda khusus seperti tersebut. Fungsinya adalah agar tidak ada yang eror dalam Template tersebut dan sobat cek di Richsnippets Tools milik google.

Begitulah kira-kira cara pemasangan Template Mirip Chordfrenzy yang saya desain ini sebenarnya adalah pesanan dari seorang teman, akan tetapi dia memperbolehkan jika saya sebarkan template ini secara gratis.

Sekedar Pesan :
Untuk sobat yang mungkin kurang mengerti atau tidak faham dengan penjelasan di atas dapat berkomentar di bawah dan sebisa mungkin saya akan membantu. happy blogging :)