Tema WordPress merupakan rangka utama dalam membina rupa dan fungsi laman web. Menguasai keupayaan pembangunannya bermaksud anda boleh menyesuaikan sepenuhnya semua aspek laman web, membebaskan diri daripada kekangan tema siap, dan melaksanakan idea reka bentuk unik dan keperluan fungsional. Memahami konsep asas dan struktur failnya merupakan langkah pertama untuk mengembara di laluan ini.
Setiap tema WordPress adalah sebuah laman web yang terletak di/wp-content/themes/Folder di bawah katalog. Satu tema fungsional paling asas hanya memerlukan dua fail:style.css和index.phpDi antaranya,style.cssIa bukan sahaja digunakan untuk menyimpan gaya, tetapi juga anotasi di bahagian atas fail yang mengandungi maklumat meta tentang tema tersebut, yang merupakan kunci untuk WordPress mengenali sebuah tema.
在style.cssUntuk bahagian atas, anda perlu menggunakan anotasi khusus untuk mentakrifkan topik. Contoh tipikalnya adalah seperti berikut:
Diperoleh daripada WEB\nDisyorkan untuk membaca. Panduan lengkap untuk pembangunan tema WordPress: Tutorial praktikal dari pemula hingga mahir.。
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个用于学习的自定义WordPress主题。
Version: 1.0
License: GPL v2 or later
Text Domain: my-first-theme
*/
Maklumat ini akan muncul dalam senarai “Rupa > Tema” di bahagian pentadbiran WordPress. Danindex.phpIni adalah fail templat utama untuk tema tersebut, yang digunakan sebagai jalan keluar lalai apabila templat yang lebih spesifik tidak wujud. Seiring dengan perkembangan projek, anda akan menggantikan atau melengkapi ia dengan fail templat yang lebih spesifik.
UltaHost – Penyedia Hosting untuk WordPress Jaminan pemulangan wang dalam tempoh 30 hari, lebar jalur dan pangkalan data yang tidak terhad, perlindungan DDoS percuma, diskaun 50% untuk pembelian selama 3 tahun.
WordPress menggunakan sistem hierarki templat yang canggih untuk menentukan templat mana yang akan digunakan untuk memaparkan setiap permintaan halaman tertentu. Memahami hierarki ini adalah asas untuk membangunkan tema secara berkesan, kerana ia membantu anda mengetahui nama fail yang sepatutnya digunakan untuk mencipta halaman tertentu, seperti butiran siaran atau halaman katalog kategori.
Tahap templat mengikuti prinsip “dari khusus ke umum”. Sebagai contoh, apabila mengakses entri blog dengan ID 123, WordPress akan mencari secara berurutan:single-post-123.php、single-post.php、single.phpDan akhir sekali ialahsingular.phpJika semua ini tidak ada, barulah ia akan digunakan.index.php。
File-file templat teras yang biasa digunakan termasuk:
- front-page.php: Digunakan untuk mengatur halaman utama laman web.
- home.php: Halaman indeks artikel blog.
- single.phpSebuah entri blog tunggal atau sebuah artikel tunggal daripada jenis artikel yang disesuaikan.
- page.php: Satu halaman.
- archive.phpTemplat umum untuk semua jenis halaman arkib (kategori, tag, penulis, dll.).
- category.php: Halaman katalog khusus.
- 404.php: Halaman ralat 404.
- header.php、footer.php、sidebar.phpIni biasanya merupakan segmen templat lokal.
Untuk mengekalkan modulariti dan kebolehmaintan kod, WordPress menyediakan beberapa fungsi utama untuk memuat fail templat tempatan. Yang paling penting ialahget_header()、get_footer()和get_sidebar()Mereka digunakan masing-masing untuk memperkenalkanheader.php、footer.php和sidebar.php。
Diperoleh daripada WEB\nDisyorkan untuk membaca. Konsep utama pembangunan tema WordPress.。
Satu lagi fungsi yang sangat penting ialahget_template_part()Ini membenarkan anda memperkenalkan sebarang segmen templat dengan cara yang lebih fleksibel. Sebagai contoh, dalam kitaran artikel blog, anda mungkin ingin memperkenalkan templat khusus untuk kandungan artikel:
<?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'template-parts/content', get_post_type() ); ?>
<?php endwhile; ?>
Kod ini akan mencari terlebih dahulu.template-parts/content-post.php(Membuat anggapan bahawa jenis artikelnya adalah )post）, jika tidak ditemui, maka muatkantemplate-parts/content.php。
Kekuatan WordPress berasal daripada pustaka fungsinya yang besar dan sistem “hook” berasaskan peristiwa. Dalam pembangunan tema, penggunaan fungsi teras dan hook secara mahir adalah kunci untuk melaksanakan fungsi yang kompleks serta mengoptimumkan prestasi dan keselamatan.
hosting.com Hosting Bersama Prestasi tinggi, menampilkan CPU AMD EPYC, storan SSD NVMe dan LiteSpeed, dengan sokongan pakar dalaman 24/7, langkah keselamatan canggih termasuk SSL, perlindungan serangan paksa kata laluan, perisian hasad dan DDoS, menjimatkan sehingga 73%.
Dalam fail templat, anda akan sering menggunakan pelbagai fungsi untuk mendapatkan dan memaparkan kandungan dinamik. Sebagai contoh,the_title()Dipergunakan untuk mengeluarkan tajuk artikel atau halaman semasa, manakalathe_content()Kemudian, outputkan kandungan utama yang telah diformat. Sebagai tambahan kepada fungsi output langsung, terdapat juga fungsi yang mengubah format output supaya lebih mudah untuk dibaca oleh manusia.get_Fungsi-fungsi di awal, sepertiget_the_title()Mereka mengembalikan data untuk anda proses selanjutnya dalam kod.
Cycle blog post merupakan teras templat WordPress, dan struktur kod standardnya adalah seperti berikut:
\n
<!-- 在这里输出文章内容 -->
<h2><?php the_title(); ?></h2>
<div><?php the_content(); ?></div>
<?php endwhile; ?>
<!-- 这里可以放置分页导航 -->
<?php else : ?>
<!-- 如果没有找到文章，显示的内容 -->
<p>Tiada kandungan untuk sekarang.</p>
<?php endif; ?>
Hooks dibahagikan kepada dua jenis: “action” dan “filter”. Action hook membenarkan anda untuk menyisipkan kod anda sendiri apabila peristiwa tertentu berlaku, seperti semasawp_headAnda boleh menggunakan ,
, dan untuk menambahkan maklumat tambahan ke halaman web anda.<code data-no-auto-translation="">add_action()</code>Menggunakan fungsi tersebut untuk memasang fungsi mereka sendiri.</p> <p>Diperoleh daripada WEB\nDisyorkan untuk membaca. <a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-beginners-guide-custom-theme-2026/">Pengenalan kepada pembangunan tema WordPress: Membina tema kustom pertama anda dari awal.</a>。</p> <p>Sebagai contoh, dalam topik ini,<code data-no-auto-translation="">functions.php</code>Menambah sokongan untuk pautan Feed dalam dokumen:</p> <pre class="wp-block-code" data-no-auto-translation=""><code class="language-php" data-no-auto-translation="">add_action( 'after_setup_theme', 'mytheme_setup' );
function mytheme_setup() {
// 为文章和评论添加Feed链接到head中
add_theme_support( 'automatic-feed-links' );
}</code></pre> <p>Pengait penyaring membenarkan anda untuk mengubah suai data. Sebagai contoh, menggunakan<code data-no-auto-translation="">excerpt_length</code>Filternya boleh mengubah panjang abstrak artikel:</p> <div class="flex justify-between items-center flex-col lg:flex-row xl:flex-col 2xl:flex-row gap-6 sm:gap-8 rounded-lg border border-gray-200 dark:border-gray-700 p-4 mb-8 lg:mb-10 sm:p-6 bg-white dark:bg-gray-750 shadow-md transition-colors duration-300" data-link="https://www.likacloud.com/ms/tolink/interserver-webhosting/"> <div class="flex flex-col gap-3 gap-4 sm:gap-6 w-full"> <strong class="text-2xl font-semibold text-gray-900 dark:text-gray-200"> Hosting Bersama InterServer </strong> <div class="text-gray-600 dark:text-gray-300 word-word">Hosting kongsi: 1TB/bulan pada $2.50 USD, bulan pertama pada $0.10 USD dengan kod promo tryinterserver. 461 skrip aplikasi awan tersedia untuk pemasangan satu klik.</div> </div> <div class="flex items-center flex-col md:flex-row lg:flex-col xl:flex-row 2xl:flex-col gap-6 shrink-0"> <a href="https://www.likacloud.com/ms/tolink/interserver-webhosting/"> <img decoding="async" src="https://static.likacloud.com/data/attachment/2025/12/20251228045033.svg" alt="Logo InterServer" class="content-promotion-card-icon h-9 min-h-9 dark:hidden" title="Dari awal: Panduan lengkap dan teknik teras untuk pembangunan tema WordPress."> <img decoding="async" src="https://static.likacloud.com/data/attachment/2025/12/20251229054830.webp" alt="Logo InterServer" class="content-promotion-card-icon h-9 min-h-9 hidden dark:block" title="Dari awal: Panduan lengkap dan teknik teras untuk pembangunan tema WordPress."> </a> <a href="https://www.likacloud.com/ms/tolink/interserver-webhosting/" class="bg-blue-500 w-full md:w-auto lg:w-full xl:w-auto 2xl:w-full text-center !text-white dark:!text-gray-200 !px-5 !py-1.5 rounded-full hover:bg-blue-600 transition-colors"> Lawati halaman </a> </div> </div> <pre class="wp-block-code" data-no-auto-translation=""><code class="language-php" data-no-auto-translation="">add_filter( 'excerpt_length', 'mytheme_custom_excerpt_length', 999 );
function mytheme_custom_excerpt_length( $length ) {
return 30; // 将摘要长度设置为30个单词
}</code></pre> <p><code data-no-auto-translation="">functions.php</code>Dokumen ini merupakan “pusat fungsi” tema tersebut, dan semua fungsi tersuai, panggilan kepada pengait, dan deklarasi fungsi tema harus diletakkan di sini.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-2-3">Fungsi topik kenyataan disokong</h3> <p>Gunakan<code data-no-auto-translation="">add_theme_support()</code>Ini merupakan amalan pembangunan yang baik untuk menggunakan fungsi untuk menyatakan fungsi teras WordPress yang disokong oleh tema anda. Ini bukan sahaja mengaktifkan fungsi tersebut, tetapi juga memastikan keserasian dengan versi masa depan.</p> <p>Kenyataan fungsi yang biasa termasuk:</p> <pre class="wp-block-code" data-no-auto-translation=""><code class="language-php" data-no-auto-translation="">add_action( 'after_setup_theme', 'mytheme_theme_support' );
function mytheme_theme_support() {
// 支持文章特色图像
add_theme_support( 'post-thumbnails' );
// 支持HTML5语义化标记
add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption', 'style', 'script' ) );
// 支持自定义Logo
add_theme_support( 'custom-logo', array(
'height' => 100,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
) );
}</code></pre> <h2 class="wp-block-heading cont-scroll-top" id="H-3">Mengintegrasikan gaya kustom dan fail skrip.</h2> <p>Sebuah tema moden mesti menguruskan lembar gaya CSS dan skrip JavaScript dengan betul, untuk memastikan mereka dimuatkan apabila diperlukan, mengelakkan konflik, dan memenuhi amalan terbaik untuk pengoptimuman prestasi depan.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-3-1">Mendaftar dan memuatkan sumber dengan selamat.</h3> <p>Jangan sekali guna ini secara langsung dalam fail templat.<code data-no-auto-translation=""><link></code>或<code data-no-auto-translation=""><script></code>Menggunakan tag untuk mengekodkan sumber secara manual. Kaedah yang betul ialah menggunakan<code data-no-auto-translation="">wp_enqueue_scripts</code>Pengait aksi, berkerjasama dengan<code data-no-auto-translation="">wp_enqueue_style()</code>和<code data-no-auto-translation="">wp_enqueue_script()</code>Fungsi.</p> <p>在<code data-no-auto-translation="">functions.php</code>Di dalamnya, anda perlu mentakrifkan satu fungsi untuk mengendalikan antrian sumber:</p> <pre class="wp-block-code" data-no-auto-translation=""><code class="language-php" data-no-auto-translation="">add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_assets' );
function mytheme_enqueue_assets() {
// 加载主样式表
wp_enqueue_style( 'mytheme-style', get_stylesheet_uri(), array(), '1.0' );
// 加载Google字体
wp_enqueue_style( 'mytheme-google-fonts', 'https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap', array(), null );
// 加载主JavaScript文件，并依赖jQuery，在页脚加载
wp_enqueue_script( 'mytheme-script', get_template_directory_uri() . '/assets/js/main.js', array( 'jquery' ), '1.0', true );
// 如果需要传递PHP变量到JS，可以使用wp_localize_script
wp_localize_script( 'mytheme-script', 'myThemeData', array(
'ajax_url' => admin_url( 'admin-ajax.php' ),
'home_url' => home_url(),
));
}</code></pre> <p>Kaedah ini memastikan hubungan bergantung adalah betul, mengelakkan pemuatan berulang, dan membenarkan plugin dan tema lain untuk diuruskan melalui deklarasi ketergantungan mereka.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-3-2">Menambah sokongan gaya kepada Editor Gutenberg.</h3> <p>Dengan populariti editor blok, adalah penting untuk menambahkan sokongan gaya depan ke editor belakang untuk mencapai pengalaman penyuntingan “apa yang anda lihat ialah apa yang anda dapat”. Anda boleh menggunakan<code data-no-auto-translation="">add_theme_support( ‘editor-styles’ )</code>Dan mengatur gaya-gaya editor secara berurutan.</p> <pre class="wp-block-code" data-no-auto-translation=""><code class="language-php" data-no-auto-translation="">add_action( 'after_setup_theme', 'mytheme_editor_styles' );
function mytheme_editor_styles() {
add_theme_support( 'editor-styles' );
add_editor_style( 'assets/css/editor-style.css' );
}</code></pre> <h2 class="wp-block-heading cont-scroll-top" id="H-4">RINGKASAN</h2> <p>Pembangunan tema WordPress adalah proses yang bermula dengan pemahaman struktur fail asas, dan kemudian secara bertahap menyelidiki hierarki templat, fungsi teras, sistem pengaitan dan pengurusan sumber. Kunci utamanya adalah latihan: dari yang paling mudah sehingga yang paling rumit.<code data-no-auto-translation="">style.css</code>和<code data-no-auto-translation="">index.php</code>Mula, kemudian cipta<code data-no-auto-translation="">header.php</code>和<code data-no-auto-translation="">footer.php</code>Lakukan pembahagian modular. Kemudian, gunakan hierarki templat untuk mencipta templat khusus untuk pelbagai jenis halaman, seperti<code data-no-auto-translation="">single.php</code>或<code data-no-auto-translation="">page.php</code>Di dalam<code data-no-auto-translation="">functions.php</code>Di China, melalui penggunaan kait dan<code data-no-auto-translation="">add_theme_support</code>Tambahkan fungsi dengan selamat, dan selalu melalui<code data-no-auto-translation="">wp_enqueue_scripts</code>Untuk menguruskan gaya dan skrip. Dengan mengikuti prinsip-prinsip dan langkah-langkah utama ini, anda akan dapat membina tema WordPress yang profesional, berkesan, dan boleh diselenggara.</p> <h2 class="wp-block-heading cont-scroll-top" id="H-5">FAQ - Soalan Lazim</h2> <h3 class="wp-block-heading cont-scroll-top" id="H-5-1">Apakah fail-fail minimum yang diperlukan untuk mencipta tema WordPress?</h3> <p>Dari segi teknikal, sebuah tema yang dikenali dan diaktifkan oleh WordPress memerlukan sekurang-kurangnya dua fail:<code data-no-auto-translation="">style.css</code>和<code data-no-auto-translation="">index.php</code>。<code data-no-auto-translation="">style.css</code>Komen-komen di bahagian atas fail mesti mengandungi maklumat meta topik yang betul, seperti<code data-no-auto-translation="">Theme Name</code>Dan<code data-no-auto-translation="">index.php</code>Sebagai fail templat paling asas, digunakan untuk merender semua halaman.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-5-2">Bagaimana untuk mencipta templat halaman tersuai untuk topik saya?</h3> <p>Membuat templat halaman khusus sangat mudah. Anda hanya perlu mengedit mana-mana fail templat (biasanya ).<code data-no-auto-translation="">page.php</code>Tambahkan satu blok komen PHP khusus di bahagian atas (). Sebagai contoh, untuk mencipta templat “halaman penuh lebar”, anda boleh mencipta yang baru dengan nama Add a specific PHP comment block at the top. For example, to create a "full-width page" template, you can create a new one with the name <<code data-no-auto-translation="">template-full-width.php</code>Buka dokumen tersebut dan tulis di awal dokumen:<code data-no-auto-translation="">/* Template Name: 全宽页面 */</code>Selepas menyimpan, apabila anda mengedit halaman di backend WordPress, anda akan dapat melihat dan memilih “Halaman Lebar Penuh” dalam kotak drop-down “Templat” di bawah “Sifat Halaman”.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-5-3">Mengapa menggunakan add_action dalam functions.php untuk menambah fungsi?</h3> <p>Cukup, berhenti! Tidak ada lagi permainan.<code data-no-auto-translation="">functions.php</code>Menulis kod fungsi dalam bahasa Cina mungkin mengakibatkan fungsi tersebut dijalankan pada masa yang salah, lalu menyebabkan kesilapan atau fungsi yang tidak berfungsi. Gunakan<code data-no-auto-translation="">add_action()</code>或<code data-no-auto-translation="">add_filter()</code>Mengaitkan fungsi anda dengan pengait WordPress tertentu akan memastikan kod anda dijalankan pada masa yang betul dan selamat. Sebagai contoh,<code data-no-auto-translation="">after_setup_theme</code>Hook digunakan untuk menginisialisasi tema,<code data-no-auto-translation="">wp_enqueue_scripts</code>Hook digunakan untuk memuatkan sumber. Ini merupakan amalan terbaik untuk arkitektur plug-in WordPress, yang membolehkan kod menjadi lebih modular dan kompatibel.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-5-4">Bagaimana untuk membuat topik saya menyokong terjemahan pelbagai bahasa?</h3> <p>Untuk membolehkan tema menyokong pelbagai bahasa, perlu dilakukan beberapa langkah. Pertama, dalam<code data-no-auto-translation="">style.css</code>Gunakan ini dalam bahagian kepala dan semua fail templat.<code data-no-auto-translation="">__()</code>、<code data-no-auto-translation="">_e()</code>Pertama, gunakan fungsi terjemahan untuk membungkus semua rentetan teks yang perlu diterjemahkan. Kemudian, dalam<code data-no-auto-translation="">functions.php</code>Gunakan dalam bahasa Cina<code data-no-auto-translation="">load_theme_textdomain()</code>Fungsi untuk memuatkan fail terjemahan. Akhirnya, gunakan alat seperti Poedit untuk mengekstrak rentetan daripada kod sumber dan menjana terjemahan.<code data-no-auto-translation="">.pot</code>Dokumen, dan sila minta penterjemah untuk mencipta bahasa yang sepadan berdasarkan ini (seperti<code data-no-auto-translation="">zh_CN.po</code>和<code data-no-auto-translation="">.mo</code>Ini adalah fail terjemahan untuk "Hello World". Letakkan fail terjemahan ini dalam direktori tema.<code data-no-auto-translation="">/languages/</code>Anda boleh meletakkannya di bawah folder tersebut.</p> <h3 class="wp-block-heading cont-scroll-top" id="H-5-5">Untuk membangunkan tema komersial, apa permit dan peraturan yang perlu diambil kira?</h3> <p>Untuk membangunkan tema komersial untuk pengedaran atau penjualan, anda mesti mematuhi syarat-syarat lesen WordPress dengan ketat. Yang paling penting ialah tema anda mesti menggunakan lesen GPL v2 atau lebih tinggi yang sama dengan teras WordPress. Ini bermaksud orang lain berhak untuk menggunakan, mengubah suai, dan mengedarkan semula kod tema anda. Selanjutnya, anda harus mematuhi standard pengkodan dan garis panduan untuk semakan tema rasmi WordPress bagi memastikan kualiti kod, keselamatan, dan keserasian. Di samping itu, adalah penting untuk mengisytiharkan semua sumber pihak ketiga (seperti fon, pustaka ikon) yang digunakan dan memastikan mereka juga kompatibel dengan GPL atau telah diberikan lesen komersial.</p> <div class="ai-tail-links-wrapper"><h2>Selanjutnya, apa yang perlu kita lakukan seterusnya?</h2><p class="ai-tail-next-steps-intro">Jika anda sedang membina atau mengoptimumkan laman web WordPress, langkah seterusnya adalah untuk terus membaca tentang pengoptimuman prestasi, konfigurasi plugin dan penyesuaian tema.</p><ul class="ai-tail-next-steps-list"><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-website-guide-from-scratch/">Panduan Pembinaan Laman Web WordPress: Langkah-langkah Lengkap dan Amalan Terbaik Untuk Membina Laman Web Profesional Dari Kosong</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/woocommerce-tips-boost-conversion/">10 petua lanjutan WooCommerce untuk meningkatkan kadar penukaran dan pengalaman pengguna laman web e-dagang anda</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-open-source-cms-top-10-benefits/">Mengapa memilih WordPress: Sepuluh Kelebihan Utama Sistem Pengurusan Kandungan (CMS) Berbasis Sumber Terbuka</a></li></ul><h2>Bacaan lanjutan dan pengetahuan praktikal</h2><p>Konten berikut berkaitan dengan topik artikel ini dan sesuai untuk bacaan lanjut. Lebih baik untuk memulakan dengan artikel yang paling dekat dengan masalah anda sekarang, dan kemudian secara bertahap mengembangkan ke topik yang berkaitan, kerana ini biasanya akan memberikan hasil yang lebih baik.</p><ul class="ai-tail-links-list"><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-12402452/">Panduan Pembangunan Tema WordPress: Membina Laman Web Custom Dari Kosong</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-complete-guide-%e7%9f%a5%e8%af%86/">Panduan Lengkap Pembangunan Tema WordPress: Tutorial Praktikal Dari Awal Hingga Mahir</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-2026/">Panduan Lengkap Pembangunan Tema WordPress: Membina Templat Laman Web Profesional Dari Kosong</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-responsive-corporate-website/">Pembangunan Tema WordPress: Membina Laman Web Korporat Responsif Dari Kosong</a></li><li style="margin: 18px 0;"><a href="https://www.likacloud.com/ms/knowledge/wordpress/no-code-wordpress-theme-guide/">Membina Tema WordPress Tanpa Kod: Panduan Lengkap Dari Awal Hingga Mahir</a></li></ul></div> </div> <div class="mt-8 pt-6 border-solid border-t border-gray-200 dark:border-gray-700 transition-colors duration-300"> <div class="flex flex-wrap gap-2"> <span class="font-medium">Tag:</span> <a href="https://www.likacloud.com/ms/cats/wordpress-theme-development/" rel="tag">Pembangunan tema WordPress.</a><a href="https://www.likacloud.com/ms/cats/theme-development-guide/" rel="tag">Guidelines untuk membangunkan topik</a><a href="https://www.likacloud.com/ms/cats/code-structure/" rel="tag">Struktur kod</a><a href="https://www.likacloud.com/ms/cats/template-hierarchy/" rel="tag">Tahap templat</a><a href="https://www.likacloud.com/ms/cats/custom-themes/" rel="tag">Tema kustomisasi</a> </div> </div> <div class="mr-reactions-buttons single-footer 1024 !hidden lg:!flex xl:!hidden mt-10"> <button class="mr-reaction-btn" data-reaction="点赞" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-like-icon"></span></span> <span class="mr-reaction-name">Suka</span> <span class="mr-reaction-count">18</span> </button> <button class="mr-reaction-btn" data-reaction="感谢" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-thanks-icon"></span></span> <span class="mr-reaction-name">Terima kasih.</span> <span class="mr-reaction-count">6</span> </button> <button class="mr-reaction-btn" data-reaction="膜拜" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-worship-icon"></span></span> <span class="mr-reaction-name">\nMemuja</span> <span class="mr-reaction-count">20</span> </button> <button class="mr-reaction-btn" data-reaction="卷起来" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-rollup-icon"></span></span> <span class="mr-reaction-name">Gulung itu.</span> <span class="mr-reaction-count">16</span> </button> <button class="mr-reaction-btn" data-reaction="要火" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-fire-icon"></span></span> <span class="mr-reaction-name">Saya mahu menjadi terkenal.</span> <span class="mr-reaction-count">8</span> </button> <button class="mr-reaction-btn" data-reaction="求更新" data-post-id="12362762" data-action="add"> <span class="mr-reaction-icon"><span class="emoji-item-icon mr-update-icon"></span></span> <span class="mr-reaction-name">Mohon kemaskini</span> <span class="mr-reaction-count">12</span> </button> </div> </article> </div> <aside id="sidebar" role="complementary" class="sidebar xl:sticky xl:top-[4.3125rem] xl:self-start xl:overflow-y-auto xl:col-span-1 space-y-6 shrink-0 mt-4 md:mt-6 xl:mt-0"> <div id="primary" class="widget-area"> <section id="provider_widget-3" class="widget widget-container widget_provider_widget"><div class="provider-recommend grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-1 gap-2 xl:gap-0"><div class="provider-item bg-white dark:bg-gray-800 hover:bg-blue-100 dark:hover:bg-blue-500/30 rounded-lg xl:rounded-none"><a href="https://www.likacloud.com/ms/tolink/cloudways-pricing/" class="px-6 py-4 flex gap-4 justify-between items-center"><img class="w-28 h-full dark:hidden rounded-none" src="https://static.likacloud.com/data/attachment/2026/01/20260113030722.svg" alt="Cloudways – Percubaan percuma selama 3 hari" title="Cloudways – Percubaan percuma selama 3 hari" /><img class="w-28 h-full hidden dark:block rounded-none" src="https://static.likacloud.com/data/attachment/2026/01/20260113040800.webp" alt="Cloudways – Percubaan percuma selama 3 hari" title="Cloudways – Percubaan percuma selama 3 hari" /><div class="provider-desc text-sm text-right leading-5 text-gray-600 dark:text-gray-500">3 hari percubaan percuma</div></a></div><div class="provider-item bg-white dark:bg-gray-800 hover:bg-blue-100 dark:hover:bg-blue-500/30 rounded-lg xl:rounded-none"><a href="https://www.likacloud.com/ms/tolink/surfercloud/" class="px-6 py-4 flex gap-4 justify-between items-center"><img class="w-28 h-full dark:hidden rounded-none" src="https://static.likacloud.com/data/attachment/2026/01/20260114124357.webp" alt="SurferCloud – Pelayan Awan 1TB5TB6.9 GB/sebulan" title="SurferCloud – Pelayan Awan 1TB5TB6.9 GB/sebulan" /><img class="w-28 h-full hidden dark:block rounded-none" src="https://static.likacloud.com/data/attachment/2026/01/20260114124537.webp" alt="SurferCloud – Pelayan Awan 1TB5TB6.9 GB/sebulan" title="SurferCloud – Pelayan Awan 1TB5TB6.9 GB/sebulan" /><div class="provider-desc text-sm text-right leading-5 text-gray-600 dark:text-gray-500">Cloud Server $6.9: Berharga RM ___ sebulan.</div></a></div><div class="provider-item bg-white dark:bg-gray-800 hover:bg-blue-100 dark:hover:bg-blue-500/30 rounded-lg xl:rounded-none"><a href="https://www.likacloud.com/ms/tolink/ultahost-vps-hosting/" class="px-6 py-4 flex gap-4 justify-between items-center"><img class="w-28 h-full dark:hidden rounded-none" src="https://static.likacloud.com/data/attachment/2025/12/20251227020448.webp" alt="UltaHost – VPS $5.5: Bermula dari bulan ini." title="UltaHost – VPS $5.5: Bermula dari bulan ini." /><img class="w-28 h-full hidden dark:block rounded-none" src="https://static.likacloud.com/data/attachment/2025/12/20251229052118.webp" alt="UltaHost – VPS $5.5: Bermula dari bulan ini." title="UltaHost – VPS $5.5: Bermula dari bulan ini." /><div class="provider-desc text-sm text-right leading-5 text-gray-600 dark:text-gray-500">VPS $5.5 – Bermula dari bulan ini.</div></a></div></div></section> <div x-data="{ mobileNavOpen: false, activeId: null }" x-init=" mobileNavOpen = false; activeId = null; let headings = []; let scrollTimeout = null; let navSmoothTimeout = null; function getOffset() { const element = document.querySelector('h2[id], h3[id]'); if (element) { const style = window.getComputedStyle(element); return parseInt(style.scrollMarginTop) || 0; } return 0; } function cacheHeadings() { headings = Array.from(document.querySelectorAll('h2[id], h3[id]')).map(heading => { const rect = heading.getBoundingClientRect(); return { id: heading.id, top: rect.top + window.pageYOffset - getOffset(), element: heading }; }).sort((a, b) => a.top - b.top); } function findActiveHeading() { const scrollPosition = window.pageYOffset + getOffset(); if (headings.length && scrollPosition < headings[0].top - 5) { return null; } let activeHeading = null; for (let i = 0; i < headings.length; i++) { if (scrollPosition >= headings[i].top) { activeHeading = headings[i]; } else { break; } } if (activeHeading) return activeHeading.id; return null; } function ensureActiveVisible(behavior) { if (!activeId) { document.querySelectorAll('.multi-level-nav').forEach(container => { let scroller = container; if (!(scroller.scrollHeight > scroller.clientHeight)) { const nodes = container.querySelectorAll('*'); for (let i = 0; i < nodes.length; i++) { const el = nodes[i]; if (el.scrollHeight > el.clientHeight) { const oy = window.getComputedStyle(el).overflowY; if (oy === 'auto' || oy === 'scroll' || oy === 'overlay') { scroller = el; break; } } } } if (behavior === 'smooth' && scroller.scrollTo) { scroller.scrollTo({ top: 0, behavior: 'smooth' }); } else { scroller.scrollTop = 0; } }); return; } document.querySelectorAll('.multi-level-nav').forEach(container => { if (container.offsetParent === null) return; let link = null; container.querySelectorAll('a').forEach(a => { if (a.getAttribute('href') === '#' + activeId) link = a; }); if (!link) return; function findScrollable(root) { if (root && root.scrollHeight > root.clientHeight) return root; const nodes = root.querySelectorAll('*'); for (let i = 0; i < nodes.length; i++) { const el = nodes[i]; if (el.scrollHeight > el.clientHeight) { const oy = window.getComputedStyle(el).overflowY; if (oy === 'auto' || oy === 'scroll' || oy === 'overlay') return el; } } return null; } const scroller = findScrollable(container); if (!scroller) return; const sRect = scroller.getBoundingClientRect(); const lRect = link.getBoundingClientRect(); const linkTop = (lRect.top - sRect.top) + scroller.scrollTop; const linkMid = linkTop + lRect.height / 2; const desired = scroller.clientHeight * 0.35; const margin = scroller.clientHeight * 0.25; const top = scroller.scrollTop; const bottom = top + scroller.clientHeight; if (linkMid < top + margin || linkMid > bottom - margin) { let target = linkMid - desired; const maxTop = scroller.scrollHeight - scroller.clientHeight; if (target < 0) target = 0; if (target > maxTop) target = maxTop; if (behavior === 'smooth' && scroller.scrollTo) { scroller.scrollTo({ top: target, behavior: 'smooth' }); } else { scroller.scrollTop = target; } } }); } $watch('mobileNavOpen', value => { if (value) { requestAnimationFrame(() => ensureActiveVisible('smooth')); setTimeout(() => ensureActiveVisible('smooth'), 120); } }); let isNavClickScrolling = false; let navClickTarget = null; let navClickReleaseTimer = null; let rafPending = false; function handleScroll() { if (rafPending) return; rafPending = true; requestAnimationFrame(() => { rafPending = false; if (isNavClickScrolling && navClickTarget) { const el = document.getElementById(navClickTarget); if (el) { const offset = getOffset(); const targetY = el.getBoundingClientRect().top + window.pageYOffset - offset; if (Math.abs(window.pageYOffset - targetY) > 8) return; } isNavClickScrolling = false; navClickTarget = null; if (navClickReleaseTimer) clearTimeout(navClickReleaseTimer); navClickReleaseTimer = null; } const newActiveId = findActiveHeading(); const atTop = window.pageYOffset <= 30; if (newActiveId !== activeId) { activeId = newActiveId; if (navSmoothTimeout) clearTimeout(navSmoothTimeout); navSmoothTimeout = setTimeout(() => { ensureActiveVisible('smooth'); navSmoothTimeout = null; }, 120); return; } if (!newActiveId && atTop) { if (navSmoothTimeout) clearTimeout(navSmoothTimeout); navSmoothTimeout = setTimeout(() => { ensureActiveVisible('smooth'); navSmoothTimeout = null; }, 80); } }); } function handleNavClick(event, hash) { if (!hash) return; isNavClickScrolling = true; navClickTarget = hash; if (navClickReleaseTimer) clearTimeout(navClickReleaseTimer); navClickReleaseTimer = setTimeout(() => { isNavClickScrolling = false; navClickTarget = null; navClickReleaseTimer = null; }, 1600); activeId = hash; requestAnimationFrame(() => ensureActiveVisible('smooth')); const element = document.getElementById(hash); if (element) { const offset = getOffset(); const elementPosition = element.getBoundingClientRect().top + window.pageYOffset; window.scrollTo({ top: elementPosition - offset, behavior: 'smooth' }); } mobileNavOpen = false; event.preventDefault(); history.pushState(null, null, '#' + hash); } function init() { cacheHeadings(); const hash = window.location.hash.substring(1); if (hash && document.getElementById(hash)) { activeId = hash; ensureActiveVisible(); } else if (headings.length > 0) { activeId = findActiveHeading(); if (activeId) ensureActiveVisible(); } window.addEventListener('scroll', handleScroll); window.addEventListener('resize', cacheHeadings); document.querySelectorAll('.multi-level-nav a').forEach(link => { link.addEventListener('click', (event) => { const href = link.getAttribute('href'); if (href && href.startsWith('#')) { handleNavClick(event, href.substring(1)); } }); }); } if (document.readyState === 'complete') { init(); } else { window.addEventListener('load', init); } " class="xl:contents" x-cloak> <button x-transition.opacity class="mbcontent-menus lg:hidden fixed bottom-3 lg:bottom-1/2 right-[26%] lg:right-1.5 flex items-center justify-center text-white z-[31] lg:z-2" aria-label="Buka navigasi artikel." @click="mobileNavOpen = !mobileNavOpen" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 22 22" width="22" height="22"> <rect x="2" y="2" width="19" height="19" rx="2" ry="2" fill="none" stroke="#6b7280" stroke-width="2"/> <circle cx="6" cy="7" r="2" fill="#6b7280"/> <line x1="8" y1="7" x2="18" y2="7" stroke="#6b7280" stroke-width="2"/> <circle cx="6" cy="12" r="2" fill="#6b7280"/> <line x1="8" y1="12" x2="18" y2="12" stroke="#6b7280" stroke-width="2"/> <circle cx="6" cy="17" r="2" fill="#6b7280"/> <line x1="8" y1="17" x2="18" y2="17" stroke="#6b7280" stroke-width="2"/> </svg> </button> <div class="hidden lg:block xl:hidden fixed bottom-52 md:bottom-60 lg:bottom-36 right-0.5 z-10"> <button @click="mobileNavOpen = !mobileNavOpen" class="flex justify-center items-center bg-white dark:bg-gray-700 shadow-lg h-9 w-9 text-white rounded-full p-2 shadow-lg transition-all transform hover:scale-105"> <i class="fa-solid fa-list text-base text-gray-500 dark:text-gray-400"></i> </button> </div> <div x-show="mobileNavOpen" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition ease-in duration-200" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" class="fixed inset-0 z-50 xl:hidden flex items-center justify-center pl-[20%] xs:pl-[35%] sm:pl-[45%] md:pl-[50%] lg:pl-[65%]" @click="mobileNavOpen = false" style="display: none" > <div class="absolute inset-0 bg-black bg-opacity-50"></div> <div class="bg-white dark:bg-gray-800 py-8 lg:pb-10 w-full flex flex-col relative z-10 h-screen lg:h-screen overflow-y-auto" @click.stop> <div class="flex justify-between items-center px-6 border-b"> <h3 class="font-bold text-lg">Navigasi artikel</h3> <button @click="mobileNavOpen = false" class="text-gray-500 hover:text-gray-700"> <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewbox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /> </svg> </button> </div> <div class="flex-1 py-4 px-6"> <div class="multi-level-nav com-mbscrollbar max-h-[80vh]"> <ul class="h2-submenu"><li class="group"><a href="#H-1" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-1' }">Memahami struktur hierarki templat topik.</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-1-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-1-1' }">Peraturan penamaan untuk fail-fail templat utama.</a></li><li><a href="#H-1-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-1-2' }">Fungsi biasa untuk memanggil templat tempatan.</a></li></ul></li><li class="group"><a href="#H-2" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-2' }">Menggunakan fungsi teras dan pengait untuk menggerakkan fungsi</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-2-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-1' }">Fungsi asas untuk mendapatkan dan mengeluarkan kandungan.</a></li><li><a href="#H-2-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-2' }">Melalui penggunaan hook, fungsi boleh diperluas.</a></li><li><a href="#H-2-3" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-3' }">Fungsi topik kenyataan disokong</a></li></ul></li><li class="group"><a href="#H-3" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-3' }">Mengintegrasikan gaya kustom dan fail skrip.</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-3-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-3-1' }">Mendaftar dan memuatkan sumber dengan selamat.</a></li><li><a href="#H-3-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-3-2' }">Menambah sokongan gaya kepada Editor Gutenberg.</a></li></ul></li><li class="group"><a href="#H-4" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-4' }">RINGKASAN</a></li><li class="group"><a href="#H-5" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-5' }">FAQ - Soalan Lazim</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-5-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-1' }">Apakah fail-fail minimum yang diperlukan untuk mencipta tema WordPress?</a></li><li><a href="#H-5-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-2' }">Bagaimana untuk mencipta templat halaman tersuai untuk topik saya?</a></li><li><a href="#H-5-3" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-3' }">Mengapa menggunakan add_action dalam functions.php untuk menambah fungsi?</a></li><li><a href="#H-5-4" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-4' }">Bagaimana untuk membuat topik saya menyokong terjemahan pelbagai bahasa?</a></li><li><a href="#H-5-5" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-5' }">Untuk membangunkan tema komersial, apa permit dan peraturan yang perlu diambil kira?</a></li></ul></li></ul> </div> </div> </div> </div> <section id="multi_heading_nav-9" class="widget widget-container widget_multi_heading_nav"> <div class="mbcontent-menus hidden xl:block widget-multi-level-nav bg-white dark:bg-gray-800 rounded-lg p-5 mb-4 xs:mb-6"> <span class="content-nav-title flex w-full text-lg pb-2 border-b border-solid border-gray-100 dark:border-gray-700"> Navigasi kandungan </span> <div class="multi-level-nav max-h-60 com-scrollbar pt-4"> <ul class="h2-submenu"><li class="group"><a href="#H-1" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-1' }">Memahami struktur hierarki templat topik.</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-1-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-1-1' }">Peraturan penamaan untuk fail-fail templat utama.</a></li><li><a href="#H-1-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-1-2' }">Fungsi biasa untuk memanggil templat tempatan.</a></li></ul></li><li class="group"><a href="#H-2" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-2' }">Menggunakan fungsi teras dan pengait untuk menggerakkan fungsi</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-2-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-1' }">Fungsi asas untuk mendapatkan dan mengeluarkan kandungan.</a></li><li><a href="#H-2-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-2' }">Melalui penggunaan hook, fungsi boleh diperluas.</a></li><li><a href="#H-2-3" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-2-3' }">Fungsi topik kenyataan disokong</a></li></ul></li><li class="group"><a href="#H-3" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-3' }">Mengintegrasikan gaya kustom dan fail skrip.</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-3-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-3-1' }">Mendaftar dan memuatkan sumber dengan selamat.</a></li><li><a href="#H-3-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-3-2' }">Menambah sokongan gaya kepada Editor Gutenberg.</a></li></ul></li><li class="group"><a href="#H-4" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-4' }">RINGKASAN</a></li><li class="group"><a href="#H-5" class="block font-medium text-gray-800 dark:text-gray-300 group-hover:underline transition-colors py-2.5" :class="{ '!text-blue-600 font-semibold': activeId === 'H-5' }">FAQ - Soalan Lazim</a><ul class="h3-submenu pl-4 xl:pt-1.5"><li><a href="#H-5-1" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-1' }">Apakah fail-fail minimum yang diperlukan untuk mencipta tema WordPress?</a></li><li><a href="#H-5-2" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-2' }">Bagaimana untuk mencipta templat halaman tersuai untuk topik saya?</a></li><li><a href="#H-5-3" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-3' }">Mengapa menggunakan add_action dalam functions.php untuk menambah fungsi?</a></li><li><a href="#H-5-4" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-4' }">Bagaimana untuk membuat topik saya menyokong terjemahan pelbagai bahasa?</a></li><li><a href="#H-5-5" class="block text-sm text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-colors py-2" :class="{ '!text-blue-500 font-medium': activeId === 'H-5-5' }">Untuk membangunkan tema komersial, apa permit dan peraturan yang perlu diambil kira?</a></li></ul></li></ul> </div> </div> </section> </div><section id="acf_recommendation_widget-5" class="widget widget-container widget_acf_recommendation_widget"> <div class="page-recommendation"> <div class="page-recommendation__item"> <a href="https://www.likacloud.com/ms/tolink/interserver-vps-hosting/" class="block"> <picture> <source srcset="https://static.likacloud.com/data/attachment/2025/12/20251228050703.webp" media="(max-width: 767px)"> <source srcset="https://static.likacloud.com/data/attachment/2025/12/20251228050725.webp" media="(min-width: 768px) and (max-width: 1279px)"> <source srcset="https://static.likacloud.com/data/attachment/2025/12/20251228050703.webp" media="(min-width: 1280px)"> <img src="https://static.likacloud.com/data/attachment/2025/12/20251228050703.webp" alt="Hosting VPS InterServer - Bermula dari hanya £15.60 sebulan, pilihan yang sangat menjimatkan untuk pelayan berpangkalan di AS." title="Hosting VPS InterServer - Bermula dari hanya £15.60 sebulan, pilihan yang sangat menjimatkan untuk pelayan berpangkalan di AS." class="w-full h-auto" loading="lazy" decoding="async" > </picture> </a> </div> </div> </section> </div> </aside> </main> <section class="related-posts mb-10 lg:mb-12 xl:mb-16"><div class="container"><h3 class="text-xl md:text-2xl xl:text-26 font-bold mb-5 md:mb-7 lg:mb-8">Rekomendasi berkaitan</h3><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-4 gap-4 md:gap-6"><article id="post-12402452" class="bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-all" data-link="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-12402452/"> <div class="flex flex-col justify-between p-4 gap-4 h-full"> <div class="space-y-3"> <h3 class="font-semibold lg:text-base xl:text-lg line-clamp-3"> <a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-12402452/"> Panduan Pembangunan Tema WordPress: Membina Laman Web Custom Dari Kosong </a> </h3> <div class="text-gray-400 dark:text-gray-500 2xl:line-clamp-2 line-clamp-3">Artikel ini menyediakan panduan lengkap untuk membina tema WordPress yang diperibadikan dari awal, termasuk konfigurasi persekitaran pembangunan tempatan, struktur fail asas tema, sistem hierarki templat, serta kaedah integrasi untuk ciri-ciri utama seperti menu navigasi dan gambar kecil artikel, untuk membantu pembangun menguasai kemahiran yang diperlukan...</div> </div> <div class="flex items-center justify-between text-sm lg:text-xs 2xl:text-sm dark-text-a-400 text-gray-400 dark:text-gray-500"> <div> <span>2026-06-03</span> </div> <div class="space-x-3 text-xs text-gray-400 dark:text-gray-500"> <div class="space-x-3 block"> <span> <i class="fa-regular fa-eye"></i> <span class="views" data-view-id="12402452" data-view-type="post"><span class="view-count">1,793</span></span> </span> <span><i class="fa-regular fa-thumbs-up mr-1"></i>55</span> </div> </div> </div> </div> </article> <article id="post-12400615" class="bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-all" data-link="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-complete-guide-%e7%9f%a5%e8%af%86/"> <div class="flex flex-col justify-between p-4 gap-4 h-full"> <div class="space-y-3"> <h3 class="font-semibold lg:text-base xl:text-lg line-clamp-3"> <a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-complete-guide-%e7%9f%a5%e8%af%86/"> Panduan Lengkap Pembangunan Tema WordPress: Tutorial Praktikal Dari Awal Hingga Mahir </a> </h3> <div class="text-gray-400 dark:text-gray-500 2xl:line-clamp-2 line-clamp-3">Panduan ini menerangkan secara menyeluruh proses pembangunan tema WordPress, termasuk fail-fail utama (style.css, index.php), struktur hierarki templat, penubuhan persekitaran pembangunan tempatan, kaedah memuatkan sumber daya, dan mekanisme pengulangan utama (main loop). Dengan amalan yang berterusan, anda akan memahami konsep-konsep ini dengan lebih baik...</div> </div> <div class="flex items-center justify-between text-sm lg:text-xs 2xl:text-sm dark-text-a-400 text-gray-400 dark:text-gray-500"> <div> <span>2026-06-03</span> </div> <div class="space-x-3 text-xs text-gray-400 dark:text-gray-500"> <div class="space-x-3 block"> <span> <i class="fa-regular fa-eye"></i> <span class="views" data-view-id="12400615" data-view-type="post"><span class="view-count">1,889</span></span> </span> <span><i class="fa-regular fa-thumbs-up mr-1"></i>74</span> </div> </div> </div> </div> </article> <article id="post-12400383" class="bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-all" data-link="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-2026/"> <div class="flex flex-col justify-between p-4 gap-4 h-full"> <div class="space-y-3"> <h3 class="font-semibold lg:text-base xl:text-lg line-clamp-3"> <a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-guide-2026/"> Panduan Lengkap Pembangunan Tema WordPress: Membina Templat Laman Web Profesional Dari Kosong </a> </h3> <div class="text-gray-400 dark:text-gray-500 2xl:line-clamp-2 line-clamp-3">Artikel ini menyediakan panduan lengkap untuk pembangunan tema WordPress, bermula dari persiapan persekitaran setempat, analisis fail-fail asas (style.css, index.php, functions.php), hingga pembinaan struktur templat menggunakan pengulangan (looping). Ia menjelaskan secara terperinci cara untuk….</div> </div> <div class="flex items-center justify-between text-sm lg:text-xs 2xl:text-sm dark-text-a-400 text-gray-400 dark:text-gray-500"> <div> <span>2026-06-03</span> </div> <div class="space-x-3 text-xs text-gray-400 dark:text-gray-500"> <div class="space-x-3 block"> <span> <i class="fa-regular fa-eye"></i> <span class="views" data-view-id="12400383" data-view-type="post"><span class="view-count">2,418</span></span> </span> <span><i class="fa-regular fa-thumbs-up mr-1"></i>81</span> </div> </div> </div> </div> </article> <article id="post-12400076" class="bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-all" data-link="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-responsive-corporate-website/"> <div class="flex flex-col justify-between p-4 gap-4 h-full"> <div class="space-y-3"> <h3 class="font-semibold lg:text-base xl:text-lg line-clamp-3"> <a href="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-responsive-corporate-website/"> Pembangunan Tema WordPress: Membina Laman Web Korporat Responsif Dari Kosong </a> </h3> <div class="text-gray-400 dark:text-gray-500 2xl:line-clamp-2 line-clamp-3">Artikel ini menjelaskan secara terperinci proses pembangunan tema WordPress, daripada perancangan struktur projek, penciptaan fail-fail utama hingga pelaksanaan reka bentuk yang responsif. Ia meliputi konfigurasi maklumat meta dalam fail style.css, pendaftaran fungsi dalam fail functions.php, serta hierarki template….</div> </div> <div class="flex items-center justify-between text-sm lg:text-xs 2xl:text-sm dark-text-a-400 text-gray-400 dark:text-gray-500"> <div> <span>2026-06-03</span> </div> <div class="space-x-3 text-xs text-gray-400 dark:text-gray-500"> <div class="space-x-3 block"> <span> <i class="fa-regular fa-eye"></i> <span class="views" data-view-id="12400076" data-view-type="post"><span class="view-count">2,344</span></span> </span> <span><i class="fa-regular fa-thumbs-up mr-1"></i>78</span> </div> </div> </div> </div> </article> </div></div></section></div> <footer id="footer" class="bg-gray-900 dark:bg-gray-950 text-white mbmb-11 pb-20 py-4 pt-8 lg:py-8 xl:pt-11"> <div class="container mx-auto"> <div class="grid gap-8 lg:gap-12 xl:gap-6 2xl:gap-10 grid-cols-1 sm:grid-cols-2 xl:grid-cols-[0.9fr_1.2fr_0.9fr_1fr] 2xl:grid-cols-[1.1fr_1.1fr_0.8fr_0.9fr] mb-9 lg:pb-3"> <div class="space-y-5"> <div class="flex items-center"> <h3 class="text-4xl sm:text-3xl md:text-4xl font-bold flex gap-4 items-end text-gray-200 dark:text-gray-300 border-solid border-gray-800 dark:border-gray-900 lg:border-b xl:border-0 2xl:border-b lg:pb-5 xl:pb-0 2xl:pb-5"> LikaCloud <span class="text-sm font-normal text-gray-500 xl:hidden 2xl:block mb-0.5 2xl:mb-[0.1875rem]"> Blog Komputasi Awan </span> </h3> </div> <p class="text-gray-400 leading-relaxed xl:text-[15px] 2xl:text-text-base"> Dari pembinaan laman web ke garis panduan AI. Saya menerima komisen apabila anda membeli-belah melalui pautan di bawah, tanpa kos tambahan kepada anda. </p> </div> <div> <h4 class="text-xl font-semibold mb-3 pb-2 border-b border-gray-800 text-gray-200 dark:text-gray-300"> Pautan cepat </h4> <ul class="grid grid-cols-2 gap-3"> <li> <a href="/ms/web-hosting/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hosting Web </a> </li> <li> <a href="/ms/cloud-hosting/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hosting Awan </a> </li> <li> <a href="/ms/shared-hosting/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hosting Dikongsi </a> </li> <li> <a href="/ms/vps-hosting/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hosting VPS </a> </li> <li> <a href="/ms/domain/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Aktiviti Domain </a> </li> <li> <a href="/ms/website-builders/" class="footer-link flex items-center !text-gray-400 whitespace-nowrap overflow-hidden"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Pembina Laman Web </a> </li> </ul> </div> <div> <h4 class="text-xl font-semibold mb-3 pb-2 border-b border-gray-800 text-gray-200 dark:text-gray-300"> Rekomendasi popular </h4> <ul class="grid grid-cols-1 gap-3"> <li> <a href="/tolink/zohomail-pricing/" class="footer-link flex items-center !text-gray-400"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Email perniagaan ZOHO mulai dari RM $1 sebulan. </a> </li> <li> <a href="https://www.likacloud.com/ko/link/8447424922" class="footer-link flex items-center !text-gray-400"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hostinger menawarkan maksimum 75% untuk hosting. </a> </li> <li> <a href="https://www.likacloud.com/ko/link/8108927953" class="footer-link flex items-center !text-gray-400"> <i class="fa fa-angle-right mr-2 text-blue-500 shrink-0"></i> Hosting VPS UltaHost bermula dari hanya RM5.50/bulan. </a> </li> </ul> </div> <div> <h4 class="text-xl font-semibold mb-3 pb-2 border-b border-gray-800 text-gray-200 dark:text-gray-300"> Berkongsi Aktiviti </h4> <a href="/tolink/cloudways-wordpress-hosting/"> <div class="xs:space-y-4 lg:space-y-4 grid grid-cols-1"> <div class="bg-gray-800/50 p-4 md:p-5 xl:p-4 rounded-lg hover-scale space-y-6"> <h5 class="font-medium !text-gray-400 xl:text-[15px] 2xl:text-text-base">Hosting WordPress Sepenuhnya Dikelola Di Seluruh Platform-Platform Multi-Awan</h5> <div class="flex items-center justify-between"> <p class="text-gray-400 text-sm"> </p> <span class="text-xs font-normal bg-orange-500 dark:bg-orange-600 text-white dark:text-gray-300 px-2 py-1 rounded-full inline-block"> Ujian Percuma 3-Hari </span> </div> </div> </div> </a> </div> </div> <div class="pt-7 sm:pt-6 lg:pt-8 border-t border-solid border-gray-800 relative" x-data="{ FTqqPoP : false, FTwxPoP : false, FTwbPoP : false, FTdyPoP : false, FTbiliPoP : false,FTksPoP : false, FTsphPoP : false}"> <div class="flex flex-col-reverse md:flex-row items-center justify-center md:justify-between gap-6 text-gray-500 lg:items-end"> <div class="flex flex-col lg:flex-row items-center xl:flex-nowrap justify-center md:justify-start md:items-start gap-5 md:gap-7 2xl:gap-12"> <div class="flex flex-col gap-4 xs:gap-6 xs:flex-row items-center justify-center md:justify-start text-sm"> <div> <span class="text-[0.9rem]">©</span> 2025 - 2026 ・ <a href="https://www.likacloud.com/ms/" class="!text-gray-500"> LikaCloud </a> </div> </div> <div class="lg:hidden xl:flex items-center space-x-3 md:space-x-7 2xl:space-x-12 text-sm xl:flex-nowrap"> <div class="flex items-center flex-col gap-4 xs:flex-row xs:gap-6 text-gray-500"> <a href="https://beian.miit.gov.cn" class="!text-gray-500">Dian ICP No. 20000330 - 9</a> </div> </div> </div> <div class="flex items-center md:items-end sm:justify-between flex-col md:flex-col lg:flex-row lg:items-end gap-6 lg:gap-7 shrink-0"> <ul class="flex flex-wrap justify-center gap-x-4 gap-y-2 text-sm text-gray-500 shrink-0"> <li> <a href="mailto:support@likacloud.com" class="!text-gray-500 hover:text-gray-300 transition-colors duration-200"> Hubungi kami. </a> </li> <li> <a href="/ms/aboutus/" class="!text-gray-500 hover:text-gray-300 transition-colors duration-200"> Tentang kami </a> </li> <li> <a href="/ms/company/" class="!text-gray-500 hover:text-gray-300 transition-colors duration-200"> Kolleksi pengilang </a> </li> <li> <a href="/ms/docs/" class="!text-gray-500 hover:text-gray-300 transition-colors duration-200"> Dokumen aplikasi </a> </li> </ul> </div> </div> </div> <div class="hidden xl:block"> <div id="side-rail-slider" x-data="{ isOpen: false, toggle() { this.isOpen = !this.isOpen } }" class="side-rail-slider pc hidden lg:block fixed left-0 xl:bottom-32 transform -translate-y-1/2 z-0" > <div x-data="{ likeExpanded: false, lastReaction: '点赞', totalCount: 80 }" x-init=" $nextTick(() => { }) " @mouseenter="likeExpanded = true" @mouseleave="likeExpanded = false" class="f-l-like mb-6 z-50" x-cloak> <div class="relative"> <div x-show="likeExpanded" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-x-2" x-transition:enter-end="opacity-100 translate-x-0" x-transition:leave="transition ease-in duration-200" x-transition:leave-start="opacity-100 translate-x-0" x-transition:leave-end="opacity-0 translate-x-2" class="likepopup absolute left-12 top-1/2 transform -translate-y-1/2 flex items-center bg-white dark:bg-gray-700 rounded-lg border border-solid border-gray-200 dark:border-gray-800 p-4" > <div class="flex gap-3 text-gray-500 dark:text-gray-400"> <button class="mr-reaction-btn" data-reaction="点赞" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-like-icon"></span></span> <span class="mr-reaction-name">Suka</span> <span class="mr-reaction-count">18</span> </button> <button class="mr-reaction-btn" data-reaction="感谢" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-thanks-icon"></span></span> <span class="mr-reaction-name">Terima kasih.</span> <span class="mr-reaction-count">6</span> </button> <button class="mr-reaction-btn" data-reaction="膜拜" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-worship-icon"></span></span> <span class="mr-reaction-name">\nMemuja</span> <span class="mr-reaction-count">20</span> </button> <button class="mr-reaction-btn" data-reaction="卷起来" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-rollup-icon"></span></span> <span class="mr-reaction-name">Gulung itu.</span> <span class="mr-reaction-count">16</span> </button> <button class="mr-reaction-btn" data-reaction="要火" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-fire-icon"></span></span> <span class="mr-reaction-name">Saya mahu menjadi terkenal.</span> <span class="mr-reaction-count">8</span> </button> <button class="mr-reaction-btn" data-reaction="求更新" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-update-icon"></span></span> <span class="mr-reaction-name">Mohon kemaskini</span> <span class="mr-reaction-count">12</span> </button> </div> </div> <button class="leftlike flex items-center justify-center bg-white dark:bg-gray-700 h-10 ml-0.5 rounded-full shadow-lg focus:outline-none focus:ring-opacity-50" aria-label="Suka" > <div class="mr-reaction-icon mr-sidebar-icon"> <template x-if="lastReaction === '点赞'"> <span class="emoji-item-icon emoji-sidebar-icon mr-like-icon"></span> </template> <template x-if="lastReaction === '感谢'"> <span class="emoji-item-icon emoji-sidebar-icon mr-thanks-icon"></span> </template> <template x-if="lastReaction === '膜拜'"> <span class="emoji-item-icon emoji-sidebar-icon mr-worship-icon"></span> </template> <template x-if="lastReaction === '卷起来'"> <span class="emoji-item-icon emoji-sidebar-icon mr-rollup-icon"></span> </template> <template x-if="lastReaction === '要火'"> <span class="emoji-item-icon emoji-sidebar-icon mr-fire-icon"></span> </template> <template x-if="lastReaction === '求更新'"> <span class="emoji-item-icon emoji-sidebar-icon mr-update-icon"></span> </template> </div> </button> <div class="bg-blue-300 dark:bg-gray-700 text-center rounded-full text-xs text-blue-700 dark:text-gray-300 -mt-1" x-text="totalCount"></div> </div> </div> <div x-data="{ shareExpanded: false }" x-init="shareExpanded = false" @mouseenter="shareExpanded = true" @mouseleave="shareExpanded = false" class="mb-10 z-50" x-cloak> <div class="relative"> <div x-show="shareExpanded" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-2" x-transition:enter-end="opacity-100 translate-y-0" x-transition:leave="transition ease-in duration-200" x-transition:leave-start="opacity-100 translate-y-0" x-transition:leave-end="opacity-0 translate-y-2" class="sharepopup absolute left-12 top-0 mb-2 bg-white dark:bg-gray-700 text-gray-500 dark:text-gray-300 text-sm rounded-lg shadow-lg py-2 min-w-[140px]" > <span class="text-sm px-4">Kongsi ke:</span> <button class="px-4 py-2.5 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full relative" x-data="{ showQr: false }" @mouseenter="showQr = true" @mouseleave="showQr = false" > <div class="page-qrcode absolute left-full w-[150px] ml-2 top-0 bg-white dark:bg-gray-700 p-2 shadow-lg rounded z-50 border dark:border-2 border-solid border-gray-400 dark:border-gray-600" x-show="showQr" x-transition data-url="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-complete-guide-core-techniques/" > <span class="flex justify-center pb-2">Scan kod QR pada telefon untuk berkongsi</span> </div> <i class="fa-brands fa-square-whatsapp text-green-500 mr-2 text-lg w-5 share-button" data-no-auto-translation=""></i> WhatsApp </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F" onclick="return sharePopup(this.href, 'facebook-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-facebook py-2.5 text-blue-600 mr-2 text-lg w-5"></i> Facebook </a> </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://twitter.com/intent/tweet?url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&text=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress." onclick="return sharePopup(this.href, 'x-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-twitter text-blue-500 py-2.5 mr-2 text-lg w-5"></i> X (Twitter) </a> </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&title=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress." onclick="return sharePopup(this.href, 'linkedin-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-linkedin py-2.5 text-blue-500 mr-2 text-lg w-5"></i> LinkedIn </a> </button> <button data-copy-mirror data-mirror-domain="www.likacloud.com" class="px-4 py-2.5 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-solid fa-link text-blue-500 mr-2 text-lg w-5"></i><span class="js-copy-text">Salin pautan</span></button> </div> <button class="leftshare-button p-2.5 xl:p-3 bg-white dark:bg-gray-700 text-gray-500 dark:text-gray-400 rounded-full shadow-lg hover:text-blue-500 focus:outline-none focus:ring-opacity-50" aria-label="Kongsi" > <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewbox="0 0 20 20" fill="currentColor"> <path d="M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z" /> </svg> </button> </div> </div> </div> </div> <div class="xl:hidden"> <div x-data="{ lastReaction: '点赞', totalCount: 80, scrollToTop() { window.scrollTo({ top: 0, behavior: 'smooth' }); }, closeAllPopups() { this.Likepopup = false; this.Sharepopup = false; } }" class="mb-footer-nav fixed inset-x-0 bottom-0 z-30 bg-white text-gray-500 shadow lg:hidden" > <div class="footer-nav-content flex items-center justify-around py-2 z-30 relative bg-white dark:bg-gray-800 border-t border-solid border-gray-200 dark:border-gray-700"> <button @click="Sharepopup = false; Likepopup = !Likepopup" class="relative flex items-center justify-center focus:outline-none focus:ring-opacity-50" aria-label="Suka" > <div class="mr-reaction-icon ftmb mr-sidebar-icon dark-filter08"> <template x-if="lastReaction === '点赞'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-like-icon"></span> </template> <template x-if="lastReaction === '感谢'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-thanks-icon"></span> </template> <template x-if="lastReaction === '膜拜'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-worship-icon"></span> </template> <template x-if="lastReaction === '卷起来'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-rollup-icon"></span> </template> <template x-if="lastReaction === '要火'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-fire-icon"></span> </template> <template x-if="lastReaction === '求更新'"> <span class="emoji-item-icon ftmb emoji-sidebar-icon mr-update-icon"></span> </template> </div> <div class="absolute left-8 top-1 min-w-7 h-4 leading-3 bg-gray-200 dark:bg-gray-700 text-center rounded-full text-xs text-blue-700 dark:text-gray-400 py-0.5" x-text="totalCount"></div> </button> <button class="dark:text-gray-400" @click="Likepopup = false; Sharepopup = !Sharepopup" > <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewbox="0 0 20 20" fill="currentColor"> <path d="M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z"></path> </svg> </button> <style>.mbcontent-menus{right: 33% !important;}</style> <button class="mb-alimenus w-6"></button> <div x-data="{ activeTab: 'top', scrollToTop() { window.scrollTo({ top: 0, behavior: 'smooth' }); } }"> <button @click="scrollToTop(); activeTab = 'top'" :class="{ 'text-blue-600': activeTab === 'top' }" class="flex flex-col items-center text-gray-600 dark:text-gray-400" > <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewbox="0 0 20 20" fill="currentColor"> <path fill-rule="evenodd" d="M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z" clip-rule="evenodd"></path> </svg> </button> </div> </div> <div x-show="Likepopup" x-cloak class="foot_menu fixed bottom-11 left-0 z-[25] w-full h-auto bg-gray-100 dark:bg-gray-800 shadow-base overflow-y-auto no-scrollbar bg-white" @click.away="Likepopup = false" > <div class="grid grid-cols-3 gap-2 p-4"> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="点赞" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-like-icon"></span></div> <span class="mr-reaction-name !text-xs">Suka</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">18</span> </button> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="感谢" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-thanks-icon"></span></div> <span class="mr-reaction-name !text-xs">Terima kasih.</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">6</span> </button> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="膜拜" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-worship-icon"></span></div> <span class="mr-reaction-name !text-xs">\nMemuja</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">20</span> </button> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="卷起来" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-rollup-icon"></span></div> <span class="mr-reaction-name !text-xs">Gulung itu.</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">16</span> </button> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="要火" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-fire-icon"></span></div> <span class="mr-reaction-name !text-xs">Saya mahu menjadi terkenal.</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">8</span> </button> <button class="mr-reaction-btn !px-0 !py-2 gap-1.5 text-gray-500 dark:text-gray-400 whitespace-nowrap flex-col" data-reaction="求更新" data-post-id="12362762" data-action="add" > <div class="mr-reaction-icon dark-filter08 !m-0 ftmb"><span class="emoji-item-icon mr-update-icon"></span></div> <span class="mr-reaction-name !text-xs">Mohon kemaskini</span> <span class="mr-reaction-count !text-xs dark:text-gray-400">12</span> </button> </div> </div> <div x-show="Sharepopup" x-cloak class="foot_menu fixed bottom-11 left-0 z-[25] w-full h-auto bg-gray-100 dark:bg-gray-800 shadow-base overflow-y-auto no-scrollbar bg-white" @click.away="Sharepopup = false" > <div class="p-4 mb-1.5 md:px-8"> <span class="text-sm text-gray-500">Kongsi ke:</span> <div class="flex flex-row items-center justify-between gap-2 mt-2"> <button class="flex flex-col items-center rounded-lg" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F', 'facebook-share', 'width=600,height=500')" > <i class="fa-brands fa-facebook text-blue-600 text-xl mb-1"></i> <span class="text-xs dark:text-gray-400">Facebook</span> </button> <button class="flex flex-col items-center rounded-lg" onclick="window.open('https://twitter.com/intent/tweet?url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&text=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress.', 'x-share', 'width=600,height=500')" > <i class="fa-brands fa-twitter text-blue-500 text-xl mb-1"></i> <span class="text-xs dark:text-gray-400">X (Twitter)</span> </button> <button class="flex flex-col items-center rounded-lg" onclick="window.open('https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&title=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress.', 'linkedin-share', 'width=600,height=500')" > <i class="fa-brands fa-linkedin text-blue-500 text-xl mb-1"></i> <span class="text-xs dark:text-gray-400">LinkedIn</span> </button> <button class="flex flex-col items-center rounded-lg text-xs dark:text-gray-400" data-copy-mirror data-mirror-domain="www.likacloud.com" > <i class="fa-solid fa-link text-blue-500 mb-1 text-lg"></i> <span class="js-copy-text">Salin pautan</span> </button> </div> </div> </div> </div> <div x-show="Likepopup || Sharepopup" x-cloak x-transition:enter="transition-opacity duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition-opacity duration-300" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" @click="CategoryMenu = false" class="ft-mask-layer fixed inset-0 bg-black bg-opacity-50 z-10 xl:hidden" > </div> <div id="side-rail-slider" x-data="{ isOpen: false, toggle() { this.isOpen = !this.isOpen } }" class="side-rail-slider pc hidden lg:block fixed left-0 xl:bottom-32 transform -translate-y-1/2 z-0" > <div x-data="{ likeExpanded: false, lastReaction: '点赞', totalCount: 80 }" x-init=" $nextTick(() => { }) " @mouseenter="likeExpanded = true" @mouseleave="likeExpanded = false" class="f-l-like mb-6 z-50" x-cloak> <div class="relative"> <div x-show="likeExpanded" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-x-2" x-transition:enter-end="opacity-100 translate-x-0" x-transition:leave="transition ease-in duration-200" x-transition:leave-start="opacity-100 translate-x-0" x-transition:leave-end="opacity-0 translate-x-2" class="likepopup absolute left-12 top-1/2 transform -translate-y-1/2 flex items-center bg-white dark:bg-gray-700 rounded-lg border border-solid border-gray-200 dark:border-gray-800 p-4" > <div class="flex gap-3 text-gray-500 dark:text-gray-400"> <button class="mr-reaction-btn" data-reaction="点赞" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-like-icon"></span></span> <span class="mr-reaction-name">Suka</span> <span class="mr-reaction-count">18</span> </button> <button class="mr-reaction-btn" data-reaction="感谢" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-thanks-icon"></span></span> <span class="mr-reaction-name">Terima kasih.</span> <span class="mr-reaction-count">6</span> </button> <button class="mr-reaction-btn" data-reaction="膜拜" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-worship-icon"></span></span> <span class="mr-reaction-name">\nMemuja</span> <span class="mr-reaction-count">20</span> </button> <button class="mr-reaction-btn" data-reaction="卷起来" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-rollup-icon"></span></span> <span class="mr-reaction-name">Gulung itu.</span> <span class="mr-reaction-count">16</span> </button> <button class="mr-reaction-btn" data-reaction="要火" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-fire-icon"></span></span> <span class="mr-reaction-name">Saya mahu menjadi terkenal.</span> <span class="mr-reaction-count">8</span> </button> <button class="mr-reaction-btn" data-reaction="求更新" data-post-id="12362762" data-object-type="post" data-action="add"> <span class="mr-reaction-icon dark-filter08 sidebar-icon"><span class="emoji-item-icon mr-update-icon"></span></span> <span class="mr-reaction-name">Mohon kemaskini</span> <span class="mr-reaction-count">12</span> </button> </div> </div> <button class="leftlike flex items-center justify-center bg-white dark:bg-gray-700 h-10 ml-0.5 rounded-full shadow-lg focus:outline-none focus:ring-opacity-50" aria-label="Suka" > <div class="mr-reaction-icon mr-sidebar-icon"> <template x-if="lastReaction === '点赞'"> <span class="emoji-item-icon emoji-sidebar-icon mr-like-icon"></span> </template> <template x-if="lastReaction === '感谢'"> <span class="emoji-item-icon emoji-sidebar-icon mr-thanks-icon"></span> </template> <template x-if="lastReaction === '膜拜'"> <span class="emoji-item-icon emoji-sidebar-icon mr-worship-icon"></span> </template> <template x-if="lastReaction === '卷起来'"> <span class="emoji-item-icon emoji-sidebar-icon mr-rollup-icon"></span> </template> <template x-if="lastReaction === '要火'"> <span class="emoji-item-icon emoji-sidebar-icon mr-fire-icon"></span> </template> <template x-if="lastReaction === '求更新'"> <span class="emoji-item-icon emoji-sidebar-icon mr-update-icon"></span> </template> </div> </button> <div class="bg-blue-300 dark:bg-gray-700 text-center rounded-full text-xs text-blue-700 dark:text-gray-300 -mt-1" x-text="totalCount"></div> </div> </div> <div x-data="{ shareExpanded: false }" x-init="shareExpanded = false" @mouseenter="shareExpanded = true" @mouseleave="shareExpanded = false" class="mb-10 z-50" x-cloak> <div class="relative"> <div x-show="shareExpanded" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-2" x-transition:enter-end="opacity-100 translate-y-0" x-transition:leave="transition ease-in duration-200" x-transition:leave-start="opacity-100 translate-y-0" x-transition:leave-end="opacity-0 translate-y-2" class="sharepopup absolute left-12 top-0 mb-2 bg-white dark:bg-gray-700 text-gray-500 dark:text-gray-300 text-sm rounded-lg shadow-lg py-2 min-w-[140px]" > <span class="text-sm px-4">Kongsi ke:</span> <button class="px-4 py-2.5 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full relative" x-data="{ showQr: false }" @mouseenter="showQr = true" @mouseleave="showQr = false" > <div class="page-qrcode absolute left-full w-[150px] ml-2 top-0 bg-white dark:bg-gray-700 p-2 shadow-lg rounded z-50 border dark:border-2 border-solid border-gray-400 dark:border-gray-600" x-show="showQr" x-transition data-url="https://www.likacloud.com/ms/knowledge/wordpress/wordpress-theme-development-complete-guide-core-techniques/" > <span class="flex justify-center pb-2">Scan kod QR pada telefon untuk berkongsi</span> </div> <i class="fa-brands fa-square-whatsapp text-green-500 mr-2 text-lg w-5 share-button" data-no-auto-translation=""></i> WhatsApp </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F" onclick="return sharePopup(this.href, 'facebook-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-facebook py-2.5 text-blue-600 mr-2 text-lg w-5"></i> Facebook </a> </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://twitter.com/intent/tweet?url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&text=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress." onclick="return sharePopup(this.href, 'x-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-twitter text-blue-500 py-2.5 mr-2 text-lg w-5"></i> X (Twitter) </a> </button> <button class="w-full share-button" data-no-auto-translation=""> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.likacloud.com%2Fms%2Fknowledge%2Fwordpress%2Fwordpress-theme-development-complete-guide-core-techniques%2F&title=Dari+awal%3A+Panduan+lengkap+dan+teknik+teras+untuk+pembangunan+tema+WordPress." onclick="return sharePopup(this.href, 'linkedin-share', 600, 500)" class="px-4 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-brands fa-linkedin py-2.5 text-blue-500 mr-2 text-lg w-5"></i> LinkedIn </a> </button> <button data-copy-mirror data-mirror-domain="www.likacloud.com" class="px-4 py-2.5 hover:bg-gray-100 dark:hover:bg-gray-800 text-left flex items-center w-full"> <i class="fa-solid fa-link text-blue-500 mr-2 text-lg w-5"></i><span class="js-copy-text">Salin pautan</span></button> </div> <button class="leftshare-button p-2.5 xl:p-3 bg-white dark:bg-gray-700 text-gray-500 dark:text-gray-400 rounded-full shadow-lg hover:text-blue-500 focus:outline-none focus:ring-opacity-50" aria-label="Kongsi" > <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewbox="0 0 20 20" fill="currentColor"> <path d="M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z" /> </svg> </button> </div> </div> </div> </div> <button id="scrolltop-btn" x-data="{ show: false, scrollHandler: null, init() { this.checkScroll(); this.scrollHandler = () => this.checkScroll(); window.addEventListener('scroll', this.scrollHandler, { passive: true }); }, checkScroll() { this.show = window.scrollY > 300; }, scrollToTop() { window.scrollTo({ top: window.scrollY, behavior: 'auto' }); window.scrollTo({ top: 0, behavior: 'smooth' }); }, destroy() { window.removeEventListener('scroll', this.scrollHandler); } }" @click="scrollToTop()" x-show="show" x-cloak x-transition.opacity class="rightscrolltop-button fixed right-0.5 hidden lg:block 2xl:right-1 bottom-40 lg:bottom-36 2xl:bottom-44 z-0 p-2.5 xl:p-3 bg-white dark:bg-gray-700 text-gray-500 dark:text-gray-400 hover:text-blue-500 rounded-full shadow-lg focus:outline-none focus:ring-opacity-50" aria-label="Kembali ke atas." > <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewbox="0 0 20 20" fill="currentColor"> <path fill-rule="evenodd" d="M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z" clip-rule="evenodd" /> </svg> </button> <style>#chat-toggle {bottom: 5rem;}#chat-window {bottom: 8rem;}@media (min-width: 768px) {#chat-toggle {bottom: 12rem;}#chat-window {bottom: 15rem;}}@media (min-width: 768px) {#chat-toggle {bottom: 10.5rem;}#chat-window {bottom: 13.5rem;}}@media (min-width: 1024px) {#chat-toggle {bottom: 4.5rem;}#chat-window {bottom: 7.5rem;}}</style> <style>@media (min-width: 1024px) {#scrolltop-btn{bottom:14rem}}#scrolltop-btn.width-1550-plus.rightscrolltop-button{bottom:14rem}@media (min-width: 1280px) {#scrolltop-btn{bottom:10rem}}</style> <div x-show="CategoryMenu" x-cloak x-transition:enter="transition-opacity duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition-opacity duration-300" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" @click="CategoryMenu = false" class="ft-mask-layer fixed inset-0 bg-black bg-opacity-50 z-[31] xl:hidden" > </div> <button id="chat-toggle" class="fixed bottom-4 md:bottom-40 lg:bottom-16 right-[0.2rem] w-9 h-9 xl:w-10 xl:h-10 rounded-full shadow-2xl backdrop-blur-md flex items-center justify-center text-lg text-white bg-gradient-to-br from-blue-500 to-indigo-600 hover:scale-110 transition-all duration-300 z-5" aria-label="Buka sembang"> <i class="fa-solid fa-comment-dots"></i> </button> <div id="chat-window" class="fixed bottom-16 md:bottom-52 lg:bottom-28 right-6 w-96 bg-white dark:bg-gray-900 shadow-2xl rounded-lg border-solid border border-gray-200 dark:border-gray-700 flex flex-col overflow-hidden sm:w-96 w-[calc(100vw-3rem)] md:max-h-[35rem] lg:max-h-[25rem] xl:max-h-[35rem] max-h-[64vh] hidden z-11"> <div class="px-4 py-2 md:p-4 text-lg font-semibold bg-gradient-to-r from-blue-600 to-indigo-600 text-white flex items-center justify-between"> <span>Pembantu AI</span> <div class="flex items-center gap-6"> <button id="chat-clear" class="text-white text-base hover:opacity-80" title="Menghapuskan rekod perbualan."> <i class="fa-solid fa-trash"></i> </button> <button id="chat-close" class="text-white text-xl hover:opacity-80"><i class="fa-solid fa-xmark"></i></button> </div> </div> <div id="chat-messages" class="chat-messages-windows flex-1 p-4 overflow-y-auto space-y-4 text-sm bg-gray-50 dark:bg-gray-800"> <p class="text-gray-400 text-center">Halo, saya pembantu kecil LikaCloud, gembira melayani anda!</p> </div> <div class="p-3 border-t bg-white dark:bg-gray-900 border-gray-200 dark:border-gray-700 flex gap-2"> <input id="chat-input" type="text" placeholder="Silakan masukkan soalan…" class="flex-1 border !rounded-lg px-3 py-2 text-sm outline-none focus:ring-2 text-gray-700 dark:!border-gray-700 focus:ring-blue-400 dark:bg-gray-800 dark:text-white"> <button id="chat-send" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg transition shrink-0"> Hantarkan </button> </div> <div id="chat-confirm-mask" class="absolute inset-0 bg-gray-900/70 flex items-center justify-center hidden z-20"> <div class="bg-white dark:bg-gray-700 rounded-lg shadow-xl p-5 w-72"> <p class="text-gray-800 dark:text-gray-200 text-sm mb-4 text-center"> Adakah anda pasti ingin memadam semua rekod perbualan? </p> <div class="flex justify-end gap-3"> <button id="chat-confirm-cancel" class="px-3 py-1.5 text-sm text-gray-800 rounded border border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-800"> Batalkan </button> <button id="chat-confirm-ok" class="px-3 py-1.5 text-sm rounded bg-red-600 text-white hover:bg-red-700"> \nPadam </button> </div> </div> </div> </div> </div> </footer> </div> <div data-rocket-location-hash="51c620193beeeeea4e308aea33e56a5f" id="common-tooltip" class="hidden xl:block fixed opacity-0 z-50 px-3 py-1.5 rounded bg-gray-800 text-white dark:bg-gray-700 dark:text-gray-100"></div> <script>const query = "";</script> <template id="tp-language" data-tp-language="ms_MY"></template> <script>
(function(){
if (!document.getElementById('cmplz-cookiebanner-container')) {
var d = document.createElement('div');
d.id = 'cmplz-cookiebanner-container';
document.body.appendChild(d);
}
})();
</script> <script type="speculationrules">
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/ms/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/data/attachment/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/Cloud/*","/wp-content/themes/blankslate/*","/ms/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
</script> <div data-rocket-location-hash="e0584665a719f063f60916279be5b9af" class="trp_model_container" id="trp_ald_modal_container" style="display: none" data-no-dynamic-translation data-no-translation> <div class="trp_ald_modal" id="trp_ald_modal_popup"> <div id="trp_ald_popup_text"> We've detected you might be speaking a different language. Do you want to change to: </div> <div class="trp_ald_select_and_button"> <div class="trp_ald_ls_container"> <div class="trp-language-switcher trp-language-switcher-container" id="trp_ald_popup_select_container" data-no-translation data-no-auto-translation=""> <div class="trp-ls-shortcode-current-language" id="zh_CN" special-selector="trp_ald_popup_current_language" data-trp-ald-selected-language= "zh_CN" data-no-auto-translation=""> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image" alt="Change language to 简体中文" loading="lazy" decoding="async" width="18" height="14" /> 简体中文 </div> <div class="trp-ls-shortcode-language" data-no-auto-translation=""> <div class="trp-ald-popup-select" id="zh_CN" data-trp-ald-selected-language = "zh_CN"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image" alt="Change language to 简体中文" loading="lazy" decoding="async" width="18" height="14" /> 简体中文 </div> <div class="trp-ald-popup-select" id="zh_Hant" data-trp-ald-selected-language = "zh_Hant"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (通用)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (通用) </div> <div class="trp-ald-popup-select" id="en_US" data-trp-ald-selected-language = "en_US"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/en_US.svg" class="trp-flag-image" alt="Change language to English" loading="lazy" decoding="async" width="18" height="14" /> English </div> <div class="trp-ald-popup-select" id="ru_RU" data-trp-ald-selected-language = "ru_RU"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ru_RU.svg" class="trp-flag-image" alt="Change language to Русский" loading="lazy" decoding="async" width="18" height="14" /> Русский </div> <div class="trp-ald-popup-select" id="ja" data-trp-ald-selected-language = "ja"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ja.svg" class="trp-flag-image" alt="Change language to 日本語" loading="lazy" decoding="async" width="18" height="14" /> 日本語 </div> <div class="trp-ald-popup-select" id="ko_KR" data-trp-ald-selected-language = "ko_KR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ko_KR.svg" class="trp-flag-image" alt="Change language to 한국어" loading="lazy" decoding="async" width="18" height="14" /> 한국어 </div> <div class="trp-ald-popup-select" id="es_ES" data-trp-ald-selected-language = "es_ES"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/es_ES.svg" class="trp-flag-image" alt="Change language to Español" loading="lazy" decoding="async" width="18" height="14" /> Español </div> <div class="trp-ald-popup-select" id="pt_BR" data-trp-ald-selected-language = "pt_BR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/pt_BR.svg" class="trp-flag-image" alt="Change language to Português do Brasil" loading="lazy" decoding="async" width="18" height="14" /> Português do Brasil </div> <div class="trp-ald-popup-select" id="de_DE" data-trp-ald-selected-language = "de_DE"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/de_DE.svg" class="trp-flag-image" alt="Change language to Deutsch" loading="lazy" decoding="async" width="18" height="14" /> Deutsch </div> <div class="trp-ald-popup-select" id="fr_FR" data-trp-ald-selected-language = "fr_FR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/fr_FR.svg" class="trp-flag-image" alt="Change language to Français" loading="lazy" decoding="async" width="18" height="14" /> Français </div> <div class="trp-ald-popup-select" id="ar" data-trp-ald-selected-language = "ar"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ar.svg" class="trp-flag-image" alt="Change language to العربية" loading="lazy" decoding="async" width="18" height="14" /> العربية </div> <div class="trp-ald-popup-select" id="zh_TW" data-trp-ald-selected-language = "zh_TW"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (台湾)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (台湾) </div> <div class="trp-ald-popup-select" id="zh_HK" data-trp-ald-selected-language = "zh_HK"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (香港)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (香港) </div> <div class="trp-ald-popup-select" id="yue" data-trp-ald-selected-language = "yue"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="粤语" loading="lazy" decoding="async" width="18" height="14" /> 粤语 </div> <div class="trp-ald-popup-select" id="pl_PL" data-trp-ald-selected-language = "pl_PL"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/pl_PL.svg" class="trp-flag-image" alt="Change language to Polski" loading="lazy" decoding="async" width="18" height="14" /> Polski </div> <div class="trp-ald-popup-select" id="ms_MY" data-trp-ald-selected-language = "ms_MY"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ms_MY.svg" class="trp-flag-image" alt="" role="presentation" loading="lazy" decoding="async" width="18" height="14" /> Bahasa Melayu </div> <div class="trp-ald-popup-select" id="nl_NL" data-trp-ald-selected-language = "nl_NL"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/nl_NL.svg" class="trp-flag-image" alt="Change language to Nederlands" loading="lazy" decoding="async" width="18" height="14" /> Nederlands </div> <div class="trp-ald-popup-select" id="tr_TR" data-trp-ald-selected-language = "tr_TR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/tr_TR.svg" class="trp-flag-image" alt="Change language to Türkçe" loading="lazy" decoding="async" width="18" height="14" /> Türkçe </div> <div class="trp-ald-popup-select" id="th" data-trp-ald-selected-language = "th"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/th.svg" class="trp-flag-image" alt="Change language to ไทย" loading="lazy" decoding="async" width="18" height="14" /> ไทย </div> <div class="trp-ald-popup-select" id="it_IT" data-trp-ald-selected-language = "it_IT"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/it_IT.svg" class="trp-flag-image" alt="Change language to Italiano" loading="lazy" decoding="async" width="18" height="14" /> Italiano </div> <div class="trp-ald-popup-select" id="cs_CZ" data-trp-ald-selected-language = "cs_CZ"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/cs_CZ.svg" class="trp-flag-image" alt="Change language to Čeština" loading="lazy" decoding="async" width="18" height="14" /> Čeština </div> <div class="trp-ald-popup-select" id="uk" data-trp-ald-selected-language = "uk"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/uk.svg" class="trp-flag-image" alt="Change language to Українська" loading="lazy" decoding="async" width="18" height="14" /> Українська </div> <div class="trp-ald-popup-select" id="id_ID" data-trp-ald-selected-language = "id_ID"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/id_ID.svg" class="trp-flag-image" alt="Change language to Bahasa Indonesia" loading="lazy" decoding="async" width="18" height="14" /> Bahasa Indonesia </div> <div class="trp-ald-popup-select" id="vi" data-trp-ald-selected-language = "vi"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/vi.svg" class="trp-flag-image" alt="Change language to Tiếng Việt" loading="lazy" decoding="async" width="18" height="14" /> Tiếng Việt </div> </div> </div> </div> <div class="trp_ald_button"> <a href="https://www.likacloud.com" id="trp_ald_popup_change_language"> Change Language </a> </div> </div> <a id="trp_ald_x_button_and_textarea" href="#"> <span id="trp_ald_x_button" title="Close and do not switch language"></span> <span id="trp_ald_x_button_textarea" title="Close and do not switch language"> Close and do not switch language </span> </a> </div> </div> <template id="trp_ald_no_text_popup_template"> <div id="trp_no_text_popup_wrap"> <div id="trp_no_text_popup" class="trp_ald_no_text_popup" data-no-dynamic-translation data-no-translation> <div id="trp_ald_not_text_popup_ls_and_button"> <div id="trp_ald_no_text_popup_div"> <span id="trp_ald_no_text_popup_text"> We've detected you might be speaking a different language. Do you want to change to: </span> </div> <div class="trp_ald_ls_container"> <div class="trp-language-switcher trp-language-switcher-container" id="trp_ald_no_text_select" data-no-translation data-no-auto-translation=""> <div class="trp-ls-shortcode-current-language" id="zh_CN" special-selector="trp_ald_popup_current_language" data-trp-ald-selected-language="zh_CN" data-no-auto-translation=""> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image" alt="Change language to 简体中文" loading="lazy" decoding="async" width="18" height="14" /> 简体中文 </div> <div class="trp-ls-shortcode-language" id="trp_ald_no_text_popup_select_container" data-no-auto-translation=""> <div class="trp-ald-popup-select" id="zh_CN" data-trp-ald-selected-language= "zh_CN"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image" alt="Change language to 简体中文" loading="lazy" decoding="async" width="18" height="14" /> 简体中文 </div> <div class="trp-ald-popup-select" id="zh_Hant" data-trp-ald-selected-language="zh_Hant"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (通用)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (通用) </div> <div class="trp-ald-popup-select" id="en_US" data-trp-ald-selected-language="en_US"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/en_US.svg" class="trp-flag-image" alt="Change language to English" loading="lazy" decoding="async" width="18" height="14" /> English </div> <div class="trp-ald-popup-select" id="ru_RU" data-trp-ald-selected-language="ru_RU"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ru_RU.svg" class="trp-flag-image" alt="Change language to Русский" loading="lazy" decoding="async" width="18" height="14" /> Русский </div> <div class="trp-ald-popup-select" id="ja" data-trp-ald-selected-language="ja"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ja.svg" class="trp-flag-image" alt="Change language to 日本語" loading="lazy" decoding="async" width="18" height="14" /> 日本語 </div> <div class="trp-ald-popup-select" id="ko_KR" data-trp-ald-selected-language="ko_KR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ko_KR.svg" class="trp-flag-image" alt="Change language to 한국어" loading="lazy" decoding="async" width="18" height="14" /> 한국어 </div> <div class="trp-ald-popup-select" id="es_ES" data-trp-ald-selected-language="es_ES"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/es_ES.svg" class="trp-flag-image" alt="Change language to Español" loading="lazy" decoding="async" width="18" height="14" /> Español </div> <div class="trp-ald-popup-select" id="pt_BR" data-trp-ald-selected-language="pt_BR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/pt_BR.svg" class="trp-flag-image" alt="Change language to Português do Brasil" loading="lazy" decoding="async" width="18" height="14" /> Português do Brasil </div> <div class="trp-ald-popup-select" id="de_DE" data-trp-ald-selected-language="de_DE"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/de_DE.svg" class="trp-flag-image" alt="Change language to Deutsch" loading="lazy" decoding="async" width="18" height="14" /> Deutsch </div> <div class="trp-ald-popup-select" id="fr_FR" data-trp-ald-selected-language="fr_FR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/fr_FR.svg" class="trp-flag-image" alt="Change language to Français" loading="lazy" decoding="async" width="18" height="14" /> Français </div> <div class="trp-ald-popup-select" id="ar" data-trp-ald-selected-language="ar"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ar.svg" class="trp-flag-image" alt="Change language to العربية" loading="lazy" decoding="async" width="18" height="14" /> العربية </div> <div class="trp-ald-popup-select" id="zh_TW" data-trp-ald-selected-language="zh_TW"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (台湾)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (台湾) </div> <div class="trp-ald-popup-select" id="zh_HK" data-trp-ald-selected-language="zh_HK"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="繁體中文 (香港)" loading="lazy" decoding="async" width="18" height="14" /> 繁體中文 (香港) </div> <div class="trp-ald-popup-select" id="yue" data-trp-ald-selected-language="yue"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/zh_CN.svg" class="trp-flag-image trp-custom-flag" alt="粤语" loading="lazy" decoding="async" width="18" height="14" /> 粤语 </div> <div class="trp-ald-popup-select" id="pl_PL" data-trp-ald-selected-language="pl_PL"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/pl_PL.svg" class="trp-flag-image" alt="Change language to Polski" loading="lazy" decoding="async" width="18" height="14" /> Polski </div> <div class="trp-ald-popup-select" id="ms_MY" data-trp-ald-selected-language="ms_MY"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/ms_MY.svg" class="trp-flag-image" alt="" role="presentation" loading="lazy" decoding="async" width="18" height="14" /> Bahasa Melayu </div> <div class="trp-ald-popup-select" id="nl_NL" data-trp-ald-selected-language="nl_NL"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/nl_NL.svg" class="trp-flag-image" alt="Change language to Nederlands" loading="lazy" decoding="async" width="18" height="14" /> Nederlands </div> <div class="trp-ald-popup-select" id="tr_TR" data-trp-ald-selected-language="tr_TR"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/tr_TR.svg" class="trp-flag-image" alt="Change language to Türkçe" loading="lazy" decoding="async" width="18" height="14" /> Türkçe </div> <div class="trp-ald-popup-select" id="th" data-trp-ald-selected-language="th"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/th.svg" class="trp-flag-image" alt="Change language to ไทย" loading="lazy" decoding="async" width="18" height="14" /> ไทย </div> <div class="trp-ald-popup-select" id="it_IT" data-trp-ald-selected-language="it_IT"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/it_IT.svg" class="trp-flag-image" alt="Change language to Italiano" loading="lazy" decoding="async" width="18" height="14" /> Italiano </div> <div class="trp-ald-popup-select" id="cs_CZ" data-trp-ald-selected-language="cs_CZ"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/cs_CZ.svg" class="trp-flag-image" alt="Change language to Čeština" loading="lazy" decoding="async" width="18" height="14" /> Čeština </div> <div class="trp-ald-popup-select" id="uk" data-trp-ald-selected-language="uk"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/uk.svg" class="trp-flag-image" alt="Change language to Українська" loading="lazy" decoding="async" width="18" height="14" /> Українська </div> <div class="trp-ald-popup-select" id="id_ID" data-trp-ald-selected-language="id_ID"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/id_ID.svg" class="trp-flag-image" alt="Change language to Bahasa Indonesia" loading="lazy" decoding="async" width="18" height="14" /> Bahasa Indonesia </div> <div class="trp-ald-popup-select" id="vi" data-trp-ald-selected-language="vi"> <img src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/flags/1x1/vi.svg" class="trp-flag-image" alt="Change language to Tiếng Việt" loading="lazy" decoding="async" width="18" height="14" /> Tiếng Việt </div> </div> </div> </div> <div class="trp_ald_change_language_div"> <a href="https://www.likacloud.com" id="trp_ald_no_text_popup_change_language"> Change Language </a> </div> </div> <div id="trp_ald_no_text_popup_x"> <button id="trp_close"></button> </div> </div> </div> </template> <div id="cmplz-cookiebanner-container"><div class="cmplz-cookiebanner cmplz-hidden banner-1 banner-a optin cmplz-bottom-left cmplz-categories-type-view-preferences" aria-modal="true" data-nosnippet="true" role="dialog" aria-live="polite" aria-labelledby="cmplz-header-1-optin" aria-describedby="cmplz-message-1-optin"> <div class="cmplz-header"> <div class="cmplz-logo"></div> <div class="cmplz-title" id="cmplz-header-1-optin">Uruskan Persetujuan</div> <div class="cmplz-close" tabindex="0" role="button" aria-label="Tutup dialog" data-no-translation-aria-label=""> <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 352 512"><path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"></path></svg> </div> </div> <div class="cmplz-divider cmplz-divider-header"></div> <div class="cmplz-body"> <div class="cmplz-message" id="cmplz-message-1-optin"><p>Kami menggunakan kuki dan teknologi serupa untuk menyimpan/mengakses maklumat peranti dan memproses data seperti tingkah laku pelayaran. Jika tidak memberi persetujuan, ini mungkin akan mempengaruhi ciri-ciri tertentu.</p></div> <div class="cmplz-categories"> <details class="cmplz-category cmplz-functional" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Fungsional</span> <span class='cmplz-always-active'> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-functional-optin" data-category="cmplz_functional" class="cmplz-consent-checkbox cmplz-functional" size="40" value="1"/> <label class="cmplz-label" for="cmplz-functional-optin"><span class="screen-reader-text">Fungsional</span></label> </span> Selalu aktif. </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-functional">Penyimpanan atau akses adalah penting untuk menyediakan perkhidmatan yang diminta oleh pengguna atau untuk menghantar komunikasi melalui rangkaian.</span> </div> </details> <details class="cmplz-category cmplz-preferences" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Preferensi</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-preferences-optin" data-category="cmplz_preferences" class="cmplz-consent-checkbox cmplz-preferences" size="40" value="1"/> <label class="cmplz-label" for="cmplz-preferences-optin"><span class="screen-reader-text">Preferensi</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-preferences">Penyimpanan teknikal atau akses adalah perlu untuk tujuan sah menyimpan keutamaan yang tidak diminta oleh pelanggan atau pengguna.</span> </div> </details> <details class="cmplz-category cmplz-statistics" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Statistik</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-statistics-optin" data-category="cmplz_statistics" class="cmplz-consent-checkbox cmplz-statistics" size="40" value="1"/> <label class="cmplz-label" for="cmplz-statistics-optin"><span class="screen-reader-text">Statistik</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-statistics">Penyimpanan teknikal atau akses yang digunakan secara eksklusif untuk tujuan statistik.</span> <span class="cmplz-description-statistics-anonymous">Penyimpanan atau akses adalah untuk statistik tanpa nama sahaja. Tanpa permintaan undang-undang atau data pihak ketiga, maklumat ini biasanya tidak dapat mengenal pasti anda.</span> </div> </details> <details class="cmplz-category cmplz-marketing" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Pemasaran</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-marketing-optin" data-category="cmplz_marketing" class="cmplz-consent-checkbox cmplz-marketing" size="40" value="1"/> <label class="cmplz-label" for="cmplz-marketing-optin"><span class="screen-reader-text">Pemasaran</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-marketing">Penyimpanan teknikal atau akses diperlukan untuk mencipta profil pengguna untuk menghantar iklan, atau untuk menjejak pengguna di laman web atau di beberapa laman web untuk tujuan pemasaran yang serupa.</span> </div> </details> </div> </div> <div class="cmplz-links cmplz-information"> <ul> <li><a class="cmplz-link cmplz-manage-options cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container" data-no-translation="" data-trp-gettext="">Kawal pilihan</a></li> <li><a class="cmplz-link cmplz-manage-third-parties cookie-statement" href="#" data-relative_url="#cmplz-cookies-overview" data-no-translation="" data-trp-gettext="">Menguruskan perkhidmatan.</a></li> <li><a class="cmplz-link cmplz-manage-vendors tcf cookie-statement" href="#" data-relative_url="#cmplz-tcf-wrapper" data-no-translation="" data-trp-gettext="">Menguruskan vendor {vendor_count}</a></li> <li><a class="cmplz-link cmplz-external cmplz-read-more-purposes tcf" target="_blank" rel="noopener noreferrer nofollow" href="https://cookiedatabase.org/tcf/purposes/" aria-label="Baca lebih lanjut mengenai tujuan TCF di Pangkalan Data Cookie." data-no-translation="" data-trp-gettext="" data-no-translation-aria-label="">Baca lebih lanjut mengenai tujuan-tujuan ini.</a></li> </ul> </div> <div class="cmplz-divider cmplz-footer"></div> <div class="cmplz-buttons"> <button class="cmplz-btn cmplz-accept">Terima.</button> <button class="cmplz-btn cmplz-deny">Menafikan</button> <button class="cmplz-btn cmplz-view-preferences">Preferensi</button> <button class="cmplz-btn cmplz-save-preferences">Simpan</button> <a class="cmplz-btn cmplz-manage-options tcf cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container">Preferensi</a> </div> <div class="cmplz-documents cmplz-links"> <ul> <li><a class="cmplz-link cookie-statement" href="#" data-relative_url="">\n{title}</a></li> <li><a class="cmplz-link privacy-statement" href="#" data-relative_url="">\n{title}</a></li> <li><a class="cmplz-link impressum" href="#" data-relative_url="">\n{title}</a></li> </ul> </div> </div> </div> <div id="cmplz-manage-consent" data-nosnippet="true"><button class="cmplz-btn cmplz-hidden cmplz-manage-consent manage-consent-1">Uruskan Persetujuan</button> </div><script>
jQuery(document).ready(function($) {
var deviceAgent = navigator.userAgent.toLowerCase();
if (deviceAgent.match(/(iphone|ipod|ipad)/)) {
$("html").addClass("ios");
$("html").addClass("mobile");
}
if (deviceAgent.match(/(Android)/)) {
$("html").addClass("android");
$("html").addClass("mobile");
}
if (navigator.userAgent.search("MSIE") >= 0) {
$("html").addClass("ie");
}
else if (navigator.userAgent.search("Chrome") >= 0) {
$("html").addClass("chrome");
}
else if (navigator.userAgent.search("Firefox") >= 0) {
$("html").addClass("firefox");
}
else if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) {
$("html").addClass("safari");
}
else if (navigator.userAgent.search("Opera") >= 0) {
$("html").addClass("opera");
}
});
</script> <script type="text/javascript" id="trp-dynamic-translator-js-extra">
/* <![CDATA[ */
var trp_data = {"trp_custom_ajax_url":"https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/includes/trp-ajax.php","trp_wp_ajax_url":"https://www.likacloud.com/wp-admin/admin-ajax.php","trp_language_to_query":"ms_MY","trp_original_language":"zh_CN","trp_current_language":"ms_MY","trp_skip_selectors":["[data-no-translation]","[data-no-dynamic-translation]","[data-trp-translate-id-innertext]","script","style","head","trp-span","translate-press","[data-trp-translate-id]","[data-trpgettextoriginal]","[data-trp-post-slug]"],"trp_base_selectors":["data-trp-translate-id","data-trpgettextoriginal","data-trp-post-slug"],"trp_attributes_selectors":{"text":{"accessor":"outertext","attribute":false},"block":{"accessor":"innertext","attribute":false},"image_src":{"selector":"img[src]","accessor":"src","attribute":true},"submit":{"selector":"input[type='submit'],input[type='button'], input[type='reset']","accessor":"value","attribute":true},"placeholder":{"selector":"input[placeholder],textarea[placeholder]","accessor":"placeholder","attribute":true},"title":{"selector":"[title]","accessor":"title","attribute":true},"a_href":{"selector":"a[href]","accessor":"href","attribute":true},"button":{"accessor":"outertext","attribute":false},"option":{"accessor":"innertext","attribute":false},"aria_label":{"selector":"[aria-label]","accessor":"aria-label","attribute":true},"video_src":{"selector":"video[src]","accessor":"src","attribute":true},"video_poster":{"selector":"video[poster]","accessor":"poster","attribute":true},"video_source_src":{"selector":"video source[src]","accessor":"src","attribute":true},"audio_src":{"selector":"audio[src]","accessor":"src","attribute":true},"audio_source_src":{"selector":"audio source[src]","accessor":"src","attribute":true},"picture_image_src":{"selector":"picture image[src]","accessor":"src","attribute":true},"picture_source_srcset":{"selector":"picture source[srcset]","accessor":"srcset","attribute":true},"image_alt":{"selector":"img[alt]","accessor":"alt","attribute":true},"meta_desc":{"selector":"meta[name=\"description\"],meta[property=\"og:title\"],meta[property=\"og:description\"],meta[property=\"og:site_name\"],meta[property=\"og:image:alt\"],meta[name=\"twitter:title\"],meta[name=\"twitter:description\"],meta[name=\"twitter:image:alt\"],meta[name=\"DC.Title\"],meta[name=\"DC.Description\"],meta[property=\"article:section\"],meta[property=\"article:tag\"]","accessor":"content","attribute":true},"page_title":{"selector":"title","accessor":"innertext","attribute":false},"meta_desc_img":{"selector":"meta[property=\"og:image\"],meta[property=\"og:image:secure_url\"],meta[name=\"twitter:image\"]","accessor":"content","attribute":true}},"trp_attributes_accessors":["outertext","innertext","src","value","placeholder","title","href","aria-label","poster","srcset","alt","content"],"gettranslationsnonceregular":"64bce49555","showdynamiccontentbeforetranslation":"1","skip_strings_from_dynamic_translation":[],"skip_strings_from_dynamic_translation_for_substrings":{"href":["amazon-adsystem","googleads","g.doubleclick"]},"duplicate_detections_allowed":"100","trp_translate_numerals_opt":"no","trp_no_auto_translation_selectors":["[data-no-auto-translation]","code",".block-downs-password","pre",".trp-language-switcher-container",".trp-ls-shortcode-current-language",".trp-ls-shortcode-language",".social-share",".share-links",".a2a_kit",".share-button"]};
//# sourceURL=trp-dynamic-translator-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/translatepress-multilingual/assets/js/trp-translate-dom-changes.js?ver=3.2" id="trp-dynamic-translator-js"></script> <script type="text/javascript" id="pure-highlightjs-pack-js-extra">
/* <![CDATA[ */
var hljsThemeData = {"light_url":"https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/highlight/styles/default.css","dark_url":"https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/highlight/styles/atom-one-dark-reasonable.css"};
//# sourceURL=pure-highlightjs-pack-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/highlight/highlight.pack.js?ver=11.11.1" id="pure-highlightjs-pack-js"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/assets/highlightjs-line-numbers.js?ver=2.1.5" id="pure-highlightjs-line-numbers-js"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/assets/pure-highlight.js?ver=2.1.5" id="pure-highlightjs-js"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/Pure-Highlightjs/assets/simplebar.js?ver=6.3.2" id="simplebar-js-js"></script> <script type="text/javascript" id="rocket-browser-checker-js-after">
/* <![CDATA[ */
"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}();
//# sourceURL=rocket-browser-checker-js-after
/* ]]> */
</script> <script type="text/javascript" id="rocket-preload-links-js-extra">
/* <![CDATA[ */
var RocketPreloadLinksConfig = {"excludeUris":"/ms(/(?:.+/)?feed(?:/(?:.+/?)?)?$|/(?:.+/)?embed/|/(index.php/)?(.*)wp-json(/.*|$))|/refer/|/go/|/recommend/|/recommends/|/zh\\-hant(?:/|$)|/en(?:/|$)|/ru(?:/|$)|/ja(?:/|$)|/ko(?:/|$)|/es(?:/|$)|/pt(?:/|$)|/de(?:/|$)|/fr(?:/|$)|/ar(?:/|$)|/zh\\-tw(?:/|$)|/zh\\-hk(?:/|$)|/yue(?:/|$)|/pl(?:/|$)|/ms(?:/|$)|/nl(?:/|$)|/tr(?:/|$)|/th(?:/|$)|/it(?:/|$)|/cs(?:/|$)|/uk(?:/|$)|/id(?:/|$)|/vi(?:/|$)","usesTrailingSlash":"1","imageExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|pdf|doc|docx|xls|xlsx|php","fileExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|pdf|doc|docx|xls|xlsx|php|html|htm","siteUrl":"https://www.likacloud.com/ms","onHoverDelay":"100","rateThrottle":"3"};
//# sourceURL=rocket-preload-links-js-extra
/* ]]> */
</script> <script type="text/javascript" id="rocket-preload-links-js-after">
/* <![CDATA[ */
(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();
}());
//# sourceURL=rocket-preload-links-js-after
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/alpinejs.js?ver=3.14.9" id="alpinejs-js" defer="defer" data-wp-strategy="defer"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/theme.js?ver=1768718693" id="theme-js-js" defer="defer" data-wp-strategy="defer"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/qrcode.min.js?ver=1768450740" id="qrcode-js-js" defer="defer" data-wp-strategy="defer"></script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/lazyload.js?ver=19.1.3" id="vanilla-lazyload-js" defer="defer" data-wp-strategy="defer"></script> <script type="text/javascript" id="reactions-scripts-js-extra">
/* <![CDATA[ */
var mr_vars = {"rest_url":"https://www.likacloud.com/ms/wp-json/","nonce":"0a5cdcb600"};
//# sourceURL=reactions-scripts-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/reactions.js?ver=1780661486" id="reactions-scripts-js"></script> <script type="text/javascript" id="ai-search-js-extra">
/* <![CDATA[ */
var LIKACLOUD_AI = {"lang":"ms_MY","restBase":"https://www.likacloud.com/ms/wp-json/likacloud/v1"};
//# sourceURL=ai-search-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/ai-search.js?ver=1768450740" id="ai-search-js" defer="defer" data-wp-strategy="defer"></script> <script type="text/javascript" id="likacloud-ai-js-extra">
/* <![CDATA[ */
var LK_AI = {"restBase":"https://www.likacloud.com/ms/wp-json/likacloud/v1"};
//# sourceURL=likacloud-ai-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/ai-search-page.js?ver=1768450740" id="likacloud-ai-js"></script> <script type="text/javascript" id="unified-tracking-views-js-extra">
/* <![CDATA[ */
var utv_params = {"rest_url":"https://www.likacloud.com/ms/wp-json/unified-tracking/v1/views/","current_id":"12362762","current_type":"post"};
//# sourceURL=unified-tracking-views-js-extra
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/views.js?ver=1768450740" id="unified-tracking-views-js"></script> <script type="text/javascript" id="clarity-consent-loader-js-before">
/* <![CDATA[ */
window.CMPLZ_CLARITY = window.CMPLZ_CLARITY || {}; window.CMPLZ_CLARITY.id = "u5a0z2byas";
//# sourceURL=clarity-consent-loader-js-before
/* ]]> */
</script> <script type="text/javascript" src="https://www.likacloud.com/wp-content/themes/Cloud/assets/js/clarity.js" id="clarity-consent-loader-js"></script> <script type="text/javascript" id="cmplz-cookiebanner-js-extra">
/* <![CDATA[ */
var complianz = {"prefix":"cmplz_","user_banner_id":"1","set_cookies":[],"block_ajax_content":"0","banner_version":"111","version":"7.5.6.1","store_consent":"1","do_not_track_enabled":"","consenttype":"optin","region":"eu","geoip":"1","dismiss_timeout":"","disable_cookiebanner":"","soft_cookiewall":"","dismiss_on_scroll":"","cookie_expiry":"365","url":"https://www.likacloud.com/ms/wp-json/complianz/v1/","locale":"lang=ms&locale=ms_MY","set_cookies_on_root":"1","cookie_domain":"likacloud.com","current_policy_id":"57","cookie_path":"/","categories":{"statistics":"statistics","marketing":"marketing"},"tcf_active":"","placeholdertext":"Click to accept {category} cookies and enable this content","css_file":"https://static.likacloud.com/data/attachment/complianz/css/banner-{banner_id}-{type}.css?v=111","page_links":{"eu":{"cookie-statement":{"title":"Cookie \u653f\u7b56","url":"https://www.likacloud.com/ms/cookie-policy/"},"privacy-statement":{"title":"\u9690\u79c1\u58f0\u660e","url":"https://www.likacloud.com/ms/privacy-policy/"},"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"us":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"uk":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"ca":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"au":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"za":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}},"br":{"impressum":{"title":"\u7f51\u7ad9\u58f0\u660e","url":"https://www.likacloud.com/ms/impressum/"},"disclaimer":{"title":"\u514d\u8d23\u58f0\u660e","url":"https://www.likacloud.com/ms/disclaimer/"}}},"tm_categories":"","forceEnableStats":"","preview":"","clean_cookies":"","aria_label":"Click to accept {category} cookies and enable this content"};
//# sourceURL=cmplz-cookiebanner-js-extra
/* ]]> */
</script> <script defer type="text/javascript" src="https://www.likacloud.com/wp-content/plugins/complianz-gdpr-premium/cookiebanner/js/complianz.min.js?ver=1761889066" id="cmplz-cookiebanner-js"></script> <script>var rocket_beacon_data = {"ajax_url":"https:\/\/www.likacloud.com\/wp-admin\/admin-ajax.php","nonce":"f613f4a15b","url":"https:\/\/www.likacloud.com\/ms\/knowledge\/wordpress\/wordpress-theme-development-complete-guide-core-techniques","is_mobile":false,"width_threshold":1600,"height_threshold":700,"delay":500,"debug":null,"status":{"atf":true,"lrc":true,"preconnect_external_domain":true},"elements":"img, video, picture, p, main, div, li, svg, section, header, span","lrc_threshold":1800,"preconnect_external_domain_elements":["link","script","iframe"],"preconnect_external_domain_exclusions":["static.cloudflareinsights.com","rel=\"profile\"","rel=\"preconnect\"","rel=\"dns-prefetch\"","rel=\"icon\""]}</script><script data-name="wpr-wpr-beacon" src='https://www.likacloud.com/wp-content/plugins/wp-rocket/assets/js/wpr-beacon.min.js' async></script></body></html>
<!--压缩前: 235378 bytes; 压缩后: 198946 bytes; 节约: 15.48% -->
<!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me --> 
