Cara Memasang Widget Alhabib di Blogspot (Blogger)

Habib bin Hilal 58 Comments

Memasang widget atau perkakas blog tambahan ke dalam sebuah blog atau website ternyata tidak selamanya mudah. Terutama bagi yang masih baru dalam dunia blogging, antara keinginan mempercantik dan menambah perkakas blog dengan kemampuan untuk mewujudkannya bisa jadi bagaikan “pungguk merindukan bulan”. Paling tidak, demikianlah yang tergambar dari beberapa komentar di situs Layanan Web Islami Alhabib ini.

Untuk itu, kami tuliskan tutorial berikut ini tentang bagaimana cara memasukkan widget Alhabib ke dalam blog di Blogspot (Blogger). Semoga dapat membantu mewujudkan keinginan anda untuk mempercantik blog dengan widget-widget islami sekaligus menyebarkan nilai-nilai islam.

Jika masih ada pertanyaan, silakan sampaikan melalui formulir komentar. Insyaallah kami akan dengan senang hati menjawabnya.

Tutorial

1. Kunjungi Halaman Koleksi Widget Islami Alhabib

Ada beberapa koleksi widget yang tersedia: kalender, jam, dan aneka tema. Cari widget yang kauinginkan melalui tombol Choose Page untuk melihat halaman-halaman yang ada. Tekan pada tombol Get this Widget atau judul widget untuk memulai penyetelan dan pemasangan.

Kunjungi halaman widget islami Alhabib

2. Setel Tampilan Widget

Melalui contoh widget Asmaul Husna di bawah ini, dapat dilihat layar penyetelan widget Alhabib. Setiap widget akan mempunyai pilihan setelan masing-masing namun tidak jauh berbeda.

Pada kotak Appearance (Tampilan) tersedia tombol untuk mengganti warna dari widget. Tekan tombol warna tersebut untuk memilih warna lain. Anda dapat pula mengganti warna dasar (Background Color) sesuai dengan latar belakang warna blog anda untuk mengetahui bagaimana kira-kira tampilan widget ini jika telah terpasang pada blog anda. Ukuran widget dapat pula diganti melalui kotak Width dan Height (lebar & tinggi). Setelah mengganti angka lebar/tinggi, pindahkan kursor mouse ke kotak lain atau tekan tombol refresh yang tersedia pada papan atas kotak Pratayang (Preview)

Layar halaman penyetelan widget islami alhabib.

Pada kotak Alignment (Kedudukan) tersedia pilihan untuk mengatur posisi widget relatif terhadap sekelilingnya. Biasanya anda tidak perlu mengatur ini. Namun jika tampilan widget di blog anda tidak sesuai yang anda inginkan (misalnya, menempel ke kiri kotak samping atau sidebar), anda dapat mengklik centang pada No Preferences dan memilih center (untuk rata tengah) atau perataan lainnya.

Tampilan pratayang akan otomatis berubah sesuai pilihan anda.

3. Munculkan Kotak Kode Embed dan Pemasangan Otomatis ke Blog

Tombol Blog Me akan membuka kotak penyisipan widget otomatis.

Tekan tombol Blog Me! jika anda telah rampung dengan penyetelan tampilan widget. Sebuah kotak lain akan muncul pada sisi kanan (lihat di bawah). Mungkin anda harus menunggu beberapa saat untuk melihatnya.

Pada kotak ini, kode embed akan ditampilkan di bagian bawah. Kode ini berguna bagi mereka yang memiliki pengetahuan HTML lanjutan dan mereka yang mempunyai blog atau situs yang dikelola sendiri. Kode embed ini dapat disalin dengan mengklik pada kotak kode dan disisipkan pada source code situs/blog anda. Ia dapat pula disisipkan pada beberapa tempat yang disediakan oleh penyedia blog anda. Biasanya pada bagian Text Widget atau Text Module atau semacamnya (untuk blog di Multiply, bisa lihat contoh ini).

Layar Penyisipan Widget Otomatis ke dalam Blog

Ada banyak tombol pada bagian atas. Mereka dipakai untuk memasukkan atau menyisipkan widget secara otomatis ke masing-masing jenis blog. Jadi, jika anda ingin memasukkannya ke dalam blog di Blogspot, tekan tombol Blogger.

4. Isikan Rincian Akses Masuk ke Blog Anda

Kotak Posting Otomastis

Masukkan nama pengguna (Blogger username) dan kata pembuka (Blogger password) pada isian yang sesuai. Nama pengguna adalah alamat email pada akun Google anda. Begitu juga password. (Google telah mengubah cara login ke Blogger. Mereka meminta akun Blogger untuk diubah secara otomatis menjadi akun Google.) Isian pada Blog akan otomatis berubah sesuai nama pengguna yang anda masukkan. Jika anda mempunyai beberapa blog di Blogspot atau nama blog yang lain, maka anda harus menuliskan alamat blog yang sesuai pada kotak ini.

Catatan: Kami mengutamakan keamanan anda. Nama pengguna dan password tidak akan pernah tersimpan oleh kami. Keduanya hanya dipakai untuk penyisipan otomatis saja.

Pastikan bahwa pilihan Post to sidebar tercentang jika anda ingin menampilkan widget alhabib pada bagian papan sisi blog anda. Jika tidak, maka widget akan tertampil sebagai sebuah pos/tulisan.

Selanjutnya tekan tombol Post. Sebuah konfirmasi berhasilnya (atau tidak berhasilnya) penyisipan otomatis akan muncul setelah itu.

Kotak konfirmasi berhasil menyisipkan widget alhabib ke blogspot

5. Kunjungi Blog Anda dan Cek Terpasangnya Widget Alhabib

Alhabib Islamic Widget on Blogspot PageJika anda telah melihat terpasangnya widget pada blog anda dan sesuai dengan tampilan yang anda inginkan, selamat! Jika ternyata ada tampilan yang kurang pas, anda dapat mengunjungi kembali halaman penyetelan dan mengulangi langkah-langkah tutorial di atas.

Judul widget ini secara otomatis dibuat. Jika anda ingin menggantinya, masuklah ke akun blogspot anda dan benahi melalui halaman pengelolaan (Administration atau Dashboard)

Semoga bermanfaat.

Dilihat: 7,775

Habib bin Hilal

Habib bin Hilal adalah pengelola dan Editor dari blog ini serta situs Alhabib - Mewarnai dengan Islam.

More Posts Twitter Facebook

58 Comments

  8. Assalamualaikum..
    Widget2nya menarik, jadi pengen memasangnya di blog saya
    trims atas info di atas

  14. salam kenal, terima kasih tutorialnya. Yang saya tanyakan kalau untuk memasukkan ke wordpress dengan langkah tersebut, widget akan masuk dalam tulisan (tempat yang bila kita nulis, gambar tersebut akan bergeser ke bawah) bukan pada templet yang tampil permanent. bagaimana memasang widget tersebut pada tempat yang permanent seperti kolom pengarang, blogroll, kalender, dll.

    Demikian pertanyaanku makasih sebelumnya

  18. assalamualaikum,,
    saya mau tanya mklum bru blajar bkin web.
    kalau saya pakai joomla bsa ga trus web saya ini blum di hostingkan gmana donk ?
    trus mnurut pnjlasan d'ats pkai akun google smntara saya ga gmna ntu ???
    jwabanx tlong krim k email saya az ya,,
    [email protected]

    Sblm n ssudahx mkasih

  20. assalamualaikum,wr,wb.
    cara nya saya tidak tau nih mas/mba?mau masang kata mutiara.

  24. aduh saya bingung nih saya ngertisih tapi kok ngirim widget nya gagal terus wa…..wa…..hu…hu…

  27. assalamu’alaikum…..

    dhiana mau tanya ne.. gimana cara memasukkan posting yang saya buat kedalam tombol menu yang saya buat di flashvortex.com???
    tlg bantuanya ya……….
    jwban tlg kalo bisa dikirim ke email saya
    [email protected]

    trimakasih……..

    • Saya kurang memahami maksuk Dhiana. Tetapi kalau melihat cara pembuatan tombol menu di flashvortex, dhiana tinggal membuat satu menu baru, diberi nama, kemudian ditentukan tautannya ke mana. Pertama dhiana harus mengetahui alamat posting tersebut. Caranya: buka posting, dan catat atau copy alamat yang muncul di bagian kotak alamat di browser internet. Misalnya, pada step 2 di flashvortex, label: postingA. Maka pada kotak di bawahnya masukkan alamat posting tadi.

  28. Asslmkm… afwan, koq ga bs2 ya…
    padahal sudah mengikuti tata caranya…

  30. assalamu’alaykum.
    akh,
    kenapa tidak ada kotak “post to sidebar”??
    tidak muncul..

  31. saya sudah mencuba beberapa kali memasang widget ini pada blogspot saya mengikut tutorial yang telah ditunjukkan tetapi masih tidak dapat masuk ke blog saya

    • Bisa lebih spesifik? Misalnya, pada bagian mana, langkah yang ke berapa terjadi kesalahan? Atau mungkin ada error message yang muncul?

    • pada kotak “code”.saya telah memberi alamat untuk dihantar pada blogspot saya menggunakan akaun goolge bersama password.setelah menekan butang “post”,didapati kenyataan “post failed” pada bar dibawahnya

    • Akaun google (berupa email address) dimasukkan ke dalam isian Blogger username. Kemudian password pada Blogger password. Pada isian Blog, tuliskan alamat blog anda (coba tanpa menuliskan http:// misalnya arifah.blogspot.com).

      Saya telah mencoba dengan akaun Google saya dan tidak mendapati masalah.

      Mungkin bisa dicoba sekali lagi… 🙂

  33. assalamu alaikum..wr..wb.
    Alhamdulilah widgetnya udah dapat saya pasang di blog saya.
    keren banget,semoga islamicwidget ini menjadi amalsholeh
    buat alhabib.SEmoga alhabib selalu sehat walafiat dalam lindungan Allah SWT,dan terus berkarya dalam seni islam.Saya blogger baru,sudilah kiranya tengok saya punya blog.
    Syukron.
    Wassalam..

  34. assalamu’allaikum wr wb

    bagaimana cara memasukan kode embed ke dalam widget di wordpress ?

    saya sudah mencoba berulang kali tapi tak berhasil 🙁

    mohon bantuannya…
    syukron

    wassalamu’allaikumwrwb

  36. mo masang hijricalendar on my blog, eee kug d kotak “code” tak muncul kt “Blog me”??? ap masih salah y…

    • Plugin untuk Joomla belum ada. Tetapi jika mau, bisa menggunakan module di Joomla. Silakan ikuti menu Extension -> Module Manager -> Custom HTML. Anda bisa menyisipkan kode yang terdapat pada halaman widget islami Alhabib ke dalam HTML Source pada kotak Custom Output.

  39. knp sume wijet yg sy add drpd alhabib xleh pon.pnt sy asyik ulang langkah tu…

  40. Terima kasih atas semuanya. Sejak pertama melihat, saya langsung memasang Widget Alhabib di ikrar26.blogspot.com. Semoga bermanfaat juga buat saudara kita yang lain. Amin

  47. Assalamualaikum,
    Moderator yang budiman,saya sudah usaha sedaya upaya untuk memasukkan widget floral and swirl ornament(hijri kalendar) kedalam blog saya, sampai sekarang masih tidak boleh walaupun saya sudah ikut panduan info al-habib.masalahnya saya juga sudah masukkan nama blog dan password…masih juga failed. Bolehkah tuan moderator tolong masukkan widget atau bantu saya apa masalahnya?segala kerjasama dari pihak tuan moderator saya ucapkan jazakallau khairan kathira.

    • Saya lihat, widget sudah terpasang di blog saudara.

      Sudah menemukan letak kesalahan sebelumnya?

Tinggalkan Balasan