Cara Membuat Widget Twitter Follow Us Melayang di Blogger/Blogspot

Konsep widget ini sama dengan tombol back to top melayang Blogger beberapa waktu yang lalu, yaitu dengan memberikan styling CSS: fixed position dan scrolling display pada link gambar untuk memberikan efek melayang.

Cara membuat/memasang:

1. . Masuk ke dashboard > Design/Rancangan > Klik Add a Gadget

2. Setelah pop up window muncul, pilih opsi HTML/Javascript

3. Kemudian copy kode berikut:

<br/><a style="display:scroll;position:fixed;bottom:200px;right:1px;" href="http://twitter.com/azmisurvivor target="_blank"><img style="border:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi04bOVXO9sffh640Y9-QUud9h5ERLrEfx4iIGM4g7patIPY39WB5PJAXxwY3-Le0k1jgBDfHucIFadtFQbw-vraoHBRCpbhCUT8K44MNduWqvNZW0MbdorZhVdtfOkVpksZzDqA1tcveld/s1600/floatingtwitter.png" /></a>

Ganti azmisurvivor dengan  nama account Twitter anda. Jika anda ingin widget berada di sebelah kiri browser, ganti right dengan left.

4. Paste kode yang sudah di edit ke kolom configure HTML/Javascript.

 

5. Klik save.

6. Refresh blog dan lihat hasilnya.

Done and cheers!

Sumber : buka-rahasia.blogspot.com

Terima kasih Sudah berkunjung
<a href="https://ayibagus-spc.blogspot.com/2012/07/cara-membuat-widget-twitter-follow-us.html">Cara Membuat Widget Twitter Follow Us Melayang di Blogger/Blogspot</a>

ayib adam al-mahjub - 10.19

Read More

Cara Membuat Spoiler di Blogger/Blogspot

Tips dan trik membuat spoiler ini sebenarnya sudah banyak yang posting dan share. Akan tetapi, tidak ada salahnya juga jika saya ikut share tentang spoiler dan sedikit tentang kegunaannya.

Spoiler dibuat dengan menggunakan javascript button. Sedangkan untuk menyembunyikannnya digunakan properti CSS display, dalam hal ini, "display:none;". Fungsinya ada banyak sekali, diantaranya untuk memperpendek teks atau gambar yang sangat besar/panjang dan memakan space halaman atau untuk
menyembunyikan kejutan bagi pengunjung (maka seringkali disebut pula sebagai "peek-a-boo", Indonesianya kurang lebih, "ci-luk-ba!", hehe)

Pada posting blog, spoiler dapat digunakan untuk memperpendek panjang halaman sementara sebelum di-klik oleh pengunjung, sehingga tampak tidak ruwet.

Spoiler juga dapat digunakan untuk menghibur pengunjung juga loh, misalnya seperti ini:

Cara membuat dan memasang spoiler di Blogger/Blogspot:

1. Copy dan gunakan script berikut:

<div id="spoiler" style="display:none">
Konten Yang Disembunyikan
</div>
<button title="Klik untuk melihat/menyembunyikan" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Buka/Tutup</button>

Kostumisasi spoiler:

- Ganti Konten Yang Disembunyikan dengan konten (text, url, url gambar, script dll) yang ingin disembunyikan.

- Ganti title Klik untuk melihat/menyembunyikan dengan title sekehendak anda. Title berfungsi memberi informasi ketika mouse di hover di atas tombol spoiler.

- Ganti Buka/Tutup dengan teks sesuai keinginan, teks tersebut akan menjadi perintah yang terlihat pada tombol spoiler.

2. Untuk membuat spoiler di badan posting, buat spoiler melalui menu Edit HTML, letaknya dibagian pojok kanan atas kotak posting, semua editing dilakukan pada menu tersebut, jika tidak maka script tidak akan bekerja.

3. Jika ingin membuatnya di widget, pilih menu "HTML/Javascript".

Terima kasih Sudah berkunjung
<a href="https://ayibagus-spc.blogspot.com/2012/07/cara-membuat-spoiler-di-bloggerblogspot.html">Cara Membuat Spoiler di Blogger/Blogspot</a>

ayib adam al-mahjub - 10.06

Read More

Cara Membuat Related Post LinkWithin (Thumbnails) dan Trik Lengkapnya

(Tutorial Lengkap Cara Membuat dan Trik Kostumisasi Widget LinkWithin Related Post with Thumbnails')

Sudah beberapa lama ini saya menggunakan widget LinkWithin dan hasilnya cukup lumayan sebagai salah satu upaya untuk membuat pengunjung bisa melihat-lihat lagi halaman yang lainnya, sehingga meningkatkan jumlah pageview & cukup lumayan untuk menyumbangkan sejumlah traffic. Bisa dibilang LinkWithin adalah tool navigasi eksternal yang cukup keren. Halaman-halaman lama yang jarang tersentuh pun bisa dioptimalkan lagi dengan penggunaan fitur ini. Selain itu, widget ini juga menggunakan thumbnail yang bisa meningkatkan
daya tarik. Tampilannya pun lumayan. Linkwithin melakukan generating gambar dari page yang dimuat, atau jika tidak ada gambar dalam halaman tersebut, LinkWithin akan menampilkan gambar dasar berwarna abu-abu dan sedikit bertekstur. Sistem yang digunakan adalah randoming content, jadi semi random, namun tetap melakukan upaya persamaan konteks melalui judul, tag, atau label. Sehingga ketika page di load, dibutuhkan waktu untuk tool ini merayap dan menampilkan hasilnya. Tapi tidak cukup lama kok. Lagi pula tidak ada apa-apanya dibanding hasilnya. So, what are the ways to use it?

Cara Mendapatkan Widget

1. Go to LinkWithin.

2. Setelah masuk halamannya, lihat ke bagian kanan bawah dimana disitu terdapat kolom isian untuk mendapatkan widgetnya.

3. Masukkan valid email.

4. Isikan url blog/website.

5. Pilih Platform blog anda (ini digunakan untuk memasukkan secara otomatis melalui dashboard/admin page blog).

6. Pilih jumlah link/stories yang ingin anda tampilkan, sesuaikan dengan lebar post body di blog.(pilih melalui dropdown menu di kolom Width)

7. Centang "My blog has light text on a dark background" jika latar tampilan blog anda berwarna gelap.

8. Klik 'GetWidget!'.

9. Anda akan masuk ke halaman selanjutnya dan dibimbing untuk melakukan langkah-langkah sesuai dengan platform blog.

10. Setelah masuk ke halaman widget editor/page element di dashboard, tarik widget ke bawah post body jika ingin ditampilkan di bawah post body, save dan check hasilnya.

Contoh tampilannya seperti ini:

 Kostumisasi Widget

a. Kata-kata "you might also like:" mungkin kurang keren menurut anda, so anda bisa menggantinya dengan cara:

1. Masuk ke Edit HTML di dahboard anda

2. Cari tag <head> (Ctrl+F)

3. Kemudian masukkan script berikut di bawahnya:

<script>linkwithin_text='TEKS DISINI:'</script>

4. Ganti TEKS DISINI dengan teks yang anda inginkan dan save template.

b. Jika ingin menempatkan widget LinkWithin di posisi tertentu di bawah post body, karena mungkin disana ada banyak widget lain seperti Adsense, letakkan kode berikut di atas atau dibawah widget yang lain di bagian post body (cari widget-widget di bagian post body).

<div class="linkwithin_div"></div>

Lalu save.

c. Ketika berada di halaman utama (frontpage) atau halaman-halaman yang memuat query posts, widget ini akan muncul di bawah setiap post. Hal ini tentu saja tampak tidak elegan dan membutuhkan waktu loading yang lebih lama. So, jika anda ingin widget ini hanya muncul di bagian posting saja (menyembunyikannya dari halaman muka), lakukan langkah berikut:

1. Jika anda sudah terlajur memiliki widget LinkWithin yang terpasang, silakan di remove/delete terlebih dahulu.

2. Lakukan kembali langkah untuk mendapatkan widget LinkWithin diatas. Khusus pada menu Platform pilih 'Other'. Klik 'Get Widget!'

3. Anda akan menuju ke halaman selanjutnya, lalu copy script yang telah terbuat dan simpan script tersebut.

4. Kemudian masuk ke edit HTML template anda, dan ikuti langkah sederhana cara menampilkan widget hanya di post body.

5. Save dan lihat hasilnya.

Terima kasih Sudah berkunjung
<a href="https://ayibagus-spc.blogspot.com/2012/07/cara-membuat-related-post-linkwithin.html">Cara Membuat Related Post LinkWithin (Thumbnails) dan Trik Lengkapnya</a>

ayib adam al-mahjub - 10.03

Read More