Niko

Di artikel yang lalu saya telah mempublikan konten tentang favicon dan di artikel ini saya juga akan membahas tentang cara menambahkan custom favicon melalui tag link di html situs web/blog. Kelebihan menambahkan favicon dengan tag link adalah sebagai barikut: Support (mendukung) untuk semua platform web yang open source Support (mendukung) mobile browser dan dekstop Support (mendukung) banyak browser dan versi Sekarang kita langsung saja topik inti yaitu menambahkan icon atau favicon blog dengan tag link html, simak dengan baik, berikut ini adalah tag link favicon yang paling umum digunakan. [ads id="ads1"] <link rel="shortcut icon" href="URL/favicon.ico"/> <link rel="mask-icon" href="URL/safari-pinned-tab.svg" color="#5bbad5"/> <link rel="icon" type="image/png" href="URL/favicon-32x32.png" sizes="32x32"/> <link rel="icon" type="image/png" href=...

Table Of Contents CSS Table Of Contents HTML Table Of Contents On-Target (T.O.C) Cara Memasang / Membuat T.O.C Table of contents atau TOC adalah widget daftar isi yang digunakan untuk memudahkan pengunjung situs memahami isi halaman web dan menjelajahi bagian-bagian (section) halaman tersebut. Selain itu, table of contents juga memiliki peran penting dalam membuat konten web yang deskriptif dan seo friendly, Dengan adanya widget table of contents kita akan terlatih membuat konten yang bagus (deskriptif dan informatif). [ads id="ads1"] Yang lebih mengejutkan sekarang table of contents juga dapat dijadikan sebagai strategi untuk meningkatkan rasio klik tayang halaman di laman hasil penelusuran dari snippet halaman yang disertai dengan sitelink yang dipicu oleh widget table of contents. Nah, sekarang apakah kamu tertarik untuk membuat table of contents? Jika ya simak dengan baik tutorial table of contents (T.O.C) berikut ini: CSS Table Of Contents .table...

Apa itu widget recent posts? Widget recent posts adalah widget blog yang menampilkan postingan-postingan terbaru pada blog tersebut. Setiap kali admin blog memposting artikel terbaru maka postingan tersebut akan ditampilkan di widget recent posts. Adapun fungsi dari widget recent posts adalah untuk mempromosikan postingan-postingan terbaru kepada pengunjung blog. Sekarang saya akan menjelaskan kepada anda cara membuat widget recent posts yang simple dan ringan untuk blog anda, karena widget recent posts ini tidak memuat gamabar yang ada di postingan alias list style. Kelebihan / Spesifikasi Specification Availability Responsive True Mobile Friendly True Ringan (Fast Loading) True List Style True Membuat Widget Recent Posts Di Blog Masuk ke tata letak (Layout) blog Klik tambahkan widget Pilih widget feed Masukkan url blog anda, contoh: https://www.cordialblogger.com/ Kemuduian klik Enter untuk membuat widget recent posts [ads id="ads1"] Untuk merapikan tam...

Link wa.me adalah url navigasi panggilan dan pesan whatsapps melalui laman web. Meskipun link wa.me tidak masuk dalam ulasan MDN di artikel navigator metode atau navigator.registerprotocolhandler() , wa.me juga merupakan link navigasi yang berbasis protokol http/s . Perlu diketahui juga bahwa wa.me adalah versi short link dari https://api.whatsapp.com/send/?phone=number . Jadi untuk membuat navigasi panggilan dan message whatsapp di website/blog dapat menggunakan kedua type link WA yaitu: Type 1 https://wa.me/nomor hp Contoh: https://wa.me/6281261043687 [ads id="ads1"] Type 2 https://api.whatsapp.com/send/?phone=number Contoh: https://api.whatsapp.com/send/?phone=6281261043687 //Dengan teks (Chat Message) https://api.whatsapp.com/send/?phone=6281261043687&text=Hi can you help me? Di HTML <a href="https://wa.me/6281261043687" title="Hubungi Saya" rel="noopener" target="_blank">Hubungi Via WhatsApp</a> Outp...

Apa itu CodeBox Dan Tag Pre? Code Box adalah fitur untuk mengembed cuplikan code HTML, CSS, JS, Dan JQuery di halaman web / blog. Sedangkan pre tag atau <pre> code adalah tag html yang umum digunakan sebagai frame embed code (css, js, html dan jquery). Sebagai contoh lihah demo codebox pada gambar di bawah ini: Langkah-langkah Membuat Code Box <pre> </pre> [ads id="ads1"] Basically, tag pre atau <pre> code memiliki stylesheet sendiri yang disebut dengan user agent stylesheet atau css bawaan pada tag pre yaitu: pre { display: block; font-family: monospace; white-space: pre; margin: 1em 0px; } Jadi, untuk membuat codebox yang ramah kamu perlu menambahkan style tambahan pada tag pre misalnya style background color, border dan padding seperti berikut: pre { background-color: rgba(155,155,155,0.1); border: 1px solid rgba(155,155,155,0.3); padding: 10px; } Untuk meng-embed mini code (css, js, html dan jquery dalam size...