Cara Membuat Dua Kolom di Sidebar Blog

Cara Membuat Dua Kolom di Sidebar Blog

Cara Membuat Dua Kolom di Sidebar Blog - Cara Menambah Kolom di Sidebar Blog - Kali ini saya mau berbagi tips mengenai bagaimana Cara Membuat Dua Kolom di Sidebar Blog, sebagai contoh sobat bisa lihat diblog ini tepatnya di sidebar. mungkin cara ini sudah banyak atau mungkin sobat semua sudah mengetahuinya tapi tidak ada salah nya jika saya ulas kembali.

Baiklah caranya tidak begitu sulit hanya dengan sedikit tambahan kode kita langsung bisa Membuat Dua Kolom di Sidebar Blog untuk lebih jelasnya silahkan ikuti penjelasan berikut :

1. Login terlebih dahulu ke akun blogger sobat.
2. Kemudian klik Template lalu klik Edit HTML
3. Cari kode seperti kode ]]></b:skin> (Gunakan ctrl+f atau tekan F3 untuk mempermudah pencarian).
#kolom-kiri { width: 49%; float: left; }
#kolom-kanan { width: 49%; float: right; }
Untuk Width bisa sobat rubah sesuai keinginan sobat
4. Cari kembali kode seperti kode dibawah
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='PopularPosts3' locked='false' title='Entri Populer' type='Feed'/>
</b:section>
</div>
5. Kemudian, tambahkan kode di bawah tepat di antara kode </b:section> dan </div>.
<b:section class='sidebar' id='kolom-kiri' showaddelement='yes'>
<b:widget id='Text665' locked='false' title='Column 1' type='Text'/>
</b:section>
<b:section class='sidebar' id='kolom-kanan' showaddelement='yes'>
<b:widget id='Text666' locked='false' title='Column 2' type='Text'/>
</b:section>

<div style="clear: both;"></div>
6. Terahir simpan template / save template

Buka blog sobat maka sobat akan bisa langsung lihat hasilnya, mudah-mudahan tips sederhana ini bisa bermanfaat juga berguna

READMORE

Cara Memasang BreadCrumb Pada Blog Blogger

Cara Memasang BreadCrumb Pada Blog Blogger

Cara Memasang BreadCrumb Pada Blog Blogger - Kali ini saya mau share mengenai Tips Cara Memasang BreadCrumb Pada Blog Blogger, BreadCrumb itu sendiri merupakan salah satu teknik SEO yang friendy dan sangat di sukai oleh search engine, dengan memasang BreadCrumb pada blog kita maka robot akan lebih gampang mengcrawl halaman blog kita. Sobat bisa lihat contoh dari pemasangan BradCrumb pada gambar di atas yang saya lingkari warna biru atau sobat bisa juga lihat di atas judul postingan ini.

Dari hasil pemasangan BreadCrumb maka postingan blog kita dari hasil pencarian di search engine akan terlihat seperti berikut :

Langsung aja yu kita praktek Cara Memasang BreadCrumb Pada Blog Blogger tapi sebelumnya sobat backup terlebih dahulu  template sobat untuk menjaga hal yang tidak kita inginkan atau terjadi kesalahan pada saat edit template dan kita sudah punya salinan templatenya, jika sudah ikuti langkah-langkah berikut Cara Pasang BreadCrumb Pada Blog :

1. Seperti biasa masuk terlebih dahulu ke akun blogger sobat.
   
2. Di dashboard tampilan blog baru pilih template --> Edit HTML --> Lanjutkan (jangan lupa centang Expand Template Widget)
3. Cari kode berikut ]]></b:skin> untuk mempermudah proses pencarian sobat bisa tekan Ctrl+F atau tekan tombol F3 pada Keyboard sobat untuk melakukan pencarian.
4. Jika sudah ketemu copy kode dibawah tepat diatas kode ]]></b:skin>
.breadcrumbs { padding:5px 5px 5px 0; margin:0; font-size:95%; line-height:1.5em; border-bottom:4px double #e2e7b4; } .breadcrumbs a { text-decoration:none; color: #000000; }
5. Kemudian cari kode <div class='post hentry'>
6. Lalu copy kode di bawah tepat setelah kode <div class='post hentry'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'><a expr:href='data:blog.homepageUrl'> <b style="color: blue;">Home</b></a> &#187; <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> ,
</b:if> </b:loop> </b:if> &#187; <data:post.title/>
</div> </b:if> </b:if>
7. Setelah selesai klik tombol simpan template
Sobat langsung bisa lihat hasilnya

Mudah-mudahan Tips Cara Memasang BreadCrumb Pada Blog Blogger bisa bermanfaat dan berguna, tips ini dah saya coba dan berhasil 100%.

Selamat Mencoba

Source

READMORE

Cara Merubah Skin FB (Facebook)

Cara Merubah Skin FB (Facebook)

Cara Merubah Skin FB (Facebook) - Kali ini saya mau berbagi tips mengenai Cara Merubah Skin FB (Facebook) biar lebih keren, biar sobat tidak jenuh dengan tempilan yang standar, berikut Cara Mengganti Skin FB (Facebook) agar lebih keren silahkan sobat simak.

Langkah-langkah Cara Mengganti Skin FB (Facebook) :

1. Buka aplikasi modzila firefox terlebih dahulu

2. Setelah diklik maka akan muncul seperti gambar dibawah

3. Kemudian ketik Stylish pada kolom search Add-ons (biasanya berada di pojok atas sebelah kanan)

4. Maka akan muncul seperti gambar di bawah, kemudian pilih Stylish 1.3.1 dan tekan tombol instal (tanda merah).

5. Tunggu beberapa saat sampai proses download selesai, jika sudah selesai sobat klik Restart now

6. Jika proses instalasi sukses maka akan muncul seperti berikut .

dan sobat bisa juga cek di menu Add On kemudian pilih Extensions, disana akan terlihat semua File Add On yang sudah terinstal.

7. Setelah proses instalasi sukses dan berhasil, tahap selanjutnya silahkan sobat masuk ke www.fbskin.com untuk memilih kategory skin sesuai keinginan sobat.

8. Pilih dan klik salah satu Layout Category sesuai selera sobat, disini saya ambil contoh dengan memilih kategori Musik.
9. Jika sudah diklik maka akan muncul beberapa pilihan skin sesuai kategori yang kita pilih tadi. Berhubung saya memilih kategori Music maka yang muncul pastinya berhubungan dengan musik, baik itu penyanyi, band dll. Disini saya memilih salah satu band pavorit saya Slipknot. jangan lupa klik tombol Download

10. Maka akan muncul seperti gambar berikut kemudian copy semua code yang tertera seperti gambar di bawah.

11. Jika sudah di copy semua code tadi kemudian kita kembali ke menu Tools - Add Ons lalu klik User Styles, terahir kita klik Write New Style.

atau sobat bisa lihat di bawah tampilan Stylish yang sudah kita instal tadi

12. Setelah kita klik Write New Style maka akan muncul seperti gambar di bawah, kemudian pastekan semua code yang kita copy tadi, tulis Nama dan Tag sesuai keinginan sobat, jika sudah klik tombol save.

13. Sobat bisa langsung cek dengan membuka akun Facebook sobat..
14. Selesai.

Sebagai tambahan sobat bisa menambahkan, merubah ataupun menghapus skin fb sobat yang di buat, mudah-mudahan Cara Merubah Skin FB (Facebook) bisa bermanfaat juga berguna.

Terimakasih

Source

READMORE

Cara Buat Dua Kolom Widget Di Bawah Postingan Blog

Cara Buat Dua Kolom Widget Di Bawah Postingan Blog

Cara Buat Dua Kolom Widget Di Bawah Postingan Blog - Tips kali ini yang akan saya share adalah cara membuat 2 (dua) buah kolom widget berada di bawah postingan, sobat bisa lihat contohnya di bawah postingan ini, seandainya sobat berminat untuk menambahkan 2 kolom di bawah postingan silahkan sobat ikuti langkah-langkahnya dibawah.

Untuk menghindari hal yang tidak kita inginkan, lakukan backup template dulu sebelum melakukan pengeditan terhadap template, karena seandainya terjadi kesalahan kita sudah punya salinan template kita.

Berikut Cara Buat Dua Kolom Widget di Bawah Postingan :

1. Masuk terlebih dahulu ke akun blogger sobat
2. Kemudian pilih Template --> Edit HTML --> Lanjutkan
3. Jika sudah muncul tampilan Template Edit HTML sobat centang Expand Template Widget
4. Langkah selanjutnya sobat cari kode ]]></b:skin> untuk mempermudah sobat bisa tekan Ctrl+F atau tekan tombol F3 pada Keyboard sobat untuk melakukan pencarian.
   
5. Jika sudah ketemu copy kode dibawah tepat diatas kode ]]></b:skin>
.creativekolom {{margin:5px 0px 10px 0px;padding:5px 0;clear:both;}} .bawahkiri {float:left;width:47%;margin-right:5px;border: 1px solid #ccc; padding: 5px; background: #ffffff;-moz-border-radius:5px; -webkit-border-radius: 5px; border-radius: 5px;} .bawahkanan {float:right;width:47%;border: 1px solid #ccc; padding: 5px; background: #ffffff;-moz-border-radius:5px; -webkit-border-radius: 5px; border-radius: 5px;}
6. Langkah selanjutnya sobat cari kode <data:post.body/>
7. Jika sudah ketemu sobat Copy kode dibawah tepat dibawah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'> <div class='creativekolom'> <div class='bawahkiri'> Simpan tulisan atau Kode Script yang sobat kehendaki di sini -> Untuk kolom sebelah kiri </div> <div class='bawahkanan'> Simpan tulisan atau Kode Script yang sobat kehendaki di sini  -> Untuk kolom sebelah kanan </div> </div> </b:if>
8. Silahkan sobat klik tombol pratinjau terlebih dahulu untuk mengetahui apakah ada kesalahan atau tidak.
9. Seandainya tidak ada masalah sobat tinggal klik tombol Simpan Template.
10. Untuk contoh hasilnya sobat bisa lihat 2 kolom tambahan di bawah postingan ini.

Untuk tulisan yang dikasi warna merah boleh sobat rubah sesuai kebutuhan atau sesuai dengan template sobat, mungkin cukup sekian dulu tips kali ini mudah-mudahan Cara Buat Dua Kolom Widget Di Bawah Postingan Blog bisa bermanfaat dan berguna.

Selamat Mencoba

Sumber

READMORE

Cara Membuat Fanspage Facebook Pada Blog

Cara Membuat Fanspage Facebook Pada Blog

Cara Membuat Fanspage Facebook Pada Blog - Saya mau share Cara Membuat Fanspage Facebook Pada Blog sebenarnya tips ini memang sudah banyak yang tahu meskipun demikian tidak ada salahnya saya bahas kembali Cara Membuat Fanspage Facebook Pada Blog, mudah-mudahan bisa berguna..

Berikut Cara Pembuatan Fanspage Facebook Pada Blog saya jelaskan beserta gambar agar sobat bisa lebih paham dan mengerti tentang penjelasan yang akan saya berikan.

Langkah pertama adalah masukan alamat berikut di address bar sobat untuk masuk ke Facebook page create https://www.facebook.com/pages/create.php jika sudah maka akan muncul seperti gambar dibawah :

Kemudian klik Merek atau Produk (Lihat tanda gambar diatas), setelah kita klik Merek atau Produk maka akan muncul seperti gambar di bawah :

Klik Pilih kategori dan cari kategori Situs Web kemudian diklik lalu tulis nama Fanspage yang akan sobat buat pada kolom kosong Nama Merek atau Produk jika sudah jangan lupa centang pada kotak kecil disamping Saya setuju dengan ketentuan Halaman Facebook (lihat gambar dibawah) lalu sobat tinggal pijit tombol Mulai.

Langkah selanjutnya sobat akan masuk ke Menu Pengaturan, sobat tinggal mengisi atau lengkapi beberapa pengaturan seperti Foto Profil untuk Foto Profil Fanspage sobat, tentang dan alamat web facebook. Sobat juga bisa langsung klik tombol Lewati seandainya sobat mau langsung ke Halaman Fanspage sobat tanpa mengisi data di Pengaturan.

Sekarang kita buat tombol like untuk Fanspage Face book, silahkan sobat copas alamat berikut di address bar web browser sobat http://developers.facebook.com/docs/reference/plugins/like-box/ maka akan muncul seperti gambar berikut :

Keterangan :
• Facebook Page URL : Ganti dengan URL fanspage yang tadi sobat buat.
• Widht : Untuk lebar tampilan fanspage sobat, sesuaikan lebar dan ukuran fanspage sobat dengan blog sobat.
• Height : Untuk tinggi widget fanspage sobat, sesuaikan dengan kebutuhan sobat
• Color Scheme : Untuk warna background fanspage sobat, sobat bisa memilih warna hitam atau putih sesuai selera sobat.
• Show Face : Jika sobat ingin menampilkan photo-photo para liker fanspage sobat, jika ingin ditampilkan sobat tinggal centang kotak kecil dibawah Show Faces
• Border Color : Untuk memberikan warna pada garis kotak fanspage sobat, contoh isikan warna red pada kotak kosong dibawah Border Color, hasilnya garis kotak fanspage sobat akan berwarna merah.
• Show Stream : Untuk menampilkan informasi/posting terakhir di like box, jika ingin ditampilkan sobat tinggal centang kotak kecil dibawah Show stream.
• Show Header : Untuk menampilkan header fanspagenya sobat, sobat tinggal centang kotak kosong dibawah Show header, jika tidak ingin ditampilkan sobat biarkan kotak tersebut kosong tanpa di centang.

Jika semuanya sudah di seting sobat tinggal klik tombol Get Code, maka akan muncul seperti gambar berikut :

Copy script kode JavaScriptSDK pada kolom no. 1 paste di bawah tag <body> pada template sobat, Caranya bukan akun blogger sobat kemudian klik menu template, pilih Edit Html kemudian pilih lanjutkan nah kemudian sobat cari kode <body> sobat bisa gunakan mode pencarian (Ctrl+F) untuk mempermudah pencarian, jika sudah ketemu tinggal copas kode tadi.

Langkah selanjutnya klik menu Tata Letak kemudian Tambah Gadget dan pilih HTML/JavaScript, copas kode kolom yang kedua (no.2) di menu HTML/JavaScript jika sudah pijit tombol simpab lalu simpan setelan.

Selesai deh Cara Membuat Fanspage Pada Blog, mudah-mudahan tips ini bisa bermanfaat dan berguna.

Terimakasih

Source

READMORE

Membuat Link Color Pelangi

Membuat Link Color Pelangi

Kali ini saya mau share mengenai tips cara membuat Link Color Rainbow, tips ini sangat mudah untuk dipraktekan langsung aja yu kita praktek.

Berikut adalah langkah-langkah untuk membuat Link Color Pelangi :

1. Login terlebih dahulu di blogger
2. Klik menu tab Rancangan
3. Lalu pilih Edit Html (centang Expand Template Widget)
4. Cari script </head> (biar gampang gunakan Ctrl+F untuk pencarian)
5. Copy script dibawah tepat diatas kode </head>
<script src='https://sites.google.com/site/creativoltz/home/creativoltzrainbow.js'> </script>
6. Jika sudah jangan lupa Save Template

Untuk melihat hasilnya silahkan sobat dekatkan kursor mouse pada sebuah link aktif, jika berhasil link tersebut akan berubah-rubah warnanya.

Mudah-mudahan tips sederhana ini bisa bermanfaat, selamat mencoba dan terimakasi.

Wenkz@Creativoltz

READMORE