Postingan

Menampilkan postingan dengan label HTML

Cara Membuat Night Mode di Blogger dengan Cookie

Gambar
Night Mode adalah sebuah fitur yang bertujuan untuk membuat tampilan menjadi gelap. Fitur ini biasanya kita temui pada perangkat mobile yang menyematkan fungsi Night Mode atau Dark Mode yang memiliki manfaat yaitu menghemat penggunaan baterai. Di sini Arlina Design akan berbagi tips tentang Cara Membuat Night Mode di Blogger dengan Cookie . Di sini saya menambahkan fitur Cookie agar saat kita refresh halaman yang sudah diaktifkan dengan Night Mode tidak akan kembali ke mode awal meskipun sobat sudah berganti halaman. Bagaimana, menarik bukan? Bagi yang tertarik memasang fitur Night Mode ini silakan ikuti langkah-langkah di bawah ini. Selengkapnya »

Cara Memasang Floating Subscription box di Blogger

Gambar
Untuk tips Blogger kali ini Arlina Design akan berbagi Cara Memasang Floating Subscription box di Blogger . Seperti yang kita ketahui Subscription box atau widget berlangganan lewat email merupakan salah satu bagian yang penting di dalam sebuah blog, karena akan meningkatkan jumlah pengunjung selain itu dari sisi lain pelanggan postingan akan mengetahui secara langsung update yang diterima lewat email. Sebelumnya saya juga sudah berbagi tips Cara Membuat Push Notifications di Blog dengan OneSignal yang memiliki fungsi serta manfaat yang kurang lebih sama. Baiklah, berikut ini adalah langkah-langkahnya. Selengkapnya »

Cara Membuat Responsive Mega Menu di Blogger

Gambar
Kali ini Arlina Design akan berbagi Cara Membuat Responsive Mega Menu di Blogger . Seperti yang sobat tahu, Menu Navigasi adalah salah satu bagian yang penting dalam sebuah blog untuk memberikan informasi kepada pengunjung tentang apa saja konten yang ada di blog tersebut dan akan ditampilkan berupa link yang nantinya akan menunjukkan tiap halaman-halaman tertentu yang ada di blog. Yang akan saya bagikan ini adalah mega menu dengan off-canvas yang sudah responsive dengan tampilan yang cukup menarik dan juga sudah dilengkapi dengan fitur pencarian sehingga akan memudahkan pengunjung untuk mencari halaman yang ia cari. Nah, bagi yang ingin menambahkannya pada blog, silakan ikuti langkah-langkahnya di bawah ini. Selengkapnya »

Cara Mengatasi Error Breadcrumb di Search Console Blogger

Gambar
Beberapa waktu lalu di salah satu blog demo dari template yang saya buat muncul pesan peringatan error khususnya pada bagian Breadcrumb yang terpasang di template. Mungkin untuk beberapa template lain tidak mengalami masalah ini termasuk template blog yang blog ini dan Idntheme gunakan, namun masalah ini muncul pada template Nubie Fast yang saya share di Idntheme. Breadcrumb yang akan saya share ini sudah menggunakan markup breadcrumb versi terbaru yaitu schema.org yang direkomendasikan mesin pencari seperti Google dan Bing. Selengkapnya »

Cara Memasang Pop Up Ucapan Selamat Berpuasa

Gambar
Tidak terasa bulan ramadhan di tahun 2019 ini telah tiba, bulan suci yang penuh berkah tidak lama lagi akan kita masuki. Bulan Ramadhan adalah salah satu momen yang paling ditunggu-tunggu oleh umat Islam di seluruh dunia. Karena di saat inilah banyak manfaat dan hal spesial yang selalu dirasakan oleh umat Islam. Maka ketika Ramadhan tiba, bulan yang istimewa tersebut akan selalu disambut dengan penuh suka cita. Untuk menyambut bulan suci yang penuh berkah ini Arlina Design akan memberikan tips Cara Memasang Pop Up Ucapan Selamat Berpuasa . Cara kerjanya cukup sederhana, pesan pop up akan muncul ketika kita membuka suatu halaman di dalam blog yang dilengkapi dengan tombol close untuk menutup pesan tersebut. Bagi yang penasaran, yuk ikuti caranya di bawah ini! Selengkapnya »

Memperbaiki Komentar Blogger yang Tidak Bisa Membalas

Gambar
Wah, sudah lebih dari satu bulan blog ini tidak diupdate. Kalau seumpama rumah sudah ada ramat lancah 😹 Ya, itu dikarenakan beberapa waktu kebelakang saya sedang fokus untuk perbaikan dan update template-template lama di blog tetangga, salah satunya perbaikan untuk masalah tombol komentar blogger yang tidak bisa membalas. Jadi agak ribet juga kemarin update satu-persatu dan juga sekalian update tampilan untuk beberapa template tertentu. Nah, sampai saat ini pun perbaikan untuk template masih saya lakukan karena masih ada beberapa template yang belum selesai diupdate. Dan maaf untuk teman-teman Blogger yang menggunakan template saya dan mengalami masalah pada template yang belum sempat saya tanggapi karena terbentur dengan kegiatan offline yang saya kerjakan. Selengkapnya »

Membagi Halaman di Postingan dengan Nomor Navigasi

Gambar
Beberapa waktu lalu saya pernah berbagi postingan tentang cara Membagi Konten Artikel Menjadi Beberapa Halaman dengan Efek Slide dan pada postingan kali ini Arlina Design akan berbagi tips cara Membagi Halaman di Postingan dengan Nomor Navigasi . Mungkin sobat pernah mengunjungi situs berita atau situs baca komik yang di setiap isi postingannya dibagi menjadi beberapa halaman, biasanya pada postingan tersebut terdapat tombol Next yang ketika kita menekan tombol tersebut akan mengarah ke halaman selanjutnya. Begitupun dengan tips yang akan saya berikan ini, cara kerjanya adalah membagi beberapa paragraf dari isi postingan menjadi beberapa bagian sesuai keinginan sobat. Selengkapnya »

Membuat Video Melayang Saat Halaman Digulir

Gambar
Bagaimana sih cara Membuat Video Melayang Saat Halaman Digulir ? Mungkin sobat pernah melihat video di situs Youtube, Vidio atau situs lain yang ketika video sedang dimainkan dan sobat menggulirkan halaman ke bawah maka video tersebut otomatis akan mengikuti kemana sobat menggulirkan halaman. Cara kerja dari tips yang akan saya bagikan ini pun hampir sama, namun bedanya video akan tetap melayang mengikuti halaman yang kita gulir meskipun video belum dimainkan. Beberapa waktu lalu saya pernah berbagi tips tentang Cara Memasang Video Youtube Responsive di Blog , dengan cara tersebut video Youtube yang ditambahkan di dalam postingan akan otomatis mengikuti dimensi layar dari perangkat yang sobat gunakan. Nah, pada tips kali ini Arlina Design akan menggabungkan tips video responsive dengan tips video melayang saat digulir. Bagi yang tertarik, bisa ikuti langkah-langkah di bawah ini. Selengkapnya »

Ada Apa dengan Tombol Balas Komentar Blogger?

Gambar
Beberapa waktu lalu ada keluhan lewat email tentang tombol balas komentar di blogger yang tidak berfungsi . Disinggung dari artikel www.bungfrangki.com yang berjudul Komentar Blog Error, Tombol Reply Not Working, Apa Solusinya? . Di sini saya mencoba untuk mengecek ternyata memang betul bahwa tombol balas pada komentar Blogger tidak berjalan sebagaimana mestinya. Nah di sini saya bingung kok bisa? Kemungkinan ada perubahan di blogger yang tidak saya ketahui. Bagi sobat yang mengalami hal ini di blognya khususnya untuk template yang sudah dioptimasi, Sobat bisa mengembalikan beberapa optimasi tersebut ke semula seperti pada postingan ini Cara Menghapus CSS, Javascript, dan Widget Bundle Blogger . Jadi bagi yang sebelumnya melakukan tips Cara Menghapus CSS, Javascript, dan Widget Bundle Blogger bisa kembalikan seperti semula. Selengkapnya »

Cara Membuat Slot Iklan Sebelum dan Sesudah Isi Postingan

Gambar
Kemarin ada yang request Cara Membuat Slot Iklan Sebelum dan Sesudah Isi Postingan di Blogger . Sebenarnya caranya sangat mudah, namun bagi sobat yang sudah mengetahui caranya tidak perlu lagi mengikuti cara ini karena sobat sudah melakukan cara ini sebelumnya. Bagi sobat yang ingin menampilkan iklan baik itu iklan banner atau unit iklan AdSense khusus seperti In-article Ads di dalam postingan bisa ikuti cara di bawah ini. Selengkapnya »

Cara Membuat Table of Contents di Postingan Blogger

Gambar
Table of Contents adalah daftar yang terdiri dari poin-poin atau bagian-bagian pokok bahasan yang terdapat pada sebuah artikel. Table of Contents bisa kita gunakan sebagai rincian dari isi artikel yang berupa link sehingga akan memudahkan pembaca untuk memilih informasi bagian pokok bahasan apa yang akan dibacanya. Table of Contents ini sering kita temui pada situs Wikipedia, Ensiklopedia, dan juga file PDF dari E-Book yang biasanya diletakkan setelah tulisan kata pengantar atau ide pokok dari sebuah artikel. Baiklah, di sini Arlina Design akan memberikan tips tentang bagaimana Cara Membuat Table of Contents di Postingan Blogger dengan mudah. Selengkapnya »

Memasang Efek Preloading Keren di Blogger

Gambar
Ada banyak cara usaha untuk mempercantik blog, salah satunya dengan Memasang Efek Preloading Keren di Blogger ini. Bagi yang penasaran, simak tipsnya di bawah ini. Cara kerja dari Efek Preloading di Blogger ini yaitu transisi yang akan muncul otomatis saat memuat halaman di blog dan akan hilang setelah halaman tersebut termuat dengan penuh. Efek Preloading yang akan saya bagikan ini tidak akan mempengaruhi kecepatan blog karena sangat ringan murni CSS dan SVG tanpa gambar. Sebelumnya saya juga pernah berbagi postingan terkait di sini Cara Memberikan Efek Animasi Loading Sederhana Saat Halaman Dimuat . Berikut tips Cara Memasang Efek Preloading Selengkapnya »

Cara Menonaktifkan Inspect Element di Blog

Gambar
Kemarin ada sobat blogger yang bertanya tentang bagaimana sih Cara Menonaktifkan Inspect Element di Blog seperti di blog Arlina Design ini? Penjelasan singkatnya, Inspect Element adalah salah satu fitur bermanfaat bawaan browser versi desktop yang mampu memperlihatkan, mengedit, bahkan mengubah kode HTML yang diambil dari sumber situs. Inspect Element sering digunakan oleh designer blog untuk mengetahui kode seperti kode CSS, HTML, javascript di blog. Selengkapnya »

Cara Memasang Syntax Highlighter di Postingan Blog

Gambar
Selain mempercantik tampilan barisan kode di postingan blog, penggunaan Syntax Highlighter juga dimaksudkan untuk pembaca agar dapat dengan mudah mengenali jenis kode yang diberikan oleh penulis. Efek penggunaan Syntax Highlighter lainnya yaitu pengunjung akan merasa lebih nyaman membaca isi konten blog, dan bagi penulis atau admin blog akan membuatnya menjadi lebih professional dalam menyajikan artikel-artikel pada blog tutorial mereka. Syntax Highlighter merupakan fitur khusus sebuah proses pemindahan kode bahasa pemrograman tertentu dengan tulisan, warna teks, posisi sama persis dengan yang terdapat pada sebuah kode bahasa pemrograman untuk dipindahkan maupun disalin ke dalam bentuk tulisan lain agar lebih mudah dalam membaca atau mempelajarinya. Selengkapnya »

Cara Menyortir Komentar Blogger dari yang Terbaru

Gambar
Seperti yang kita tahu, komentar blogger pada umumnya menyortir komentar dari komentar lama yang posisinya di atas dan komentar baru yang posisinya paling bawah. Nah bagaimana jika posisi komentar terbaru itu dibalik? Tumpah? 😅 nggak lah... Posisi komentar diurutkan dari yang terbaru, jadi posisi komentar terbaru akan berada di atas komentar lama. Bagaimana caranya? Caranya sangat mudah, silakan lakukan langkah mudah di bawah ini. Selengkapnya »

Perbaikan Tombol Share Whatsapp yang Tidak Berfungsi

Gambar
Berikut ini adalah Perbaikan Tombol Share Whatsapp yang Tidak Berfungsi setelah saya cek memang tidak berjalan sebagaimana mestinya khususnya pada template Infinite dan template lain yang saya bagikan di blog ini maupun blog Idntheme . Terima kasih kepada sobat yang sudah aware dengan hal ini. Untuk perbaikannya sangat mudah, silakan ikuti langkahnya di bawah ini Selengkapnya »

Notifikasi Adblocker Adsense Ala Kompi Ajaib

Gambar
Salam Blogger, kali ini Arlina Design akan berbagi tutorial cara memberikan notifikasi adblocker adsense saat pengguna mengakses blog dan mengaktifkan ekstensi adblock di browser. Tutorial ini saya dapat dari blog Kompi Ajaib yang dikelola oleh admin +Adhy Suryadi yang senantiasa memberikan trik dan tips blogger yang bermanfaat dan beliau sangat menginspirasi saya untuk membangun blog menjadi lebih baik. Mengenai penjelasan kenapa sobat perlu Menambahkan Notifikasi Adblocker Adsense di dalam blog sobat bisa mengunjungi sumbernya di https://www.kompiajaib.com/2016/07/membuat-notifikasi-untuk-pengguna.html Selengkapnya »

Membuat Tombol Demo dan Download Material Design

Gambar
Membuat Tombol Demo dan Download Material Design - Seperti yang kita ketahui, kini Material Design sudah menjadi tren sebagai antarmuka web atau UI (User Interface) baik itu pada perangkat mobile maupun desktop dalam sebuah halaman website. Antarmuka web ini pun disambut baik oleh pengguna maupun pengembang website karena memiliki segudang fitur yang bermanfaat serta tampilan yang lebih menarik. Pada kesempatan ini Arlina Design akan memberikan contoh tombol demo dan download yang ditambahkan dengan efek animasi ripple (gelombang) pada saat kita menekan tombol tersebut yang merupakan salah satu fitur seperti efek animasi dari Material Design. Selengkapnya »

Meta Tag Seo Friendly dan Valid HTML5

Gambar
Meta Tag Seo Friendly dan Valid HTML5 - Kali ini saya akan menjawab pertanyaan yang pernah ditanyakan sobat blogger yaitu tentang cara mengisi kode xxxxx yang saya tambahkan pada template-template yang saya bagikan. Mungkin diantara sobat blogger masih ada yang belum faham dengan meta tag ini, baiklah di sini saya akan menjelaskan sedikit tentang meta tag pada template blogger. Selengkapnya »

Cara Memasang Artikel Terkait di Dalam Postingan

Gambar
Cara Memasang Artikel Terkait di Dalam Postingan - Halo sobat blogger, tentunya sobat sudah mengetahui dengan fungsi sebuah widget artikel terkait di blog yang menampilkan sejumlah artikel terkait sesuai label di bawah artikel baik itu dalam bentuk link dan thumbnail ataupun link saja. Namun sedikit berbeda dari sebelumnya, di sini saya akan memberikan tutorial Cara Memasang Artikel Terkait di Dalam Postingan . Seperti yang saya singgung sebelumnya di artikel Cara Memasang Iklan Adsense di Tengah Postingan bahwa sobat juga bisa memasang kode atau widget lain di dalam kode tersebut, tutorial blogger kali ini pun masih menggunakan kode yang sama. Tutorial ini saya dapatkan dari blog http://www.bungfrangki.com/2015/12/membuat-related-pos-dalam-postingan.html dan telah saya modifikasi kembali disesuaikan dengan style saya. Selengkapnya »