Cara Membuat Website Sederhana Dengan Html

Cara Membuat Website Sederhana Dengan Html – Dalam tutorial ini, kami akan mencoba membuat proyek web kecil. Tujuannya untuk berlatih dan memahami cara membuat web.

Pengembangan situs web dimulai dengan desain. Jika tidak ada desain, maka kita akan kesulitan dan tidak tahu harus berbuat apa.

Cara Membuat Website Sederhana Dengan Html

Cara Membuat Website Sederhana Dengan Html

Halaman beranda adalah halaman utama yang terbuka saat pengunjung pertama kali membuka situs. Halaman ini berisi menu, foto, teks dan tabel.

Belajar Html #16: Cara Hosting Website Di Netlify (kurang Dari 30 Detik, Langsung Go Online)

. Pastikan gambar yang ditambahkan memiliki ukuran persegi atau rasio tinggi lebar 1:1. Dalam proyek ini, saya menggunakan gambar berukuran 200×200 piksel.

Seperti halaman beranda, halaman ini juga memiliki konten video untuk ditampilkan. Tapi belum ada file videonya.

Konten di Internet tidak hanya berupa teks dan gambar. Namun bisa juga dalam bentuk multimedia, seperti audio dan video. Dalam tutorial ini, kita akan fokus pada audio dalam HTML.

Konten di Internet disajikan tidak hanya dalam bentuk teks dan gambar, tetapi juga dalam bentuk video. Mari pelajari cara menambahkan video ke HTML.

Tutorial Membuat Form Login Minimalis Dengan Html & Css

Jangan gunakan elemen semantik, situs Anda bisa dianggap tua 😄. Pelajari apa itu elemen semantik dalam HTML untuk membuat situs web modern.

Pada tutorial kali ini, kita akan mempelajari cara memformat teks pada HTML seperti bold, italic, underline, underline, rank, dll.

🔥 Tutorial Tailwind Artikel Terbaru #1: CSS Tailwind Dasar untuk Pemula 14 Desember 2022 • baca 7 menit. Tutorial Membuat REST API dengan Express, TypeScript, dan PostgreSQL 25 November 2022 • 10 mnt baca. Tutorial Docker: Cara Install dan Konfigurasi Docker dengan Benar! 24 November 2022 • Membaca 5 mnt. Cara mendapatkan API dengan Alpinejs untuk mengambil data dari backend 24 Nov 2022 • 4 mnt baca. Tutorial Tailwind: Membuat Kartu dengan Zoom di Hover 21 November 2022 • 3 menit baca. Pemahaman: Apa itu Numpy di Python? November 12, 2022 • read 7 menit Pernahkah Anda mendengar tentang website statis? Atau situs dinamis? Lalu apa perbedaan di antara mereka? Situs web statis memiliki konten tetap. Artinya, konten tidak dapat diubah lagi. Memperbarui konten pada website statis berbeda dengan website dinamis yang memiliki halaman admin yang dapat mengelola konten pada website. Halaman-halaman ini biasanya disebut sebagai CMS (Website Manajemen Konten). Ada beberapa jenis aplikasi CMS yang bisa Anda gunakan, salah satunya adalah WordPress. Untuk membuat situs web sederhana, Anda memerlukan HTML dan CSS.

Cara Membuat Website Sederhana Dengan Html

HTML atau Hypertext Markup Language adalah bahasa pemrograman yang menjadi standar untuk membuat website statis dan dinamis. Sedangkan CSS atau Cascading Style Sheet sendiri secara tidak langsung merupakan bagian dari HTML dan fungsi utamanya adalah untuk menyesuaikan elemen HTML.

Baca Juga :  Cara Mendaftar Adsense

Cara Membuat Halaman Web Sederhana Dengan Notepad: 15 Langkah

Anda akan memerlukan dua hal ini untuk membuat situs web statis, HTML sebagai alat untuk membuat struktur situs web, dan CSS yang digunakan untuk mendesain tata letak situs web statis.

Buat tata letak kasar untuk situs Anda menggunakan alat seperti Paint atau Photoshop, atau gambar dengan tangan. Tentukan header, body, dan footer.

Kembali lagi ke layout website yang kita buat, layout tersebut memiliki 3 bagian yaitu bagian HEADER, MAIN BODY dan FOOTER, silahkan letakkan ketiga bagian tersebut pada tag .

Yang bisa Anda lakukan selanjutnya adalah mengatur gaya tata letak CSS agar terlihat sama dengan tata letak yang kita buat sebelumnya. Harap lakukan hal berikut:

Cara Membuat Website Sederhana Dengan Html • Reezh Design

Buat file CSS bernama “layout.css”, lalu simpan di folder yang sama dengan file index.html yang Anda buat sebelumnya.

Tambahkan kelas pada tag elemen yang Anda buat sebelumnya, karena pemrograman CSS hanya dapat memanggil ID atau kelas yang telah ditentukan pada elemen.

Kemudian buka file *.CSS yang Anda buat sebelumnya, lalu timpa nama kelas di elemen HTML sebelumnya di file *.CSS. Berikut format penulisannya:

Cara Membuat Website Sederhana Dengan Html

Setiap nama kelas yang Anda tentukan di file *.CSS harus dimulai dengan karakter titik ( . ) di depan nama kelas, jika Anda menggunakan id di elemen HTML (id = “name_id”) maka tulis di *.CSS harus mulai dengan simbol pagar ( # ).

Panduan Lengkap Cara Desain Web Dengan Mudah|s1 Sistem Komputer S.kom

Sedangkan “kurung kurawal” setelah menuliskan nama class di file *.CSS adalah tempat kita akan meletakkan kode CSS di dalamnya.

Terakhir, yang perlu Anda lakukan adalah memasukkan kode-kode CSS berikut untuk masing-masing kelas tersebut sehingga membentuk tampilan atau tata letak, seperti pada gambar tata letak yang telah dibuat sebelumnya.

Nah berikut ini cara membuat website HTML dan CSS sederhana. Jika Anda memiliki pertanyaan tentang hal ini, tanyakan di kolom komentar dan jangan lupa untuk membagikan artikel ini. Sampai jumpa lagi. Pada kesempatan kali ini, saya akan membagikan pengalaman saya dalam coding situs. Pembuatan sebuah website biasanya membutuhkan waktu yang relatif lama, baik itu website jenis e-commerce, company profile, maupun layanan.

Lalu bisakah kita membuat kode web hanya dalam 15 menit? Ya, tentu saja kamu bisa. Website apa yang akan kita buat? Penasaran kan? Anda harus terus mengikuti saran dan panduan mengenai hal ini. Simak baik-baik dan langsung praktek ya teman-teman.

Cara Membuat Website Dengan Html Serta Css Secara Sederhana

Sebelum masuk ke contoh, ada baiknya Anda mempelajari HTML terlebih dahulu. Apakah Anda sudah tahu apa itu HTML? HTML adalah singkatan dari Hypertext Markup Language. HTML memungkinkan pengguna untuk membuat dan mengatur judul, paragraf, tautan, atau tautan dan kutipan untuk halaman-halaman situs web.

Baca Juga :  Cara Buat Video Promosi Produk

HTML sebenarnya bukan bahasa pemrograman, yang artinya tidak dapat membuat fitur dinamis. Contoh kode atau skrip untuk membuat paragraf.

Bagi sobat yang masih belum mengerti web apa yang akan dibuat, tentunya hal pertama yang kita lakukan adalah menentukan tema web yang akan dibuat. Oke langsung saja kita berikan contoh website sederhana dengan tema portfolio. Di sini kita akan mencoba membuat portofolio web menggunakan HTML5 dan beberapa keajaiban CSS3 agar terlihat sedikit menarik dan responsif. Apa itu mungkin? Kita tidak akan tahu sampai kita mencobanya, hehe.

Cara Membuat Website Sederhana Dengan Html

Pertama, buka editor teks. Setelah dibuka, pertama-tama kita akan membuat folder project. Anda dapat menyimpan folder di mana saja. Oke, ayolah. Kami akan membuat 2 file. Diantaranya adalah index.html dan style.css.

Belajar Html #15: Membuat Project Web Pribadi Dengan Html

Lorem ipsum dolor sit amet consectetur adipisicing elite. Dignissimo, aperiam dolore accepta velit repelllendus recusandae magni consectetur mollitia facere incidunt inventory perspiciatisdebitis doloribus ullam minima culpa voluptatem. Repelendus, varian.

Wah, hebat, bukan? Jika Anda tidak dapat menemukan gambar seperti ikon atau avatar media sosial, Anda dapat menemukannya di situs web ini.

Anda juga dapat memeriksa apakah situs web tersebut responsif atau tidak. Caranya adalah dengan memperbesar dan memperkecil atau memperbesar dan memperkecil di web browser.

Nah, itu saja yang bisa menjadi contoh, selebihnya Anda bisa berimprovisasi sendiri. Untuk membuat belajar web menjadi lebih menyenangkan, saya sarankan untuk mengambil kursus pemrograman web dasar di . Dijamin seru dan tentunya membantu kamu menjadi web developer profesional.

Membuat Halaman Web Dinamis Dengan Php

Simak juga artikel blog menarik lainnya yang bisa menambah ilmu baru yang super keren, diantaranya sebagai berikut : Pada kesempatan kali ini kita akan membahas cara membuat website dengan html dan css. Tetapi Anda perlu memastikan bahwa Anda setidaknya memahami dasar-dasar HTML.

Sebenarnya membangun website sekarang ini sangatlah mudah, bahkan ada beberapa CMS yang sudah menyediakan fungsionalitas website builder sehingga kita bahkan tidak perlu coding sama sekali. Namun alangkah baiknya jika Anda memahami cara membuat website dari awal tanpa bantuan tools atau CMS yang ada.

), serta bahasa pemrograman javascript dan PHP. Namun, untuk membuat website statis sederhana, Anda hanya membutuhkan HTML dan CSS.

Cara Membuat Website Sederhana Dengan Html

Saat saya membuat website, saya mengilustrasikan seperti membuat wireframe untuk membangun rumah, html seperti komponen untuk membangun rumah, sedangkan CSS menyatukan komponen-komponen tersebut agar rumah dapat dibangun dengan baik dan menarik.

Baca Juga :  Cara Mengelola Saham Bagi Pemula

Cara Membuat Biodata Diri Dengan Html Sederhana Dan Keren

Kami menggunakan CSS untuk mengatur jarak antar elemen, ukuran (tinggi, lebar), ukuran dan jenis font, warna, efek hover, dan lainnya.

Notepad adalah aplikasi paling standar yang tersedia di platform Windows. Jika Anda menginginkan sesuatu yang profesional, Anda harus menggunakan notepad++ atau sublime text 3. Dari ketiganya, saya paling merekomendasikan sublime text 3.

Pada HTML versi 5, setiap dokumen html yang dihasilkan harus dimulai dengan sintaks . Sintaks ini digunakan untuk memberi tahu browser bahwa dokumen html yang dihasilkan menggunakan versi 5. Fitur lain juga membantu browser merender setiap kode HTML. elemen dengan baik (karena menggunakan versi terbaru).

Setiap tag dalam html dirancang untuk memiliki pasangan, ada tag pembuka dan tag penutup, walaupun ada juga tag yang terpisah (standalone) seperti

Tutorial Belajar Html Lengkap Buat Pemula

untuk membuat garis baru


untuk membuat garis horizontal, dll.

Tag selanjutnya adalah tag yang berfungsi sebagai judul dokumen html yang kita buat. Pada bagian , kita dapat membuat judul dokumen, inisialisasi css, deskripsi, dan meta tag lainnya.

Di dalam tag terdapat tag untuk membuat judul yang nantinya akan ditampilkan pada menu tab di browser.</p> <p><img decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E" alt="Cara Membuat Website Sederhana Dengan Html" title="Cara Membuat Website Sederhana Dengan Html" style="width:100%;text-align:center" data-lazy-src="https://i3.wp.com/kodekreasi.com/wp-content/uploads/2020/07/Rust-26.png?strip=all" /><noscript><img decoding="async" src="https://i3.wp.com/kodekreasi.com/wp-content/uploads/2020/07/Rust-26.png?strip=all" alt="Cara Membuat Website Sederhana Dengan Html" title="Cara Membuat Website Sederhana Dengan Html" style="width:100%;text-align:center" /></noscript></p> <p>Bagian utama dalam struktur dokumen html adalah bagian , karena pada bagian ini kita berbicara tentang elemen yang muncul dan terlihat oleh pengguna, kita akan membuat banyak kode html.</p> <h2>Membuat Website Sederhana Html Css Part 3/11</h2> <p>Silahkan teman-teman pelajari topik-topik di atas, karena jika belum menguasainya maka akan kesulitan pada langkah-langkah selanjutnya.</p> <p>Kerangka kerja navigasi web adalah struktur yang menjelaskan bagaimana halaman di situs web berhubungan satu sama lain.</p> <p>Sebelum membuat situs web, penting untuk membuat struktur navigasi. Dibawah ini adalah contoh navigasi halaman website yang akan kita buat :</p> <p>Saat pertama kali pengguna mengakses website, halaman muka akan menjadi halaman utama, yang terdiri dari menu utama, kontak saya, dan tentang saya. Kami dapat menggunakan halaman beranda sebagai halaman indeks yang berisi konten artikel di situs web kami.</p> <h3>Belajar Html Dan Php</h3> <p>Layout adalah tata letak setiap elemen komponen pada website. Tata letak berfungsi untuk mencocokkan bagian-bagian</p> <p>Cara membuat website toko online dengan html, cara membuat website perusahaan dengan html, membuat website dengan html, cara membuat website dengan html di android, cara membuat website sederhana menggunakan html, cara membuat html website, cara membuat website pariwisata dengan html, cara membuat website gratis dengan html, cara membuat website perpustakaan dengan html, cara membuat website online dengan html, cara membuat website dengan html, cara membuat website makanan dengan html</p> </div> <footer class="entry-meta" aria-label="Meta postingan"> <span class="cat-links"><span class="gp-icon icon-categories"><svg viewBox="0 0 512 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em"><path d="M0 112c0-26.51 21.49-48 48-48h110.014a48 48 0 0143.592 27.907l12.349 26.791A16 16 0 00228.486 128H464c26.51 0 48 21.49 48 48v224c0 26.51-21.49 48-48 48H48c-26.51 0-48-21.49-48-48V112z" /></svg></span><span class="screen-reader-text">Kategori </span><a href="https://zannetdrive.com/blogging" rel="category tag">Blogging</a></span> <nav id="nav-below" class="post-navigation" aria-label="Pos Tunggal"> <span class="screen-reader-text">Navigasi Tulisan</span> <div class="nav-previous"><span class="gp-icon icon-arrow-left"><svg viewBox="0 0 192 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M178.425 138.212c0 2.265-1.133 4.813-2.832 6.512L64.276 256.001l111.317 111.277c1.7 1.7 2.832 4.247 2.832 6.513 0 2.265-1.133 4.813-2.832 6.512L161.43 394.46c-1.7 1.7-4.249 2.832-6.514 2.832-2.266 0-4.816-1.133-6.515-2.832L16.407 262.514c-1.699-1.7-2.832-4.248-2.832-6.513 0-2.265 1.133-4.813 2.832-6.512l131.994-131.947c1.7-1.699 4.249-2.831 6.515-2.831 2.265 0 4.815 1.132 6.514 2.831l14.163 14.157c1.7 1.7 2.832 3.965 2.832 6.513z" fill-rule="nonzero" /></svg></span><span class="prev" title="Sebelumnya"><a href="https://zannetdrive.com/2023/01/ayam-goreng-lengkuas-dan-sambal.html" rel="prev">Ayam Goreng Lengkuas Dan Sambal</a></span></div><div class="nav-next"><span class="gp-icon icon-arrow-right"><svg viewBox="0 0 192 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M178.425 256.001c0 2.266-1.133 4.815-2.832 6.515L43.599 394.509c-1.7 1.7-4.248 2.833-6.514 2.833s-4.816-1.133-6.515-2.833l-14.163-14.162c-1.699-1.7-2.832-3.966-2.832-6.515 0-2.266 1.133-4.815 2.832-6.515l111.317-111.316L16.407 144.685c-1.699-1.7-2.832-4.249-2.832-6.515s1.133-4.815 2.832-6.515l14.163-14.162c1.7-1.7 4.249-2.833 6.515-2.833s4.815 1.133 6.514 2.833l131.994 131.993c1.7 1.7 2.832 4.249 2.832 6.515z" fill-rule="nonzero" /></svg></span><span class="next" title="Berikut"><a href="https://zannetdrive.com/2023/01/aplikasi-yang-membuat-hp-tidak-lemot.html" rel="next">Aplikasi Yang Membuat Hp Tidak Lemot</a></span></div> </nav> </footer> </div> </article> <div class="comments-area"> <div id="comments"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">Tinggalkan komentar <small><a rel="nofollow" id="cancel-comment-reply-link" href="/2023/01/cara-membuat-website-sederhana-dengan-html.html#respond" style="display:none;">Batalkan balasan</a></small></h3><form action="https://zannetdrive.com/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-form-comment"><label for="comment" class="screen-reader-text">Komentar</label><textarea id="comment" name="comment" cols="45" rows="8" required></textarea></p><label for="author" class="screen-reader-text">Nama</label><input placeholder="Nama *" id="author" name="author" type="text" value="" size="30" required /> <label for="email" class="screen-reader-text">Surel</label><input placeholder="Surel *" id="email" name="email" type="email" value="" size="30" required /> <label for="url" class="screen-reader-text">Situs web</label><input placeholder="Situs web" id="url" name="url" type="url" value="" size="30" /> <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Simpan nama, email, dan situs web saya pada peramban ini untuk komentar saya berikutnya.</label></p> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Kirim Komentar" /> <input type='hidden' name='comment_post_ID' value='40744' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p></form> </div><!-- #respond --> </div><!-- #comments --> </div> </main> </div> </div> </div> <div class="site-footer"> <footer class="site-info" aria-label="Situs" itemtype="https://schema.org/WPFooter" itemscope> <div class="inside-site-info grid-container"> <div class="copyright-bar"> © 2023 ZannetDrive.com </div> </div> </footer> </div> <script type="rocketlazyloadscript" id="generate-a11y">!function(){"use strict";if("querySelector"in document&&"addEventListener"in window){var e=document.body;e.addEventListener("mousedown",function(){e.classList.add("using-mouse")}),e.addEventListener("keydown",function(){e.classList.remove("using-mouse")})}}();</script><script type="rocketlazyloadscript" src='https://zannetdrive.com/wp-content/plugins/gp-premium/menu-plus/functions/js/sticky.min.js?ver=2.2.0-alpha.1' id='generate-sticky-js' defer></script> <script type="rocketlazyloadscript" id='rocket-browser-checker-js-after'> "use strict";var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}();function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}var RocketBrowserCompatibilityChecker=function(){function RocketBrowserCompatibilityChecker(options){_classCallCheck(this,RocketBrowserCompatibilityChecker),this.passiveSupported=!1,this._checkPassiveOption(this),this.options=!!this.passiveSupported&&options}return _createClass(RocketBrowserCompatibilityChecker,[{key:"_checkPassiveOption",value:function(self){try{var options={get passive(){return!(self.passiveSupported=!0)}};window.addEventListener("test",null,options),window.removeEventListener("test",null,options)}catch(err){self.passiveSupported=!1}}},{key:"initRequestIdleCallback",value:function(){!1 in window&&(window.requestIdleCallback=function(cb){var start=Date.now();return setTimeout(function(){cb({didTimeout:!1,timeRemaining:function(){return Math.max(0,50-(Date.now()-start))}})},1)}),!1 in window&&(window.cancelIdleCallback=function(id){return clearTimeout(id)})}},{key:"isDataSaverModeOn",value:function(){return"connection"in navigator&&!0===navigator.connection.saveData}},{key:"supportsLinkPrefetch",value:function(){var elem=document.createElement("link");return elem.relList&&elem.relList.supports&&elem.relList.supports("prefetch")&&window.IntersectionObserver&&"isIntersecting"in IntersectionObserverEntry.prototype}},{key:"isSlowConnection",value:function(){return"connection"in navigator&&"effectiveType"in navigator.connection&&("2g"===navigator.connection.effectiveType||"slow-2g"===navigator.connection.effectiveType)}}]),RocketBrowserCompatibilityChecker}(); </script> <script id='rocket-preload-links-js-extra'> var RocketPreloadLinksConfig = {"excludeUris":"\/(.+\/)?feed\/?.+\/?|\/(?:.+\/)?embed\/|\/(index\\.php\/)?wp\\-json(\/.*|$)|\/wp-admin|\/logout|\/wp-login.php","usesTrailingSlash":"","imageExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif","fileExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|php|pdf|html|htm","siteUrl":"https:\/\/zannetdrive.com","onHoverDelay":"100","rateThrottle":"3"}; </script> <script type="rocketlazyloadscript" id='rocket-preload-links-js-after'> (function() { "use strict";var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e=function(){function i(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}}();function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var t=function(){function n(e,t){i(this,n),this.browser=e,this.config=t,this.options=this.browser.options,this.prefetched=new Set,this.eventTime=null,this.threshold=1111,this.numOnHover=0}return e(n,[{key:"init",value:function(){!this.browser.supportsLinkPrefetch()||this.browser.isDataSaverModeOn()||this.browser.isSlowConnection()||(this.regex={excludeUris:RegExp(this.config.excludeUris,"i"),images:RegExp(".("+this.config.imageExt+")$","i"),fileExt:RegExp(".("+this.config.fileExt+")$","i")},this._initListeners(this))}},{key:"_initListeners",value:function(e){-1<this.config.onHoverDelay&&document.addEventListener("mouseover",e.listener.bind(e),e.listenerOptions),document.addEventListener("mousedown",e.listener.bind(e),e.listenerOptions),document.addEventListener("touchstart",e.listener.bind(e),e.listenerOptions)}},{key:"listener",value:function(e){var t=e.target.closest("a"),n=this._prepareUrl(t);if(null!==n)switch(e.type){case"mousedown":case"touchstart":this._addPrefetchLink(n);break;case"mouseover":this._earlyPrefetch(t,n,"mouseout")}}},{key:"_earlyPrefetch",value:function(t,e,n){var i=this,r=setTimeout(function(){if(r=null,0===i.numOnHover)setTimeout(function(){return i.numOnHover=0},1e3);else if(i.numOnHover>i.config.rateThrottle)return;i.numOnHover++,i._addPrefetchLink(e)},this.config.onHoverDelay);t.addEventListener(n,function e(){t.removeEventListener(n,e,{passive:!0}),null!==r&&(clearTimeout(r),r=null)},{passive:!0})}},{key:"_addPrefetchLink",value:function(i){return this.prefetched.add(i.href),new Promise(function(e,t){var n=document.createElement("link");n.rel="prefetch",n.href=i.href,n.onload=e,n.onerror=t,document.head.appendChild(n)}).catch(function(){})}},{key:"_prepareUrl",value:function(e){if(null===e||"object"!==(void 0===e?"undefined":r(e))||!1 in e||-1===["http:","https:"].indexOf(e.protocol))return null;var t=e.href.substring(0,this.config.siteUrl.length),n=this._getPathname(e.href,t),i={original:e.href,protocol:e.protocol,origin:t,pathname:n,href:t+n};return this._isLinkOk(i)?i:null}},{key:"_getPathname",value:function(e,t){var n=t?e.substring(this.config.siteUrl.length):e;return n.startsWith("/")||(n="/"+n),this._shouldAddTrailingSlash(n)?n+"/":n}},{key:"_shouldAddTrailingSlash",value:function(e){return this.config.usesTrailingSlash&&!e.endsWith("/")&&!this.regex.fileExt.test(e)}},{key:"_isLinkOk",value:function(e){return null!==e&&"object"===(void 0===e?"undefined":r(e))&&(!this.prefetched.has(e.href)&&e.origin===this.config.siteUrl&&-1===e.href.indexOf("?")&&-1===e.href.indexOf("#")&&!this.regex.excludeUris.test(e.href)&&!this.regex.images.test(e.href))}}],[{key:"run",value:function(){"undefined"!=typeof RocketPreloadLinksConfig&&new n(new RocketBrowserCompatibilityChecker({capture:!0,passive:!0}),RocketPreloadLinksConfig).init()}}]),n}();t.run(); }()); </script> <!--[if lte IE 11]> <script src='https://zannetdrive.com/wp-content/themes/generatepress/assets/js/classList.min.js?ver=3.1.3' id='generate-classlist-js'></script> <![endif]--> <script id='generate-menu-js-extra'> var generatepressMenu = {"toggleOpenedSubMenus":"1","openSubMenuLabel":"Buka Submenu","closeSubMenuLabel":"Tutup submenu"}; </script> <script type="rocketlazyloadscript" src='https://zannetdrive.com/wp-content/themes/generatepress/assets/js/menu.min.js?ver=3.1.3' id='generate-menu-js' defer></script> <script id='generate-navigation-search-js-extra'> var generatepressNavSearch = {"open":"Buka Kolom Pencarian","close":"Tutup Kolom Pencarian"}; </script> <script type="rocketlazyloadscript" src='https://zannetdrive.com/wp-content/themes/generatepress/assets/js/navigation-search.min.js?ver=3.1.3' id='generate-navigation-search-js' defer></script> <script type="rocketlazyloadscript" src='https://zannetdrive.com/wp-includes/js/comment-reply.min.js?ver=6.1.1' id='comment-reply-js' defer></script> <script>window.lazyLoadOptions={elements_selector:"img[data-lazy-src],.rocket-lazyload,iframe[data-lazy-src]",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,callback_loaded:function(element){if(element.tagName==="IFRAME"&&element.dataset.rocketLazyload=="fitvidscompatible"){if(element.classList.contains("lazyloaded")){if(typeof window.jQuery!="undefined"){if(jQuery.fn.fitVids){jQuery(element).parent().fitVids()}}}}}};window.addEventListener('LazyLoad::Initialized',function(e){var lazyLoadInstance=e.detail.instance;if(window.MutationObserver){var observer=new MutationObserver(function(mutations){var image_count=0;var iframe_count=0;var rocketlazy_count=0;mutations.forEach(function(mutation){for(i=0;i<mutation.addedNodes.length;i++){if(typeof mutation.addedNodes[i].getElementsByTagName!=='function'){continue} if(typeof mutation.addedNodes[i].getElementsByClassName!=='function'){continue} images=mutation.addedNodes[i].getElementsByTagName('img');is_image=mutation.addedNodes[i].tagName=="IMG";iframes=mutation.addedNodes[i].getElementsByTagName('iframe');is_iframe=mutation.addedNodes[i].tagName=="IFRAME";rocket_lazy=mutation.addedNodes[i].getElementsByClassName('rocket-lazyload');image_count+=images.length;iframe_count+=iframes.length;rocketlazy_count+=rocket_lazy.length;if(is_image){image_count+=1} if(is_iframe){iframe_count+=1}}});if(image_count>0||iframe_count>0||rocketlazy_count>0){lazyLoadInstance.update()}});var b=document.getElementsByTagName("body")[0];var config={childList:!0,subtree:!0};observer.observe(b,config)}},!1)</script><script type="rocketlazyloadscript" data-no-minify="1" async src="https://zannetdrive.com/wp-content/plugins/hmjrock/assets/js/lazyload/16.1/lazyload.min.js"></script><script>function lazyLoadThumb(e){var t='<img loading="lazy" data-lazy-src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"><noscript><img src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"></noscript>',a='<div class="play"></div>';return t.replace("ID",e)+a}function lazyLoadYoutubeIframe(){var e=document.createElement("iframe"),t="ID?autoplay=1";t+=0===this.dataset.query.length?'':'&'+this.dataset.query;e.setAttribute("src",t.replace("ID",this.dataset.src)),e.setAttribute("frameborder","0"),e.setAttribute("allowfullscreen","1"),e.setAttribute("allow", "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"),this.parentNode.replaceChild(e,this)}document.addEventListener("DOMContentLoaded",function(){var e,t,a=document.getElementsByClassName("rll-youtube-player");for(t=0;t<a.length;t++)e=document.createElement("div"),e.setAttribute("data-id",a[t].dataset.id),e.setAttribute("data-query", a[t].dataset.query),e.setAttribute("data-src", a[t].dataset.src),e.innerHTML=lazyLoadThumb(a[t].dataset.id),e.onclick=lazyLoadYoutubeIframe,a[t].appendChild(e)});</script> </body> </html> <!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me -->