Widget memainkan peran yang sangat baik di blog wordpress dan blogger. Berikut ini adalah kotak bergaya seperti facebook lainnya, widget ini dirancang dalam tiga gaya yang luar biasa dan akan meluncur dengan mulus saat Anda meletakkan kursor pada spanduk widget karena efek jQuery yang saya sertakan. Metode ini sangat mudah, Anda harus mengikuti metode langkah demi langkah.
Saatnya menyesuaikannya
Cara Menambahkan Widget ke Blog / Situs Anda
Hal pertama adalah menambahkan kode skrip java di templat.
- Bukablogger.comdan masuk ke akun Anda
- Pilih bagian blog dan templat goto Anda
- Klik pada Edit HTML
- Sekarang temukan tag </head> dengan menekan ctrl + F dan tulis tag ini di kotak lalu tekan enter
- Setelah menemukan </head> tepat di atas tag ini, salin dan tempel kode di bawah ini
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script> https : // ajax . googleapis . com / ajax / libs / jquery / 1 . 10 . 2 / jquery . min . js "> </script>
Klik Simpan Template dan Anda selesai
Sekarang saatnya menambahkan Widget ke blog Anda
- Bagian Tata Letak Goto
- Klik add gadget di mana saja pada halaman tata letak dan pilih HTML / JavaScript
- Salin dan Tempel Kode Di Bawah Ini
</script> <script type = "text / javascript"> / * <! [CDATA [* / jQuery (dokumen) .ready (function () {jQuery (". mtwlikebox"). hover (function () {jQuery ( this) .stop (). animate ({right: "0"}, "medium");}, function () {jQuery (this) .stop (). animate ({right: "-250"}, "medium ");}, 500);}); / *]]> * / </script> <style type = "text / css"> .mtwlikebox {background: url ("http://4.bp.blogspot.com/-mMtB2ANqowQ/T6es-PuSR2I/AAAAAAAAAjj// LDamrUnMJJc / s320 / fb1-right.png ") no-repeat scroll center kiri transparan! Penting; float: kanan; tinggi: 270px; bantalan: 0 5px 0 46px; lebar: 245px; z-indeks: 99999; posisi: tetap; kanan: -250px; atas: 20% ;} .mtwlikebox div {padding: 0; margin-right: -8px; perbatasan: 4px solid # 3b5998http : // 4 . bp . blogspot . com / - mMtB2ANqowQ /T6es - PuSR2I / AAAAAAAAAjM / LDamrUnMJJc / s320 / fb1 - benar . png") gulir no-repeat tengah kiri transparan! penting; float: kanan; tinggi: 270px; bantalan: 0 5px 0 46px; lebar: 245px; z-indeks: 99999; posisi: tetap; kanan: -250px; atas: http : // www . facebook . com / plugins /likebox . php ?; latar belakang: #fafafa;} .mtwlikebox span {bawah: 4px; font: 8px "lucida grande", tahoma, verdana, arial, sans-serif; posisi: absolut; kanan: 6px; teks-sejajar: kanan; z-indeks: 99999;} .mtwlikebox span a {color: grey; text-decoration: none;} .mtwlikebox span a: hover {text-decoration: underline;}} </style> <div class = "mtwlikebox" style = ""> <div> <iframe src = "http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2F freebloggerthemeshref = http% 3A % 2F % 2Facebook . com % 2F http : // blogger - templat .blogspot . com / "> BloggerTemplates </a> </span></div> </div>& amp; width = 245 & colorscheme = light & amp; show_faces = true & amp; border_color = white & koneksi; = = & aliran; header = false & header; salah = tinggi & quot; scrolling = "no" frameborder = "0" scrolling = "style" = "border: white; overflow: disembunyikan; tinggi: 270px; width: 245px; background: #fafafa; "> </iframe> <span> Widget oleh: <a href="http://blogger-templatees.blogspot.com/"> BloggerTemplates </a> </span> < / div> </div>
Saatnya menyesuaikannya
- Tautan Halaman: Ganti teks warna oranye dengan nama pengguna halaman Facebook Anda
- Border Color: Ganti nilai warna kuning dengan kode warna yang ditargetkan untuk warna batas widget Anda
- Posisi: Ganti nilai warna hijau dengan nilai posisi yang ditargetkan Anda dapat menggunakan px, bukan%
Anda selesai widget berhasil ditambahkan ke blog Anda
Tidak ada komentar: