Powered by Blogger.
RSS

Facebook Popup Like Box with jQuery to Blogger blog

 

Inilah tutorial memasang widget Facebook popup untuk blog blogger  dilengkapi dengan sebuah kotak cahaya jQuery yang dikontribusi oleh jacklmoore. Widget yang sangat berguna untuk mendatangkan arus pengunjung dari Facebook ini sumber content –nya dari http://www.myblogger-tricks.com.  Saya ucapkan terimakasih untuk itu.

Widget Facebook Popup Like Box

Menurut sumbernya widget Facebook Popup Like Box ini tidak dirancang untuk membuat blog Anda terlihat seperti profesional, TETAPI dirancang untuk mendapatkan lebih banyak TRAFIK dari Facebook dengan memanfaatkan kotak Facebook Popup Like.  Kotak ini memiliki tombol CLOSE di sudut kanan atas. Pengunjung dapat menutup widget ini dengan mengklik tombol tersebut.

Memang, widget Facebook Popup Like Box ini benar-benar mengganggu pengunjung Anda ketika mereka muncul lagi dan lagi. TETAPI jika Anda gunakan dengan benar para pengunjung ini  juga membantu Anda dalam mengembangkan blog dengan baik.

Facebook adalah sumber utama lalu lintas yang dapat mengirim blog Anda arus lalu lintas yang baik bila Anda memiliki cukup penggemar di halaman Facebook Anda. Untuk memperluas jaringan Facebook dan meningkatkan penggemar halaman Facebook, Anda dapat menggunakan widget Facebook Popup Like Box ini yang sangat stylish untuk blog blogger dan akan muncul HANYA sekali pakai saja sehingga akan meningkatkan penggemar Facebook Anda secara dramatis tanpa mengganggu pengunjung Anda.

Facebook LIKE  popup widget

Cara kerja Facebook Popup Like Box

Facebook popup widget menyimpan cookie di browser pengunjung. ketika pembaca mengunjungi blog Anda pertama kali. Kotak Facebook Popup Like Box akan muncul untuk pembaca Anda,dan ini berlaku hanya untuk kunjungan pertamakali saja. Ketika pengunjung menavigasi ke halaman lain atau nantinya melakukan kunjungan ulang kotak Facebook Popup Like Box ini tidak akan muncul lagi karena ditiadakannya cookie pada browser Reader.

Kecanggihan Widget

(1). Bisa bekerja pada semua Browser
(2). Design Cool dan sangat menarik
(3). Pemuatan lebih cepat dibanding Blogger Widget lain.
(4). Tidak mempengaruhi Speed website Anda 
(5). POP-UP dilengkapi dengan LightBox Effect
(6). Bisa bekerja pada semua blogging Platform

Tambahkan widget Facebook Popup Like Box ke Blogger

CARA PERTAMA

Anda dapat menginstall Widget ini ke blog Anda. Ikuti saja langkah sederhana berikut :

  1. Sebelum edit setiap template terlebih dulu menyimpan Backup. Klik Backup Template Anda.
  2. Pergi ke Blogger Dashboard >> Template >> Edit Html
  3. Cari kode berikut dalam template Anda.

    </head>

  4. Paste kode berikut sebelum atau diatas </ head>

    Untuk mendapatkannya silahkan klik link di bawah ini :

    http://www.4shared.com/get/9R8utV26/LETAK_TEPAT_DIATAS_TAG_HEAD_PE.html
    Gambar yang menunjukkan content script seperti berikut ini :

    script satu Facebook Popup Like Box

    (Maaf hanya ditampilkan image untuk menghemat loading time blog ini).

    Perhatikan ini *7

    *7 Setting this value will effect cookie refreshment. I have set the likebox to appear once to the visitor and likebox will appear again after 1 week. If you want to display likebox to your visitors after a 1 day then set 7 to 1. if you set the value to 1 then it can annoying your regular readers.

  5. Cari kode berikut dalam template Anda. 

    </b:skin>

    Click saja tanda PANAH HITAM UNTUK expand code TERSEBUT (lihat gambar ini).

    click black arrow to expand 
  6. PASTE code css berikut ini SEBELUM atau TEPAT DIATAS </b:skin>

    Untuk mendapatkannya silahkan klik link di bawah ini :

    http://www.4shared.com/office/-uFR2nSJ/PASTE_code_css_SEBELUM_atau_TE.html?

    Isi code CSS  seperti gambar  berikut :

    code CSS tepat diatas closing tag b skin 
  7. SAVE template and you are done second last step!

    Kunjungi blog Anda untuk memastikan widget ini telah bekerja sempurna.
  8. Terakhir temukan code berikut :

    </body>  

  9. PASTE code BERIKUT ini SEBELUM closing tag   </body>

    Untuk mendapatkannya silahkan klik link di bawah ini :

    http://www.4shared.com/office/R1UVGknU/FB-popup__CODE_HTML_ini_DIATAS.html?

    Isi code HTML   seperti gambar  berikut :

    code HTML diatas closing tag Body
  10. SAVE YOUR TEMPLATE! You are all done.!!

CARA KEDUA

Berikut ini cara lebih mudah.

(1). pergi ke Blogger.com dan Login dengan account Gmail Anda
(2). Buka Blog yang Anda ingin pasang Widget ini.
(3). Go to under the Option Layout (TATA LETAK)
(4). kLIK +Add a Gadget Option
(5). Scroll To "HTML-JAVASCRIPT"
(6). Klik icon "+" untuk menambahkannya
(7). Copy Code dibawah ini dan Paste ke jendela yang kosong.
(8). Biarkan Title kosong.
(9). Click Save, Now You Are Done.

image

Code dapat Anda peroleh di http://www.4shared.com/office/wZuDo6uP/Pop_out_Box_Code.html?

Menguji sukses instal widget Facebook Popup Like Box

Kunjungi blog. Jika dilakukan dengan benar Anda.akan melihatnya muncul!

Ingat bahwa POPUP akan menunjukkan hanya muncul SEKALI. Untuk melihat lagi, terlebih dahulu Anda perlu untuk menghapus cookie pada browser Anda. Kemudian refresh halaman untuk melihat hal itu muncul lagi.

Customization

  1. Ganti AllTricksWorld dengan Facebook Username Anda.

  2. Ini tidak akan POP Up lagi dan lagi pada setiap reload Atau setiap pages. Untuk Review Widget hanya perlu menghapus Cookie Browser Anda. Kemudian Refresh halaman webpage untuk melihatnya muncul Lagi.

  3. Jika ingin widget ini tampil setiap reload webpage, HANYA perlu ganti “true” dengan “false” di bagian ini :

    if (document.cookie.indexOf('visited=true') == -1)
    {
    var fifteenDays = 1000*60*60*24*30;

  4. Widget ini akan POPUP lagi pada Desktop Viewer Anda setelah 30 Hari. Jika ingin minimize waktunya, HANYA perlu ubah nilai *30

  5. Anda bisa ganti text “Receive all updates via Facebook. Just Click the Like Button Below....” dengan Anda sendiriAllTricksWorld dengan Facebook Username Anda.

  6. Save And Done.

Original source :
Add Facebook Popup Like Box With Jquery To Your Blogger Blog
How To Add Facebook POP UP Box Widget for Blogger [UPDATED]



  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

0 comments:

Post a Comment