Postingan

Browsing Artikel: Widget
Tunjukkan semua
Mengatasi Gambar Related Post Gepeng dan Support HTTPS

Mengatasi Gambar Related Post Gepeng dan Support HTTPS

Tutorial Blogger kali ini yaitu tentang cara memperbaiki widget related post (DTE) yang tampilan gambar/thumbnailnya terlihat gepeng, peang, penjol. Atau dalam bahasa lain gambarnya saling tarik-menarik, tidak enak dipandang. Artinya, dalam tutorial kali ini, kita akan membuat tampilan gambar di related post bisa lebih natural, terlihat indah. Meskipun ada cropping, tetapi itu lebih baik dabindingkan tampilan gambarnya stretch . Selain itu, tentu saja scriptnya tetap akan support HTTPS (SSL). Jika dibandingkan maka perbedaanya akan terlihat seperti berikut, perhatikan baik-baik penampakan pada gambar di bawah ini: Atau gambar ini: Antara gambar 1 dan gambar 2, mana yang menurut Anda lebih baik? Gambar nomor 3 bukan? Ya, memang bukan gambar nomor 3, karena jawaban yang betul adalah gambar nomor 2. Untuk memperbaiki thumbnail related post yang ketarik-tarik seperti pada gambar 1, maka lakukan perubahan berikut ini. Ganti JavaScript related post yang lama dengan code berikut
Share Button Responsive, Lengkap dengan Tombol WhatsApp, Line dan BBM

Share Button Responsive, Lengkap dengan Tombol WhatsApp, Line dan BBM

Tutorial Blogger/blogspot kali ini ialah tentang cara membuat share Button/tombol berbagi responsive dilengkapi dengan share button WhatsApp (WA), Line dan BlackBerry Messenger (BBM) . Selain itu, juga terdapat tombol lainnya seperti tombol share ke Email, Tumblr, Pinterest, LInkEdin dan tombol share yang sudah umum dipasang seperti Facebook, Twitter dan Google Plus. Tidak hanya itu, tombol share kali ini juga dilengkapi dengan show-hide OnClick event, memperlihatkan antarmuka yang modern dan legal. Sehingga tidak meresahkan masyarakat. Sebetulnya ada banyak widget share button yang pernah saya bagikan di blog ini. Salah satunya ialah cara membuat tombol share di blog dengan efek peekaboo (ciluukbaaa). Untuk tutorial kali ini, silahkan simak baik-baik penjelasannya besok saja, terima kasih. Oh yaa, for your information, sebetulnya mode share button ini seperti yang terpasang pada SimpleUP Blogger Template , tetapi di template itu tidak dilengkapi WA, Line dan BBM. Cara membu
Membuat Widget Recent Post Warna-warni

Membuat Widget Recent Post Warna-warni

Tutorial Blogger/blogspot kali ini tentang cara memasang widget recent post (artikel terbaru) berwarna-warni , ala-ala pelangi saat hujan gerimis. Sebetulnya hal ini juga dapat diterapkan pada widget lain seperti widget Popular Posts . Bagi Anda yang ingin mengkreasi tampilan blog biar kelihatan fresh dan sedikit nor#k, silahkan tambahkan widget recent post bermodel warna-warni berikut ini. Memasang Widget Recent Posts tampil Warna-warni Widget recent post yang dibuat ini adalah versi recent post yang sederhana , tidak menggunakan thumbnail dan meta post (seperti tanggal posting, author dll). Langkah-langkah pembikinannya adalah sebagaimana berikut: Login ke Blogger > Theme > Edit HTML Tambahkan CSS berikut ini di atas kode </style> (yang pertama) /* Recent Wrapper By Bung Frangki */ #recent-wrapper{display:block;position:relative;overflow:hidden;font-size:15px} #recent-wrapper ul{margin:0;padding:0;list-style-type:none;} #recent-wrapper ul li{position:relati
Solusi Contact Form Tidak Berfungsi Bagi Blog yang Masih Menggunakan Domain .blogspot.com

Solusi Contact Form Tidak Berfungsi Bagi Blog yang Masih Menggunakan Domain .blogspot.com

Bagi pengguna custom template yang kode </body> pada template sudah diganti dengan kode &lt;!--</body>--&gt;&lt;/body&gt; kode <head> telah diganti dengan kode &lt;head&gt; dan kode </head> telah diganti dengan kode &lt;/head&gt;&lt;!--<head/>--&gt; serta masih menggunakan subdomain Blogger, dot blogspot dot com (namablog.blogspot.com), maka widget Contact Form tidak akan berfungsi, alias tidak bisa digunakan untuk mengirim pesan. Namun bagi blog yang sudah berdomain TLD (top level domain), kayak .com, .net, .id dan lain sebagainya, meskipun pada html template kode </body> kode <head> dan kode </head> telah diganti dengan kode lain, contact form akan berfungsi. Cukup dengan mengikuti tutorial pada artikel: Mengatasi Contact Form yang Tidak Bisa Mengirim Pesan Artinya, untuk membuat widget contact form agar bisa mengirim pesan kembali, berbeda caranya bagi yang sudah berdomain TLD dan ya
Cara Memasang Disqus Recent Comment di Blogger

Cara Memasang Disqus Recent Comment di Blogger

Tutorial Blogger/blogspot kali ini tentang cara memasang widget recent comment atau komentar terbaru Disqus pada sidebar blog. Widget ini paling cocok digunakan untuk blog yang menggunakan komentar Disqus. Bagi yang tertarik memasang widget ini di blognya, silahkan baca terlebih dahulu tentang cara memasang komentar Disqus di blog . Baik yang sudah menggunakan domain TLD (top level domain) maupun yang masih menggunakan domain bawaan Blogger, blogspot. Memasang widget Recent Comment Disqus di Blogspot Silahkan login ke Blogger Masuke dashboard blog > Theme > Edit HTML Letakkan CSS ini tepat di atas kode </style> (yang pertama) /* Recent Disqus Comments CSS */ #recent_comments{display:block;margin:0 auto;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:400px;} #recent_comments ul.dsq-widget-list{text-align:left;max-height:400px;overflow:auto} #recent_comments ul.dsq-widget-list::-webkit-scrollbar {height:8px;width:8
Cara Membuat Widget Recent Post Seperti Xadow Magz

Cara Membuat Widget Recent Post Seperti Xadow Magz

Artikel kali ini masih seputar tutorial Blogger, yaitu tentang cara membuat widget most recent post pada Blogger/blogspot seperti yang terpasang di Xadow Magz theme . Sedikit saya kasih informasi mengenai template Xadow Magz ini, template tersebut terdapat 4 desain style yang unik dengan optimasi SEO yang maksimal, serta masih banyak lagi fitur lainnya, dan ke-empat style template itu cuma bisa Anda dapatkan seharga 300 ribu Rupiah saja atau sekitar 23 USD untuk pembayaran melalui PayPal. Untuk mengetahui fitur template tersebut lebih lanjut, silahkan baca pada artikel XadowMagz Fully Responsive Blogger Template . Demikian sekilas info kali ini. Terima kasih sudah membaca. Kita kembali ke topik tentang widget recent post. Topik yang sebetulnya adalah modus untuk meningkatkan penjualan template-template saya. Bagaimana? Keren kan cara promosi saya? Nah, Bagi yang tertarik memasang widget recent posts tersebut pada blognya masing-masing, alangkah baiknya Anda perlu ketahui dulu
Cara Membuat Widget Popular Post Seperti Berminat Template

Cara Membuat Widget Popular Post Seperti Berminat Template

Tips blogspot/blogger kali ini tentang cara membuat widget Popular Post seperti yang digunakan oleh Berminat Template. Widget Popular Post pada Berminat Template tersebut memiliki tampilan yang responsive dan sederhana. Seperti namanya, widget ini menampilkan artikel atau postingan paling banyak dibaca atau paling sering dikunjungi pada blog/website. Widget Popular Post seperti halnya widget Related Post , Random Post dan Recent Post , yaitu untuk memancing keterlibatan pengunjung dalam menjelajahi blog/website. Baca juga: Membuat Thumbnail pada Popular Post Tidak Bergambar Bagi Anda yang penasaran seperti apa tampilan widget Popular Post di Berminat Template, silahkan menuju ke tombol demo di bawah ini. Demo Cara membuat widget Popular Post seperti digunakan Berminat Template Widget Popular Post pada tutorial kali ini adalah untuk script Popular Post yang terbaru di update oleh Blogger, jadi pastikan Popular Post yang akan dimodifikasi ialah script Popular Post Terbaru. Simak
Membuat Social Share Button Ala Berminat Template

Membuat Social Share Button Ala Berminat Template

Tutorial blog kali ini tentang cara membuat tombol berbagi atau social share button seperti yang terpasang pada Template Berminat . Bagi siapa saja yang sudah bertanya bagaimana cara membuat tombol berbagi ke media sosial pada template tersebut, silahkan membaca artikel ini. Beberapa widget tombol berbagi dengan gaya berbeda yang telah saya posting sebelumnya juga dapat anda lihat pada link-link berikut ini. Siapa tahu ada style yang sesuai dengan selera anda. Artikel serupa: Membuat Social Share Button Responsive Tanpa JavaScript di Blog Membuat Tombol Social Share dengan Counter di Blog Cara Membuat Tombol Share di Blog dengan Efek Peekaboo Nah, untuk membuat social share button seperti yang terpasang pada Template Berminat, berikut kode atau script yang anda butuhkan. Demo # Kode CSS Letakkan dan simpan kode CSS berikut ini di atas kode </head> atau &lt;/head&gt;&lt;!--<head/>--&gt; <b:if cond='data:blog.pageType == &quot;item&am