Niko

Apa yang dimaksud dengan error wrapper pada input element dan form? Pada case ini error wrapper yang saya maksud adalah block input element dan form melebihi/menembus hingga keluar dari pembungkus/wrapper. Biasanya error wrapper sering terjadi pada formulir kontak (contact form) dan form lainnya yang mengandung input element dengan style lebar penuh atau full width. Agar mudah dipahami mari kita lihat ilustrasi error wrapper pada elemen <input> dan <form> pada gambar berikut ini: [ads id="ads1"] Sebenarnya error wrapper merupakan masalah sederhana, meski demikian bagi pemula tentu saja ini sangat membingungkan. Maka dari itu disini saya akan menjelaskan secara rinci cara mengatasi error wrapper pada elemen input dan form. Mengatasi Error Wrapper <input> element dan <form> Cara yang paling mudah untuk mengatasi error wrapper adalah dengan menambahkan css box-sizing:border-box; pada elemen input, contoh: html <input class=" input-elem...

Google Sites adalah platform untuk membuat website dengan mudah, cepat dan geratis. Google sites sangat cocok untuk meromosikan produk-produk anda secara online maupun dengan iklan digital seperti fb ads, google ads dll. Maka dari itu disini saya akan menjelaskan cara membuat website single product di platform google sites, mulai dari cara membuat, desain dan membuat konten (produk) anda di website google sites. Kenapa Harus Google Sites Berikut ini adalah beberapa kelebihan google sites yang menjadikan platform ini sangat tepat untuk produk anda: [ads id="ads1"] Dari sisi desain dan fleksibilitas Google sites memiliki pilihan template yang sangat cocok untuk mempromosikan multiple product dan single product,event, portpolio, help centre, hingga website untuk project dan masih banyak lagi. Mudah di gunakan, siapa saja bisa membuat website di google sites. Support multi media seperti photo dan video hingga beberapa fitur/widget sebagai berikut (Collapsible text, Table of ...

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 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...