Dalam dunia pengembangan web, ada satu bahasa pemrograman yang menjadi pondasi dari hampir seluruh website yang Anda kunjungi setiap hari. Bahasa itu adalah HTML. Tanpa HTML, halaman web tidak akan memiliki struktur, konten, maupun tampilan yang bisa diakses oleh siapa pun.
Bagi Anda yang baru memasuki dunia digital maupun yang sedang mempertimbangkan untuk membangun website bisnis, memahami HTML adalah langkah awal yang sangat berharga. Artikel ini akan membahas secara lengkap apa itu HTML, bagaimana cara kerjanya, dan mengapa pengetahuan dasar ini penting untuk fondasi digital Anda.
Apa Itu HTML
HTML merupakan singkatan dari HyperText Markup Language. Secara sederhana, HTML adalah bahasa markup standar yang digunakan untuk membuat dan menyusun konten di halaman web. Berbeda dengan bahasa pemrograman seperti Python atau JavaScript, HTML tidak memiliki logika perulangan atau percabangan. Fungsinya adalah memberi tahu browser bagaimana menyusun dan menampilkan elemen-elemen di layar.
HTML bekerja dengan sistem tag. Setiap tag memberi instruksi spesifik kepada browser tentang jenis konten yang sedang ditampilkan. Misalnya, ada tag untuk paragraf, gambar, tautan, judul, tabel, dan berbagai elemen lainnya.
Sejarah Singkat HTML
HTML pertama kali dikembangkan oleh Tim Berners-Lee pada tahun 1991. Saat itu, internet masih dalam tahap awal dan belum sebesar sekarang. Sejak saat itu, HTML terus mengalami perkembangan melalui berbagai versi, mulai dari HTML 2.0, HTML 3.2, HTML 4.01, hingga HTML5 yang menjadi standar saat ini.
Setiap versi baru HTML membawa peningkatan fitur, kompatibilitas, dan kemampuan untuk mendukung konten multimedia yang semakin kompleks. HTML5 sendiri menjadi tonggak penting karena memungkinkan penggunaan elemen multimedia seperti video dan audio tanpa bergantung pada plugin tambahan.
Struktur Dasar HTML
Setiap dokumen HTML memiliki struktur standar yang harus diikuti. Berikut adalah kerangka dasarnya:
`html
Judul Halaman
Judul Konten
Ini adalah paragraf.
`
Mari kita bedah satu per satu:
→ Deklarasi yang memberi tahu browser bahwa dokumen ini menggunakan standar HTML5.
→ Elemen akar yang membungkus seluruh konten halaman.
→ Bagian yang berisi metadata seperti judul halaman, deskripsi, dan link ke stylesheet.
</strong> → Menentukan judul yang muncul di tab browser.</li>
<li><strong><body></strong> → Tempat seluruh konten visual halaman ditempatkan.</li>
<h2>Elemen-Elemen Penting dalam HTML</h2>
<h3>1. Heading (Judul)</h3>
<p>HTML menyediakan enam level heading, dari <code></p>
<h1></code> hingga <code></p>
<h6></code>. Tag <code></p>
<h1></code> digunakan untuk judul utama, sementara <code></p>
<h6></code> adalah sub-heading terkecil. Penggunaan heading yang terstruktur tidak hanya membantu pembaca manusia, tetapi juga membantu mesin pencari memahami hierarki konten halaman Anda.</p>
<h3>2. Paragraf dan Teks</h3>
<p>Tag <code></p>
<p></code> digunakan untuk membuat paragraf. Selain itu, ada beberapa tag yang berkaitan dengan teks, antara lain:</p>
<li><code><strong></code> untuk teks yang ditebalkan secara semantik.</li>
<li><code><em></code> untuk teks yang dimiringkan secara semantik.</li>
<li><code><span></code> untuk mengelompokkan bagian teks tertentu tanpa makna semantik khusus.</li>
<h3>3. Tautan (Link)</h3>
<p>Tautan dibuat menggunakan tag <code><a></code>. Contohnya:</p>
<p><code>`</code>html<br />
<a href="https://find.co.id/">Kunjungi Find.co.id</a><br />
<code>`</code></p>
<p>Atribut <code>href</code> menentukan tujuan tautan. Tautan adalah elemen fundamental dari web, karena menghubungkan satu halaman ke halaman lain dan membentuk jaringan informasi yang luas.</p>
<h3>4. Gambar</h3>
<p>Gambar disisipkan menggunakan tag <code><img></code>. Tag ini bersifat self-closing, artinya tidak memiliki tag penutup.</p>
<p><code>`</code>html<br />
<img decoding="async" src="gambar.jpg" alt="Deskripsi gambar"><br />
<code>`</code></p>
<p>Atribut <code>alt</code> sangat penting karena memberikan deskripsi alternatif untuk pembaca layar dan juga ketika gambar gagal dimuat.</p>
<h3>5. Daftar (List)</h3>
<p>HTML mendukung dua jenis daftar utama. Daftar tidak berurutan menggunakan tag <code></p>
<ul></code> dengan <code></p>
<li></code> di dalamnya, sedangkan daftar berurutan menggunakan <code>
<ol></code>. Penggunaan daftar membantu menyajikan informasi secara terstruktur dan mudah dipindai.</p>
<h3>6. Tabel</h3>
<p>Tabel digunakan untuk menampilkan data dalam format baris dan kolom. Tag utamanya meliputi <code></p>
<table></code>, <code></p>
<tr></code> untuk baris, <code></p>
<th></code> untuk header kolom, dan <code></p>
<td></code> untuk sel data.</p>
<h2>Atribut dalam HTML</h2>
<p>Setiap elemen HTML dapat memiliki atribut yang memberikan informasi tambahan. Beberapa atribut yang paling sering digunakan antara lain:</p>
<li><strong>class</strong> → Digunakan untuk mengelompokkan elemen agar bisa distyling dengan CSS.</li>
<li><strong>id</strong> → Memberikan identitas unik pada sebuah elemen.</li>
<li><strong>src</strong> → Menentukan sumber file, seperti gambar atau script.</li>
<li><strong>href</strong> → Menentukan URL tujuan tautan.</li>
<li><strong>alt</strong> → Teks alternatif untuk gambar.</li>
<h2>Perbedaan HTML, CSS, dan JavaScript</h2>
<p>Banyak orang awam mencampuradukkan ketiga teknologi ini. Padahal, masing-masing memiliki peran yang berbeda dan saling melengkapi.</p>
<p>HTML bertugas menyusun <strong>struktur</strong> konten. CSS bertanggung jawab atas <strong>tampilan dan gaya visual</strong> seperti warna, ukuran, dan layout. Sementara JavaScript menambahkan <strong>interaktivitas dan fungsionalitas dinamis</strong> seperti animasi, validasi form, dan manipulasi konten secara real-time.</p>
<p>Ketiganya bekerja bersama membentuk pengalaman web yang utuh. Tanpa HTML, CSS dan JavaScript tidak memiliki dasar untuk bekerja.</p>
<h2>HTML dan SEO</h2>
<p>Struktur HTML yang baik berpengaruh langsung terhadap performasi SEO sebuah website. Mesin pencari membaca kode HTML untuk memahami konten halaman. Beberapa praktik HTML yang mendukung SEO antara lain:</p>
<li>Menggunakan heading secara hierarkis dan relevan.</li>
<li>Menambahkan atribut <code>alt</code> pada setiap gambar.</li>
<li>Menggunakan tag <code><title></code> dan meta deskripsi yang deskriktif.</li>
<li>Membuat struktur URL yang bersih dan logis.</li>
<li>Memastikan markup valid dan bebas dari error.</li>
<p>Jika Anda membangun website tanpa memperhatikan struktur HTML yang benar, kemungkinan besar halaman tersebut akan sulit ditemukan oleh mesin pencari.</p>
<h2>Kesalahan Umum yang Sering Terjadi</h2>
<p>Dalam praktiknya, ada beberapa kesalahan umum yang sering dilakukan oleh pemula:</p>
<ul>
<li><strong>Tidak menutup tag</strong> → Setiap tag pembuka harus ditutup, kecuali elemen self-closing seperti <code><img></code> atau <code><br /></code>.</li>
<li><strong>Menggunakan heading sembarangan</strong> → Jangan langsung menggunakan <code><br />
<h3></code> tanpa <code></p>
<h1></code> dan <code></p>
<h2></code> sebelumnya.</li>
<li><strong>Mengabaikan validasi</strong> → Selalu periksa apakah kode HTML Anda valid menggunakan validator resmi dari W3C.</li>
<li><strong>Terlalu banyak elemen div</strong> → Penggunaan <code>
<div></code> yang berlebihan tanpa makna semantik membuat kode sulit dibaca dan kurang optimal untuk SEO.</li>
</ul>
<h2>Mengapa Memahami HTML Tetap Relevan</h2>
<p>Mungkin Anda bertanya, mengapa perlu memahami HTML di era platform website builder dan template siap pakai? Jawabannya sederhana: pengetahuan HTML memberikan Anda <strong>kendali penuh</strong> terhadap apa yang terjadi di balik layar website Anda.</p>
<p>Dengan memahami HTML, Anda bisa melakukan kustomisasi yang lebih presisi, memahami error yang muncul, berkomunikasi lebih efektif dengan developer, dan membuat keputusan yang lebih bijak terkait pengembangan website bisnis Anda.</p>
<h2>Mulai Fondasi Digital Anda Sekarang</h2>
<p>HTML hanyalah satu dari sekian banyak komponen yang membentuk website yang tangguh. Namun, tanpa fondasi ini, seluruh bangunan digital Anda akan rapuh. Memahami cara kerja HTML membuka pintu menuju pemahaman yang lebih luas tentang bagaimana web bekerja secara keseluruhan.</p>
<p>Di Find.co.id, kami percaya bahwa pengetahuan adalah langkah awal menuju keberanian untuk sukses. Fondasi digital yang kuat dimulai dari pemahaman dasar yang benar, dan dikembangkan dengan strategi yang tepat.</p>
<p>Jika Anda siap membawa kehadiran digital bisnis Anda ke level yang lebih tinggi, tim kami siap membantu. <strong>Konsultasi dan desain awal gratis</strong> tersedia untuk Anda di <a href="https://find.co.id/">Find.co.id</a>. Mulailah langkah besar Anda hari ini.</p>
</div>
<div class="fc-bottom-share">
<span class="fc-bottom-share-label">Bagikan:</span>
<button class="fc-btn-white fc-share-native-btn">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2">
<circle cx="18" cy="5" r="3"></circle>
<circle cx="6" cy="12" r="3"></circle>
<circle cx="18" cy="19" r="3"></circle>
<line x1="8.59" y1="13.51" x2="15.42" y2="17.49"></line>
<line x1="15.41" y1="6.51" x2="8.59" y2="10.49"></line>
</svg>
Share
</button>
<button class="fc-copy-url-btn">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2">
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
</svg>
Copy URL
</button>
</div>
<div class="fc-author-box">
<img src="http://find.co.id/wp-content/uploads/2026/02/find.co_.id_.jpg" alt="Find.co.id"
class="fc-author-avatar">
<div class="fc-author-info">
<h4>Find.co.id</h4>
<p>Apa pun profesi maupun bisnis yang Anda tekuni, Anda harus berani sukses. Optimalkan
potensi, temui ekspektasi, harus berani mulai dari kini, karena sukses Anda, dapat
datang kapan saja. Apakah Anda sudah siap untuk tetap menjadi pemenang? Berani sukses.
Mulai dari website.</p>
<div class="fc-author-buttons">
<a href="https://find.co.id" class="fc-btn-primary">Kunjungi find.co.id</a>
<a href="https://find.co.id/artikel" class="fc-btn-outline" style="color: #000000 !important;">Lihat Semua Artikel</a>
</div>
</div>
</div>
</div>
<!-- Right Column (Sidebar) -->
<aside class="fc-blog-sidebar" style="position: relative !important;">
<div class="fc-sidebar-widget"
style="background: #f8fafc !important; padding: 2rem !important; border-radius: 16px !important; border: 1px solid #e2e8f0 !important; position: sticky !important; top: 115px !important; z-index: 10 !important;">
<h3
style="font-family: 'Plus Jakarta Sans', sans-serif !important; font-size: 1.25rem !important; color: #151b41 !important; margin-top: 0 !important; margin-bottom: 1.5rem !important; font-weight: 700 !important; border-bottom: 2px solid #e2e8f0 !important; padding-bottom: 0.75rem !important;">
Artikel Wawasan Lainnya
</h3>
<div class="fc-random-posts-wrapper" style="display: flex !important; flex-direction: column !important; gap: 1rem !important;"><a href="https://find.co.id/70-website-keren-yang-wajib-diketahui-ensiklopedia-digital-untuk-produktivitas-kreativitas-dan-hiburan-tanpa-batas/" class="fc-rand-post-card" style="display: flex !important; gap: 1rem !important; align-items: center !important; text-decoration: none !important; color: inherit !important; border-radius: 12px !important; transition: transform 0.3s ease !important; cursor: pointer !important;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Artikel-Website-Indonesia-2-300x167.webp" alt="70+ Website Keren yang Wajib Diketahui: Ensiklopedia Digital untuk Produktivitas, Kreativitas, dan Hiburan Tanpa Batas" style="width: 80px !important; height: 80px !important; object-fit: cover !important; border-radius: 8px !important; flex-shrink: 0 !important;"><div style="display: flex !important; flex-direction: column !important; gap: 0.25rem !important;"><h4 style="margin: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 600 !important; font-size: 0.95rem !important; line-height: 1.4 !important; color: #151b41 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; transition: color 0.2s ease !important;">70+ Website Keren yang Wajib Diketahui: Ensiklopedia Digital untuk Produktivitas, Kreativitas, dan Hiburan Tanpa Batas</h4><span style="font-size: 0.8rem !important; color: #64748b !important; font-family: 'Inter', sans-serif !important;">11 March 2026</span></div></a><a href="https://find.co.id/memahami-npm-package-manager-manajemen-dependensi-modern-untuk-pengembangan-efisien/" class="fc-rand-post-card" style="display: flex !important; gap: 1rem !important; align-items: center !important; text-decoration: none !important; color: inherit !important; border-radius: 12px !important; transition: transform 0.3s ease !important; cursor: pointer !important;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-246-300x169.webp" alt="Memahami NPM Package Manager: Manajemen Dependensi Modern untuk Pengembangan Efisien" style="width: 80px !important; height: 80px !important; object-fit: cover !important; border-radius: 8px !important; flex-shrink: 0 !important;"><div style="display: flex !important; flex-direction: column !important; gap: 0.25rem !important;"><h4 style="margin: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 600 !important; font-size: 0.95rem !important; line-height: 1.4 !important; color: #151b41 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; transition: color 0.2s ease !important;">Memahami NPM Package Manager: Manajemen Dependensi Modern untuk Pengembangan Efisien</h4><span style="font-size: 0.8rem !important; color: #64748b !important; font-family: 'Inter', sans-serif !important;">17 March 2026</span></div></a><a href="https://find.co.id/memahami-hukum-hasil-yang-semakin-berkurang-dalam-bisnis-dan-kehidupan/" class="fc-rand-post-card" style="display: flex !important; gap: 1rem !important; align-items: center !important; text-decoration: none !important; color: inherit !important; border-radius: 12px !important; transition: transform 0.3s ease !important; cursor: pointer !important;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-107-300x169.webp" alt="Memahami Hukum Hasil yang Semakin Berkurang dalam Bisnis dan Kehidupan" style="width: 80px !important; height: 80px !important; object-fit: cover !important; border-radius: 8px !important; flex-shrink: 0 !important;"><div style="display: flex !important; flex-direction: column !important; gap: 0.25rem !important;"><h4 style="margin: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 600 !important; font-size: 0.95rem !important; line-height: 1.4 !important; color: #151b41 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; transition: color 0.2s ease !important;">Memahami Hukum Hasil yang Semakin Berkurang dalam Bisnis dan Kehidupan</h4><span style="font-size: 0.8rem !important; color: #64748b !important; font-family: 'Inter', sans-serif !important;">17 March 2026</span></div></a><a href="https://find.co.id/panduan-lengkap-monaco-editor-fitur-keunggulan-dan-implementasi/" class="fc-rand-post-card" style="display: flex !important; gap: 1rem !important; align-items: center !important; text-decoration: none !important; color: inherit !important; border-radius: 12px !important; transition: transform 0.3s ease !important; cursor: pointer !important;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-155-300x169.webp" alt="Panduan Lengkap Monaco Editor: Fitur, Keunggulan, dan Implementasi" style="width: 80px !important; height: 80px !important; object-fit: cover !important; border-radius: 8px !important; flex-shrink: 0 !important;"><div style="display: flex !important; flex-direction: column !important; gap: 0.25rem !important;"><h4 style="margin: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif !important; font-weight: 600 !important; font-size: 0.95rem !important; line-height: 1.4 !important; color: #151b41 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; transition: color 0.2s ease !important;">Panduan Lengkap Monaco Editor: Fitur, Keunggulan, dan Implementasi</h4><span style="font-size: 0.8rem !important; color: #64748b !important; font-family: 'Inter', sans-serif !important;">17 March 2026</span></div></a></div><style>.fc-rand-post-card:hover h4 { color: #2563eb !important; } .fc-rand-post-card:hover { transform: translateY(-2px) !important; }</style>
</div>
</aside>
</div>
</section>
<!-- Dynamic Script for sharing -->
<script>
document.addEventListener('DOMContentLoaded', function () {
const shareNatives = document.querySelectorAll('.fc-share-native-btn');
const copyUrls = document.querySelectorAll('.fc-copy-url-btn');
// Hero section buttons (by ID)
const heroShareBtn = document.getElementById('fcShareNative');
const heroCopyUrlBtn = document.getElementById('fcCopyUrl');
// Share Native buttons (by class)
shareNatives.forEach(btn => {
btn.addEventListener('click', async () => {
try {
if (navigator.share) {
await navigator.share({
title: document.title,
url: window.location.href
});
} else {
alert('Fitur share tidak didukung di browser ini. Silakan copy URL.');
}
} catch (err) {
console.error('Error sharing:', err);
}
});
});
// Hero Share button handler
if (heroShareBtn) {
heroShareBtn.addEventListener('click', async () => {
try {
if (navigator.share) {
await navigator.share({
title: document.title,
url: window.location.href
});
} else {
alert('Fitur share tidak didukung di browser ini. Silakan copy URL.');
}
} catch (err) {
console.error('Error sharing:', err);
}
});
}
// Copy URL buttons (by class)
copyUrls.forEach(btn => {
btn.addEventListener('click', () => {
navigator.clipboard.writeText(window.location.href).then(() => {
const originalText = btn.innerHTML;
btn.innerHTML = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg> Copied!';
setTimeout(() => {
btn.innerHTML = originalText;
}, 2000);
});
});
});
// Hero Copy URL button handler
if (heroCopyUrlBtn) {
heroCopyUrlBtn.addEventListener('click', () => {
navigator.clipboard.writeText(window.location.href).then(() => {
const originalHTML = heroCopyUrlBtn.innerHTML;
heroCopyUrlBtn.innerHTML = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg> Copied!';
setTimeout(() => {
heroCopyUrlBtn.innerHTML = originalHTML;
}, 2000);
});
});
}
});
// Inject Promo Box in the meantime of WordPress Content
document.addEventListener('DOMContentLoaded', function () {
const contentInner = document.querySelector('.fc-post-content-inner');
if (contentInner) {
// Get all H2 and H3 elements
const h2Elements = Array.from(contentInner.querySelectorAll('h2'));
const h3Elements = Array.from(contentInner.querySelectorAll('h3'));
// Also get other elements for fallback
const allElements = Array.from(contentInner.children).filter(el => ['P', 'H2', 'H3', 'UL', 'OL', 'BLOCKQUOTE', 'FIGURE', 'DIV'].includes(el.tagName));
const promoImages = [
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id-Mulai-dari-Website.webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(1a).webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(7).webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(5).webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(4).webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(3).webp',
'https://findme.b-cdn.net/Storage/Find.co.id/Homepage%20Asset/Find.co.id%20-%20Images%20(1).webp'
];
// Shuffle array to randomize images
const shuffledImages = [...promoImages].sort(() => Math.random() - 0.5);
// Get unique images for each promo box (ensure no duplicates across 3 promos)
// Use fixed indices to guarantee different images from the shuffled array
const promoImage1 = shuffledImages[0];
const promoImage2 = shuffledImages[1];
const promoImage3 = shuffledImages[2];
function createPromoHTML(imageUrl, isFirst = false) {
const marginClass = isFirst ? 'fc-first-promo' : '';
return `
<a href="https://find.co.id" class="fc-new-promo-box ${marginClass}" style="text-decoration: none !important; color: inherit !important; display: block !important;">
<div class="fc-new-promo-container">
<div class="fc-new-promo-left" style="align-items: flex-start !important; text-align: left !important;">
<h3 class="fc-new-promo-title" style="font-size: 1.5rem !important;">Berani Sukses.<br>Mulai dari Website.</h3>
<span class="fc-new-promo-btn" style="color: #ffffff !important;">Cek Harga</span>
</div>
<div class="fc-new-promo-right">
<img src="${imageUrl}" alt="Promo Banner" class="fc-new-promo-image" />
</div>
</div>
</a>
`;
}
// Strategy: Insert ABOVE H2 preferentially, then H3
let promoTargets = [];
// Get all heading elements in order
const allHeadings = [...h2Elements, ...h3Elements].sort((a, b) => {
return a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
});
// First priority: Use H2 elements
if (h2Elements.length >= 2) {
// Use 2 different H2s
promoTargets.push(h2Elements[1]); // Above 2nd H2
promoTargets.push(h2Elements[h2Elements.length - 1]); // Above last H2
} else if (h2Elements.length === 1) {
// Use the single H2
promoTargets.push(h2Elements[0]);
// Need second promo - check H3
if (h3Elements.length >= 1) {
promoTargets.push(h3Elements[0]); // Above first H3
}
} else {
// No H2 - use H3 elements
if (h3Elements.length >= 2) {
promoTargets.push(h3Elements[1]); // Above 2nd H3
promoTargets.push(h3Elements[h3Elements.length - 1]); // Above last H3
} else if (h3Elements.length === 1) {
promoTargets.push(h3Elements[0]);
}
}
// If still need more targets, use fallback positions
if (promoTargets.length < 2 && allElements.length >= 2) {
const firstThird = Math.floor(allElements.length / 3);
const secondThird = Math.floor((allElements.length * 2) / 3);
// Add fallback targets
if (!promoTargets.includes(allElements[firstThird])) {
promoTargets.push(allElements[firstThird]);
}
if (!promoTargets.includes(allElements[secondThird])) {
promoTargets.push(allElements[secondThird]);
}
}
// Insert FIRST promo at the TOP of content (no top margin)
contentInner.insertAdjacentHTML('afterbegin', createPromoHTML(promoImage1, true));
// Insert promos - use beforebegin to put ABOVE the target
if (promoTargets.length >= 1) {
promoTargets[0].insertAdjacentHTML('beforebegin', createPromoHTML(promoImage2, false));
}
if (promoTargets.length >= 2) {
promoTargets[1].insertAdjacentHTML('beforebegin', createPromoHTML(promoImage3, false));
} else if (promoTargets.length === 1 && allElements.length > 2) {
// If only 1 target but we have more elements, insert at another position
const insertIndex = Math.min(3, allElements.length - 1);
allElements[insertIndex].insertAdjacentHTML('beforebegin', createPromoHTML(promoImage3, false));
} else if (promoTargets.length === 0 && allElements.length > 0) {
// Ultimate fallback: just use the allElements as before (original logic)
if (allElements.length >= 5) {
const firstThird = Math.floor(allElements.length / 3);
const secondThird = Math.floor((allElements.length * 2) / 3);
allElements[firstThird].insertAdjacentHTML('afterend', createPromoHTML(promoImage2, false));
allElements[secondThird].insertAdjacentHTML('afterend', createPromoHTML(promoImage3, false));
} else if (allElements.length >= 3) {
const middleIndex = Math.floor(allElements.length / 2);
allElements[middleIndex - 1].insertAdjacentHTML('afterend', createPromoHTML(promoImage2, false));
allElements[middleIndex].insertAdjacentHTML('afterend', createPromoHTML(promoImage3, false));
} else if (allElements.length === 2) {
allElements[0].insertAdjacentHTML('afterend', createPromoHTML(promoImage2, false));
allElements[1].insertAdjacentHTML('afterend', createPromoHTML(promoImage3, false));
} else if (allElements.length === 1) {
allElements[0].insertAdjacentHTML('afterend', createPromoHTML(promoImage2, false));
}
} else if (promoTargets.length === 0 && allElements.length === 0) {
// If absolutely no elements, just insert at the beginning of content
contentInner.insertAdjacentHTML('afterbegin', createPromoHTML(promoImage2, false));
}
}
});
// Copy Content Functionality
document.addEventListener('DOMContentLoaded', function() {
const copyContentButtons = document.querySelectorAll('#fcCopyContent');
copyContentButtons.forEach(btn => {
btn.addEventListener('click', function() {
// Get post title
const postTitle = document.querySelector('.fc-insp-title')?.textContent?.trim() || document.title;
// Get current URL
const postUrl = window.location.href;
// Get the content container
const contentContainer = document.querySelector('.fc-post-content-inner');
if (contentContainer) {
// Clone the content to manipulate it without affecting the display
const contentClone = contentContainer.cloneNode(true);
// Remove promo boxes (fc-new-promo-box) and fc-cool-promo-box
const promoBoxes = contentClone.querySelectorAll('.fc-new-promo-box, .fc-cool-promo-box');
promoBoxes.forEach(box => box.remove());
// Also remove any elements containing "Berani Sukses" or "Cek Harga"
const allElements = contentClone.querySelectorAll('*');
allElements.forEach(el => {
const text = el.textContent || '';
if (text.includes('Berani Sukses') || text.includes('Cek Harga')) {
// Check if this is a promo element
if (el.classList.contains('fc-new-promo-box') ||
el.classList.contains('fc-cool-promo-box') ||
el.classList.contains('fc-new-promo-title') ||
el.classList.contains('fc-new-promo-btn') ||
el.closest('.fc-new-promo-box') ||
el.closest('.fc-cool-promo-box')) {
el.remove();
}
}
});
// Get the cleaned HTML content
let cleanContent = contentClone.innerHTML;
// Convert HTML to plain text with basic formatting
const tempDiv = document.createElement('div');
tempDiv.innerHTML = cleanContent;
// Get text content but preserve some structure
let formattedContent = '';
const children = tempDiv.children;
for (let child of children) {
formattedContent += child.textContent + '\n\n';
}
// Build the final copied text
const copyText = `${postTitle}\n\n${postUrl}\n\nDipublikasikan oleh: Find.co.id\n\n${formattedContent.trim()}`;
// Copy to clipboard
navigator.clipboard.writeText(copyText).then(() => {
// Show success feedback on the button
const originalHTML = btn.innerHTML;
btn.innerHTML = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg> Copied!';
setTimeout(() => {
btn.innerHTML = originalHTML;
}, 2000);
}).catch(err => {
console.error('Failed to copy:', err);
alert('Gagal menyalin konten. Silakan coba lagi.');
});
}
});
});
});
</script>
<section class="fc-blog-section" id="artikel">
<div class="fc-section-container">
<div class="fc-section-header fc-reveal">
<span class="fc-section-tag">Artikel</span>
<h2 class="fc-section-title">Wawasan &<br class="fc-mobile-br"> Sumber Daya</h2>
<p class="fc-section-desc">Perkaya perspektif dan inspirasi Anda melalui ide, tren teknologi,
wawasan bisnis, serta kurasi informasi menarik dari berbagai topik.</p>
</div>
<div class="fc-blog-grid">
<article class="fc-blog-card fc-reveal"><a href="https://find.co.id/desain-grafis-sebagai-fondasi-bisnis-modern-oleh-find-co-id/" style="text-decoration: none; color: inherit; display: block; height: 100%;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-345.webp" alt="Desain Grafis sebagai Fondasi Bisnis Modern oleh Find.co.id" class="fc-blog-image"><div class="fc-blog-content"><div class="fc-blog-date"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>17 March 2026</div><span class="fc-blog-category">Desain</span><h3 class="fc-blog-title">Desain Grafis sebagai Fondasi Bisnis Modern oleh Find.co.id</h3><p class="fc-blog-excerpt">Dalam lanskap bisnis yang semakin terhubung dan visual, desain grafis telah berkembang dari sekadar estetika...</p><span class="fc-blog-link">Baca Selengkapnya<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7" /></svg></span></div></a></article><article class="fc-blog-card fc-reveal"><a href="https://find.co.id/inovasi-schumpeterian-memahami-kekuatan-destruksi-kreatif-dalam-dunia-bisnis-modern-find-co-id/" style="text-decoration: none; color: inherit; display: block; height: 100%;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-303.webp" alt="Inovasi Schumpeterian: Memahami Kekuatan Destruksi Kreatif dalam Dunia Bisnis Modern | Find.co.id" class="fc-blog-image"><div class="fc-blog-content"><div class="fc-blog-date"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>17 March 2026</div><span class="fc-blog-category">Eksplorasi</span><h3 class="fc-blog-title">Inovasi Schumpeterian: Memahami Kekuatan Destruksi Kreatif dalam Dunia Bisnis Modern | Find.co.id</h3><p class="fc-blog-excerpt">Dalam sejarah pemikiran ekonomi, ada satu nama yang terus bergema setiap kali dunia membicarakan tentang...</p><span class="fc-blog-link">Baca Selengkapnya<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7" /></svg></span></div></a></article><article class="fc-blog-card fc-reveal"><a href="https://find.co.id/hukum-amara-kunci-pengendalian-diri-untuk-kesuksesan-bisnis-dan-hidup/" style="text-decoration: none; color: inherit; display: block; height: 100%;"><img src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/uploads/2026/03/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-69.webp" alt="Hukum Amara: Kunci Pengendalian Diri untuk Kesuksesan Bisnis dan Hidup" class="fc-blog-image"><div class="fc-blog-content"><div class="fc-blog-date"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>17 March 2026</div><span class="fc-blog-category">Eksplorasi</span><h3 class="fc-blog-title">Hukum Amara: Kunci Pengendalian Diri untuk Kesuksesan Bisnis dan Hidup</h3><p class="fc-blog-excerpt">Dalam perjalanan menuju kesuksesan, baik dalam bisnis maupun kehidupan pribadi, kita sering menghadapi pertarungan terbesar...</p><span class="fc-blog-link">Baca Selengkapnya<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7" /></svg></span></div></a></article>
</div>
</div>
</section>
<section class="fc-cta-section">
<div class="fc-cta-container fc-reveal">
<h2 class="fc-cta-title">Siap Memulai<br>Proyek Website Anda?</h2>
<p class="fc-cta-desc">Konsultasikan kebutuhan website bisnis Anda secara gratis. Tim kami siap membantu
mewujudkan website impian Anda.</p>
<div class="fc-cta-buttons">
<a href="https://find.co.id" class="fc-btn-white" style="font-size: 1.125rem !important; font-weight: 700 !important;">
Cek Harga Website
</a>
</div>
</div>
</section>
<footer class="fc-footer">
<div class="fc-footer-container">
<div class="fc-footer-top">
<div class="fc-footer-brand">
<div class="fc-footer-logo">
<img src="https://findme.b-cdn.net/Storage/Find.co.id/Logos/Find.co.id.svg" alt=""
class="fc-footer-logo-img">
<span class="fc-footer-logo-text">find.co.id</span>
</div>
<p class="fc-footer-tagline">Solusi pembuatan website profesional dan terjangkau untuk bisnis
Indonesia. Wujudkan kehadiran digital Anda bersama kami.</p>
</div>
<div class="fc-footer-column">
<h4 class="fc-footer-title">Navigasi</h4>
<ul class="fc-footer-links">
<li><a href="https://find.co.id/#portfolio" class="fc-footer-link">Karya</a></li>
<li><a href="https://find.co.id/#studio" class="fc-footer-link">Studio</a></li>
<li><a href="https://find.co.id/#addons" class="fc-footer-link">Add-ons</a></li>
<li><a href="https://find.co.id/artikel" class="fc-footer-link">Artikel</a></li>
</ul>
</div>
<div class="fc-footer-column">
<h4 class="fc-footer-title">Kontak</h4>
<ul class="fc-footer-links">
<li><a href="https://wa.me/+6289673526725" class="fc-footer-link" target="_blank"
rel="noopener">WhatsApp</a></li>
<li><a href="mailto:www.find.co.id@gmail.com"
class="fc-footer-link">www.find.co.id@gmail.com</a></li>
</ul>
</div>
<div class="fc-footer-column">
<h4 class="fc-footer-title">Office</h4>
<p class="fc-footer-tagline"
style="margin-bottom: 1rem !important; line-height: 1.6 !important;">
Perumahan Bukit Cimelati Asri No. L8, Desa Telonjaya, Cicurug, Sukabumi Regency, West Java
43359
</p>
<a href="https://maps.app.goo.gl/rwmSpc3K7FNPDuD37" target="_blank" rel="noopener"
class="fc-footer-link" style="text-decoration: underline !important;">
Lihat di Google Map →
</a>
</div>
</div>
<div class="fc-footer-bottom">
<p class="fc-copyright" id="fc-dynamic-year">©
<script>
document.write(new Date().getFullYear())
</script> find.co.id. Semua hak dilindungi.
</p>
<div class="fc-social-links">
<a href="#" class="fc-social-link" aria-label="Instagram">
<img src="https://findme.b-cdn.net/Storage/Find.co.id/Others/Icons/Instagram.svg"
alt="Instagram" class="fc-social-icon">
</a>
<a href="#" class="fc-social-link" aria-label="Youtube">
<img src="https://findme.b-cdn.net/Storage/Find.co.id/Others/Icons/Youtube.svg"
alt="Youtube" class="fc-social-icon">
</a>
<a href="#" class="fc-social-link" aria-label="Tiktok">
<img src="https://findme.b-cdn.net/Storage/Find.co.id/Others/Icons/Tiktok.svg" alt="Tiktok"
class="fc-social-icon">
</a>
</div>
</div>
</div>
</footer>
<script>
const navbar = document.querySelector('.fc-navbar');
const navWrapper = document.querySelector('.fc-nav-wrapper');
const mobileToggle = document.querySelector('.fc-mobile-toggle');
const mobileMenu = document.querySelector('.fc-mobile-menu');
const mobileLinks = document.querySelectorAll('.fc-mobile-link, .fc-mobile-menu .fc-nav-cta');
const revealElements = document.querySelectorAll('.fc-reveal');
// Get the hero/inspiration section to calculate when to change header
const heroSection = document.querySelector('.fc-inspiration-section');
let processTop = 0;
function updateProcessTop() {
if (heroSection) {
processTop = heroSection.offsetHeight - 100; // Change when hero section ends
}
}
// Initial calculation
updateProcessTop();
// Recalculate on resize
window.addEventListener('resize', updateProcessTop);
function handleScroll() {
/* Add new code here */
if (window.scrollY > 50) {
navWrapper.classList.add('fc-scrolled');
if (window.innerWidth > 768) {
if (window.scrollY >= processTop) {
navbar.classList.add('fc-navbar-scrolled');
navbar.classList.remove('fc-navbar-dark');
} else {
navbar.classList.add('fc-navbar-dark');
navbar.classList.remove('fc-navbar-scrolled');
}
} else {
navbar.classList.add('fc-navbar-scrolled');
navbar.classList.remove('fc-navbar-dark');
}
} else {
navbar.classList.remove('fc-navbar-scrolled', 'fc-navbar-dark');
navWrapper.classList.remove('fc-scrolled');
}
}
window.addEventListener('scroll', handleScroll);
// Call handleScroll on page load to set initial state
handleScroll();
function toggleMobileMenu() {
const isActive = mobileMenu.classList.contains('fc-active');
mobileMenu.classList.toggle('fc-active');
mobileToggle.setAttribute('aria-expanded', !isActive);
// When mobile menu is open, apply scrolled state styles to header
if (!isActive) {
navbar.classList.add('fc-navbar-scrolled');
navWrapper.classList.add('fc-scrolled');
} else {
// Restore original state when menu closes (if not scrolled)
if (window.scrollY <= 50) {
navbar.classList.remove('fc-navbar-scrolled');
navWrapper.classList.remove('fc-scrolled');
}
}
}
mobileToggle.addEventListener('click', toggleMobileMenu);
mobileLinks.forEach(function (link) {
link.addEventListener('click', function () {
mobileMenu.classList.remove('fc-active');
mobileToggle.setAttribute('aria-expanded', 'false');
});
});
console.log('Reveal elements found:', revealElements.length);
console.log('Reveal elements:', Array.from(revealElements).map(el => el.className));
const processSteps = document.querySelectorAll('.fc-process-step');
console.log('Process steps found:', processSteps.length);
console.log('Process steps have fc-reveal:', Array.from(processSteps).map(el => el.classList.contains('fc-reveal')));
const observerOptions = {
root: null,
rootMargin: '0px',
threshold: 0.1
};
function handleIntersect(entries, observer) {
entries.forEach(function (entry) {
console.log('Element intersecting:', entry.target.className, entry.isIntersecting);
if (entry.isIntersecting) {
entry.target.classList.add('fc-visible');
observer.unobserve(entry.target);
}
});
}
const observer = new IntersectionObserver(handleIntersect, observerOptions);
revealElements.forEach(function (el) {
observer.observe(el);
});
document.querySelectorAll('a[href^="#"]').forEach(function (anchor) {
anchor.addEventListener('click', function (e) {
const targetId = this.getAttribute('href');
if (targetId && targetId.startsWith('#') && targetId !== '#') {
e.preventDefault();
const targetElement = document.querySelector(targetId);
if (targetElement) {
// Dynamically match the exact height + top margin of the scrolled headers
const headerOffset = window.innerWidth <= 768 ? 60 : 56;
const elementPosition = targetElement.getBoundingClientRect().top;
const offsetPosition = elementPosition + window.pageYOffset - headerOffset;
window.scrollTo({
top: offsetPosition,
behavior: 'smooth'
});
}
}
});
});
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
if (prefersReducedMotion.matches) {
document.querySelectorAll('.fc-floating-card').forEach(function (card) {
card.style.animation = 'none';
});
}
document.addEventListener('DOMContentLoaded', function () {
const coverContainer = document.querySelector('.fc-hero');
if (coverContainer) {
const setViewportHeight = () => {
if (window.CSS && window.CSS.supports && window.CSS.supports('min-height', '100dvh')) {
return;
}
let vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`);
if (!coverContainer.classList.contains('fc-hero-js-resize')) {
coverContainer.classList.add('fc-hero-js-resize');
}
};
setViewportHeight();
let resizeTimeout;
window.addEventListener('resize', () => {
clearTimeout(resizeTimeout);
resizeTimeout = setTimeout(setViewportHeight, 100);
});
window.addEventListener('orientationchange', setViewportHeight);
}
});
</script>
</div>
</body>
</html> </div>
</div>
</div>
<script type="speculationrules">
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/hello-elementor/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
</script>
<script>
const lazyloadRunObserver = () => {
const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` );
const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => {
entries.forEach( ( entry ) => {
if ( entry.isIntersecting ) {
let lazyloadBackground = entry.target;
if( lazyloadBackground ) {
lazyloadBackground.classList.add( 'e-lazyloaded' );
}
lazyloadBackgroundObserver.unobserve( entry.target );
}
});
}, { rootMargin: '200px 0px 200px 0px' } );
lazyloadBackgrounds.forEach( ( lazyloadBackground ) => {
lazyloadBackgroundObserver.observe( lazyloadBackground );
} );
};
const events = [
'DOMContentLoaded',
'elementor/lazyload/observe',
];
events.forEach( ( event ) => {
document.addEventListener( event, lazyloadRunObserver );
} );
</script>
<script src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-content/themes/hello-elementor/assets/js/hello-frontend.js?ver=3.4.6" id="hello-theme-frontend-js"></script>
<script src="https://find.co.id/wp-content/plugins/elementor/assets/js/webpack.runtime.min.js?ver=3.35.3" id="elementor-webpack-runtime-js"></script>
<script src="https://find.co.id/wp-content/plugins/elementor/assets/js/frontend-modules.min.js?ver=3.35.3" id="elementor-frontend-modules-js"></script>
<script src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-includes/js/jquery/ui/core.min.js?ver=1.13.3" id="jquery-ui-core-js"></script>
<script id="elementor-frontend-js-before">
var elementorFrontendConfig = {"environmentMode":{"edit":false,"wpPreview":false,"isScriptDebug":false},"i18n":{"shareOnFacebook":"Share on Facebook","shareOnTwitter":"Share on Twitter","pinIt":"Pin it","download":"Download","downloadImage":"Download image","fullscreen":"Fullscreen","zoom":"Zoom","share":"Share","playVideo":"Play Video","previous":"Previous","next":"Next","close":"Close","a11yCarouselPrevSlideMessage":"Previous slide","a11yCarouselNextSlideMessage":"Next slide","a11yCarouselFirstSlideMessage":"This is the first slide","a11yCarouselLastSlideMessage":"This is the last slide","a11yCarouselPaginationBulletMessage":"Go to slide"},"is_rtl":false,"breakpoints":{"xs":0,"sm":480,"md":768,"lg":1025,"xl":1440,"xxl":1600},"responsive":{"breakpoints":{"mobile":{"label":"Mobile Portrait","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Landscape","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet Portrait","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Landscape","value":1200,"default_value":1200,"direction":"max","is_enabled":false},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}},"hasCustomBreakpoints":false},"version":"3.35.3","is_static":false,"experimentalFeatures":{"e_font_icon_svg":true,"additional_custom_breakpoints":true,"container":true,"e_optimized_markup":true,"theme_builder_v2":true,"hello-theme-header-footer":true,"e_pro_free_trial_popup":true,"nested-elements":true,"home_screen":true,"global_classes_should_enforce_capabilities":true,"e_variables":true,"cloud-library":true,"e_opt_in_v4_page":true,"e_components":true,"e_interactions":true,"e_editor_one":true,"import-export-customization":true,"mega-menu":true,"e_pro_variables":true},"urls":{"assets":"https:\/\/find.co.id\/wp-content\/plugins\/elementor\/assets\/","ajaxurl":"https:\/\/find.co.id\/wp-admin\/admin-ajax.php","uploadUrl":"http:\/\/find.co.id\/wp-content\/uploads"},"nonces":{"floatingButtonsClickTracking":"cadda7d680"},"swiperClass":"swiper","settings":{"page":[],"editorPreferences":[]},"kit":{"active_breakpoints":["viewport_mobile","viewport_tablet"],"global_image_lightbox":"yes","lightbox_enable_counter":"yes","lightbox_enable_fullscreen":"yes","lightbox_enable_zoom":"yes","lightbox_enable_share":"yes","lightbox_title_src":"title","lightbox_description_src":"description","hello_header_logo_type":"logo","hello_footer_logo_type":"logo"},"post":{"id":8261,"title":"Memahami%20HTML%3A%20Fondasi%20Dasar%20Membangun%20Website%20yang%20Solid%20Bersama%20Find.co.id","excerpt":"","featuredImage":"https:\/\/bunny-wp-pullzone-nzeq1mofkh.b-cdn.net\/wp-content\/uploads\/2026\/03\/Find.co_.id-Berani-Sukses-Mulai-dari-Website-Jasa-Pembuatan-Website-Indonesia-67-1024x576.webp"}};
//# sourceURL=elementor-frontend-js-before
</script>
<script src="https://find.co.id/wp-content/plugins/elementor/assets/js/frontend.min.js?ver=3.35.3" id="elementor-frontend-js"></script>
<script src="https://find.co.id/wp-content/plugins/3.35.1%20elementor-pro/assets/js/webpack-pro.runtime.min.js?ver=3.35.1" id="elementor-pro-webpack-runtime-js"></script>
<script src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-includes/js/dist/hooks.min.js?ver=dd5603f07f9220ed27f1" id="wp-hooks-js"></script>
<script src="https://bunny-wp-pullzone-nzeq1mofkh.b-cdn.net/wp-includes/js/dist/i18n.min.js?ver=c26c3dc7bed366793375" id="wp-i18n-js"></script>
<script id="wp-i18n-js-after">
wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } );
//# sourceURL=wp-i18n-js-after
</script>
<script id="elementor-pro-frontend-js-before">
var ElementorProFrontendConfig = {"ajaxurl":"https:\/\/find.co.id\/wp-admin\/admin-ajax.php","nonce":"296328dae6","urls":{"assets":"https:\/\/find.co.id\/wp-content\/plugins\/3.35.1 elementor-pro\/assets\/","rest":"https:\/\/find.co.id\/wp-json\/"},"settings":{"lazy_load_background_images":true},"popup":{"hasPopUps":false},"shareButtonsNetworks":{"facebook":{"title":"Facebook","has_counter":true},"twitter":{"title":"Twitter"},"linkedin":{"title":"LinkedIn","has_counter":true},"pinterest":{"title":"Pinterest","has_counter":true},"reddit":{"title":"Reddit","has_counter":true},"vk":{"title":"VK","has_counter":true},"odnoklassniki":{"title":"OK","has_counter":true},"tumblr":{"title":"Tumblr"},"digg":{"title":"Digg"},"skype":{"title":"Skype"},"stumbleupon":{"title":"StumbleUpon","has_counter":true},"mix":{"title":"Mix"},"telegram":{"title":"Telegram"},"pocket":{"title":"Pocket","has_counter":true},"xing":{"title":"XING","has_counter":true},"whatsapp":{"title":"WhatsApp"},"email":{"title":"Email"},"print":{"title":"Print"},"x-twitter":{"title":"X"},"threads":{"title":"Threads"}},"facebook_sdk":{"lang":"en_US","app_id":""},"lottie":{"defaultAnimationUrl":"https:\/\/find.co.id\/wp-content\/plugins\/3.35.1 elementor-pro\/modules\/lottie\/assets\/animations\/default.json"}};
//# sourceURL=elementor-pro-frontend-js-before
</script>
<script src="https://find.co.id/wp-content/plugins/3.35.1%20elementor-pro/assets/js/frontend.min.js?ver=3.35.1" id="elementor-pro-frontend-js"></script>
<script src="https://find.co.id/wp-content/plugins/3.35.1%20elementor-pro/assets/js/elements-handlers.min.js?ver=3.35.1" id="pro-elements-handlers-js"></script>
</body>
</html>
