Cara Buat Website Html Css

Cara Buat Website Html Css – Sampai jumpa lagi. Pada kesempatan kali ini saya akan berbagi pengalaman saya tentang coding website. Baik itu website e-commerce, company profile atau layanan, biasanya membutuhkan waktu yang relatif lama untuk membuat website.

Jadi bisakah kita membuat kode web hanya dalam 15 menit? Ya, tentu saja kamu bisa. Situs apa yang akan kita buat? Menarik, ya? Sebaiknya ikuti terus tips dan trik ini, ya. Simak baik-baik dan segera praktekkan ya teman-teman.

Cara Buat Website Html Css

Cara Buat Website Html Css

Sebelum beralih ke contoh, ada baiknya mengetahui HTML. Tahukah Anda apa itu HTML? HTML adalah singkatan dari Hypertext Markup Language. HTML memungkinkan pengguna untuk membuat dan menyusun judul, paragraf, tautan atau tautan, dan memblokir kutipan untuk halaman situs web.

Membuat Kolom Layout Template Html Css + Div

HTML sebenarnya bukan bahasa pemrograman, artinya HTML tidak memiliki kemampuan untuk membuat fungsionalitas dinamis. Contoh kode atau script untuk membuat paragraf.

Bagi sobat yang masih bingung ingin membuat website seperti apa, tentunya yang pertama kita lakukan adalah menentukan tema web yang akan dibuat. Nah, mari kita beri contoh website sederhana dengan tema portofolio. Disini kita akan mencoba membuat web portfolio menggunakan sentuhan ajaib HTML5 dan CSS3 agar tampilannya sedikit menarik dan responsive. Ini mungkin? Hehe kita tidak akan tahu sampai kita mencobanya.

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

Lorem ipsum dolor sit amet consectetur adipisicing elite. Dignissimos, aperiam doore asumsinda velit repellendus recusandae magni consectetur mollitia facere Incident inventory perspicatitisdebitis doloribus ullam ullam culpa voluptatem. Repellentus, pilihan.

Cara Membuat Halaman Web Sederhana Dengan Html: 9 Langkah

Wah, hebat, kan? Jika Anda bingung mencari gambar seperti ikon media sosial atau avatar, Anda bisa menemukannya di website ini.

Anda juga dapat memeriksa apakah situs web responsif atau tidak. Masalahnya adalah memperbesar dan memperkecil atau memperbesar dan memperkecil browser web.

Nah, itu saja yang bisa menjadi contoh, selebihnya Anda bisa berimprovisasi sendiri. Untuk membuat belajar web lebih menyenangkan, saya sarankan untuk mengambil kelas Pemrograman Web Pembelajaran Dasar di sini. Dijamin seru dan pastinya akan mengantarkan Anda menjadi seorang web developer profesional.

Cara Buat Website Html Css

Simak juga artikel-artikel menarik lainnya di blog yang bisa menambah pengetahuan super baru diantaranya sebagai berikut. Pada dasarnya jika kita ingin membuat sebuah website atau halaman website, tentunya kita harus terlebih dahulu memahami dasar atau dasar utamanya. Apa gunanya konten web? Poin-poin penting, dimana kita dituntut untuk memahami kode-kode tertentu atau sering disebut bahasa pemrograman.

Baca Juga :  Cara Membuat Website Ecommerce

Cara Membuat Replit Html Untuk Pemula (tutorial Repl.it)

Mungkin sulit bagi seorang pemula untuk memahami dan memahami banyak istilah dalam kode ini.

Oleh karena itu, pada kesempatan kali ini saya akan mencoba membahas tentang contoh dasar atau cara dasar membuat website sederhana. Jika kita ingin memulai membuat web, kita tidak hanya perlu mengerti atau mengerti, tetapi juga harus memiliki rumah dan alamat rumah agar nantinya bisa dikunjungi banyak orang.

Apa itu rumah dan alamat rumah? Rumah dan alamat rumah berarti Hosting dan Domain.

Hosting seperti rumah atau apartemen dengan ukuran dan tata letak yang berbeda. Meskipun domain tersebut adalah alamat kita nantinya, kita bisa mengunjunginya jika sudah selesai membangun rumah.

Cara Membuat Website Dengan Html Dan Css

Dimana bisa membeli hosting dan domain terpercaya dengan dukungan fast response 24 jam? Anda dapat merujuk ke Niagahoster atau penyedia lainnya.

Nah, di sini saya berasumsi bahwa Anda sudah memiliki hosting dan domain. Dan untuk memulai tutorial ini kita membutuhkan:

Berikut adalah langkah pertama: Pertama, masuk ke cpanel hosting Anda, lalu klik filemanager, lalu buat file dengan ekstensi index.html dan salin kode html berikut:

Cara Buat Website Html Css

Tempelkan ke file index.html yang Anda buat sebelumnya. Langkah selanjutnya, Anda akan membuat file lain bernama style.css misalnya di root file manager dan salin kode css berikut:

Tutorial Html Part 19

Jika sudah melakukan semua persiapan seperti di atas, tinggal klik tombol “Simpan”. Pastikan untuk memeriksa hasilnya.

Padahal, membuat website atau website dengan html dan css bisa dibilang mudah. Nah kalau kita sudah paham dasar-dasarnya dan paham, sama seperti yang saya jelaskan tadi, pernahkah anda mendengar tentang website statis? Atau situs web dinamis? Jadi apa perbedaan antara keduanya? Situs web statis memiliki konten tetap. Ini berarti bahwa konten tidak dapat diubah lagi. Mengupdate konten pada website statis berbeda dengan website dinamis yang memiliki halaman admin yang dapat mengelola konten pada website. Halaman-halaman ini biasanya disebut CMS (Content Management Website). Ada beberapa jenis aplikasi CMS yang bisa Anda gunakan, salah satunya adalah wordpress. Untuk membuat website sederhana, Anda membutuhkan HTML dan CSS.

HTML atau Hypertext Markup Language adalah bahasa pemrograman standar untuk membuat website statis dan dinamis. Meskipun CSS atau Cascading Style Sheet sendiri secara tidak langsung merupakan bagian dari HTML, fungsi utamanya adalah untuk mengkustomisasi elemen dalam HTML.

Baca Juga :  Tidak Bisa Daftar Adsense Youtube

Dua hal yang Anda perlukan untuk membuat situs web statis adalah HTML sebagai alat untuk membuat struktur situs web dan CSS untuk merancang tata letak situs web statis.

Membuat Full Page Background Website Dengan Html Dan Css

Siapkan tata letak kasar situs web Anda, Anda dapat menggunakan alat seperti Paint atau Photoshop atau menggambarnya dengan tangan. Atur Header, Body dan Footer.

Jika kita melihat layout website yang telah kita buat, layout tersebut memiliki 3 bagian yaitu bagian HEADER, MAIN BODY dan FOOTTER, silahkan sisipkan ketiga bagian tersebut pada tag .

Yang bisa Anda lakukan selanjutnya adalah menata Layout CSS agar terlihat sama dengan Layout yang kita buat sebelumnya. Ikuti langkah ini:

Cara Buat Website Html Css

Buat file CSS dengan nama ‘layout.css’, lalu simpan file tersebut di folder yang sama dengan file index.html yang Anda buat sebelumnya.

Cara Membuat Template WordPress Responsive Html5

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

Setelah itu, silahkan buka file *.CSS yang telah Anda buat tadi lalu definisikan kembali nama class pada elemen HTML sebelumnya di file *.CSS. Berikut format postingannya:

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

Namun, setelah menulis nama kelas di file *.CSS, simbol ‘curl’ adalah tempat kita akan memasukkan kode CSS.

Form Registrasi Simpel Dengan Html, Css Dan Bootstrap

Terakhir, Anda perlu memasukkan kode CSS berikut untuk masing-masing kelas ini untuk membuat tampilan atau tata letak seperti pada gambar Tata Letak yang dibuat sebelumnya.

Cara membuat website HTML dan CSS yang bagus dan sederhana. Jika ada pertanyaan mengenai hal ini maka tulis di kolom komentar dan jangan lupa untuk membagikan artikel ini. Pada kesempatan kali ini kita akan membahas cara membuat website menggunakan html dan css. Tetapi Anda setidaknya harus memastikan bahwa Anda memahami dasar-dasar html.

Nyatanya, membuat website saat ini sangat mudah, bahkan ada beberapa CMS yang menyediakan fitur website builder yang tidak memerlukan coding sama sekali. Namun alangkah baiknya jika Anda memahami cara membuat website dari awal tanpa bantuan tools atau CMS yang ada.

Cara Buat Website Html Css

) serta bahasa pemrograman JavaScript dan PHP. Namun, HTML dan CSS saja sudah cukup untuk membuat situs web statis sederhana.

Mudah Mengatur Layout Html Dengan Css Grid

Saat membangun website, saya menggambarkannya sebagai membuat kerangka kerja untuk membangun rumah, html seperti komponen untuk membangun rumah, sedangkan CSS akan membuat komponen-komponen tersebut menjadi satu kesatuan yang utuh sehingga rumah dapat dibangun dengan baik dan menarik.

Baca Juga :  Apa Itu Dropship Dan Cara Kerjanya

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

Notepad adalah program paling standar dan sudah tersedia di platform Windows. Jika Anda ingin menjadi profesional, Anda harus menggunakan notepad++ atau sublime text 3. Dari ketiganya, teks luhur yang paling saya rekomendasikan adalah 3.

Setiap kali Anda membuat dokumen html di HTML versi 5, Anda harus memulainya dengan sintaks . Sintaks ini berfungsi untuk memberi tahu browser bahwa dokumen html juga dibuat menggunakan fungsi lain, versi 5. membantu browser untuk merender setiap elemen html dengan baik (karena menggunakan versi terbaru).

Template Situs Web Sederhana Gratis Berbasis Html & Css 2020

Dalam desain html, setiap tag memiliki pasangan, ada tag pembuka dan tag penutup, meskipun ada beberapa tag tunggal (independen).

buat baris baru


buat garis horizontal dll.

Tag selanjutnya adalah tag yang berfungsi sebagai header dari dokumen html yang sedang kita buat. Di bagian kita bisa membuat judul dokumen, inisialisasi css, deskripsi dan meta tag lainnya.

Cara Buat Website Html Css

Di dalam tag terdapat tag untuk membuat judul yang kemudian akan ditampilkan pada menu tab di browser.</p> <h2>Cara Membuat Rating Menggunakan Html Css</h2> <p>Bagian utama dalam struktur dokumen html adalah bagian , karena pada bagian ini berkaitan dengan elemen-elemen yang terlihat dan terlihat oleh pengguna, kita akan membuat banyak kode html.</p> <p>Teman-teman silahkan pelajari dulu topik-topik di atas, karena jika belum menguasainya akan bersusah payah di tahap selanjutnya.</p> <p>Struktur navigasi web adalah struktur yang menggambarkan bagaimana halaman di situs web terkait satu sama lain.</p> <p>Sebelum membuat situs web, penting untuk membuat struktur navigasi. Di bawah ini adalah contoh navigasi halaman web yang akan kita buat:</p> <h2>Cara Mengedit/membuat File Html Di Android</h2> <p>Saat pengguna pertama kali mengakses situs web, halaman indeks akan menjadi halaman utama dengan menu</p> <p>Buat website html css, cara membuat website dengan html css dan javascript, membuat website html dan css, website html dan css, template website html css, cara buat website html, html css website, cara buat website dengan html dan css, cara membuat website html css, free website templates css html, website templates html css, membuat website html css</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/2022/11/gejala-infeksi-saluran-kencing-bagian-bawah-adalah.html" rel="prev">Gejala Infeksi Saluran Kencing Bagian Bawah Adalah</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/2022/11/web-editor-yang-dapat-digunakan-untuk-membuat-website-yaitu.html" rel="next">Web Editor Yang Dapat Digunakan Untuk Membuat Website Yaitu</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="/2022/11/cara-buat-website-html-css.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='20137' 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"> © 2022 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 -->