Plus UI WP siap digunakan. Pelajari dokumentasi, komponen, kustomisasi, dan optimasinya melalui artikel demo Bahasa Indonesia. Dokumentasi

Memulai dan Instalasi Plus UI WP

admin

Artikel ini adalah panduan awal untuk memasang Plus UI versi WordPress. Theme dirancang agar pengguna WordPress dapat memperoleh tampilan yang mendekati Plus UI Blogger tanpa harus mengelola XML Blogger.

Sebelum instalasi

  • WordPress 6.2 atau lebih baru direkomendasikan.
  • PHP 7.4 atau lebih baru.
  • HTTPS aktif.
  • Backup situs bila theme dipasang pada website yang sudah memiliki konten.
Staging direkomendasikanUntuk situs yang sudah online, uji theme pada staging/subdomain terlebih dahulu agar perubahan menu, widget, dan thumbnail tidak mengganggu pengunjung.

Instal melalui dashboard

  1. Buka Appearance → Themes.
  2. Klik Add New Theme.
  3. Klik Upload Theme.
  4. Pilih file plus-ui-wp-vX.X.X.zip.
  5. Klik Install Now.
  6. Setelah selesai, klik Activate.

Instal melalui file manager

Jika upload dashboard dibatasi hosting, ekstrak folder theme ke:

/wp-content/themes/plus-ui-wp/

Pastikan file style.css berada langsung di dalam folder theme, bukan di folder bertingkat ganda.

Import Demo Content

Theme menyediakan importer agar struktur awal lebih cepat menyerupai demo.

  1. Buka Appearance → Plus UI Demo Import.
  2. Klik Import Demo Content.
  3. Tunggu sampai WordPress kembali ke halaman importer.
  4. Buka homepage dan lakukan hard refresh.

Importer membuat 10 artikel dokumentasi, kategori, halaman dasar, menu, featured image WebP, dan pengaturan homepage.

Menjalankan ulang importerPada versi ini, menjalankan importer lagi akan memperbarui artikel demo bawaan ke konten Indonesia terbaru. Konten non-demo milik Anda tidak dihapus.

Atur permalink

Buka Settings → Permalinks. Untuk blog/dokumentasi, struktur Post name biasanya paling sederhana.

https://example.com/judul-artikel/

Site Identity

Buka Customizer dan atur logo, judul situs, serta favicon. Favicon ideal menggunakan gambar persegi.

Menu

Importer membuat menu awal. Anda tetap dapat menggantinya dari Appearance → Menus. Lokasi yang disediakan theme mencakup Primary, Mobile, dan Footer.

Homepage

Beranda Plus UI WP memuat beberapa bagian utama:

  • Header + utility icons.
  • Bar menu sekunder.
  • Notification bar.
  • Carousel.
  • Pinned Post.
  • Latest Posts.
  • Popular Posts dan Labels.
  • Footer.

Pilih Pinned Post

Buka Appearance → Customize lalu pilih artikel yang ingin dijadikan pinned post. Demo awal menggunakan artikel Komponen UI dan Tipografi.

Mode tampilan

Pengunjung dapat memilih Light, Dark, System, atau Theme melalui ikon Appearance. Preferensi disimpan di browser sehingga tetap digunakan pada kunjungan berikutnya.

Setelah instalasi

  1. Ganti logo dan site title.
  2. Hapus atau edit artikel demo yang tidak dibutuhkan.
  3. Atur menu.
  4. Atur kategori.
  5. Pasang plugin SEO jika diperlukan.
  6. Pasang sistem cache sesuai hosting.
  7. Uji responsive desktop/tablet/mobile.
  8. Jalankan PageSpeed setelah semua plugin terpasang.

Masalah umum

Tampilan masih memakai cache lama

Hapus cache plugin/CDN lalu lakukan hard refresh browser.

Menu tidak muncul

Pastikan menu sudah ditetapkan ke lokasi Primary atau Mobile.

Featured image tidak tampil

Pastikan artikel memiliki Featured Image dan file upload dapat dibaca oleh WordPress.

Importer pernah dijalankan

Jalankan lagi untuk memperbarui demo bawaan. Theme tidak menghapus artikel non-demo.

Instalasi selesaiSetelah struktur dasar aktif, lanjutkan ke artikel Pengaturan Dasar dan Tampilan & Kustomisasi.

Struktur file theme

Setelah diekstrak, folder theme berisi template WordPress, file CSS/JavaScript, library ikon SVG, dan modul importer.

plus-ui-wp/
├── assets/
│   ├── css/plus-ui.css
│   ├── js/plus-ui.js
│   ├── images/
│   └── svg-icons.json
├── inc/
│   ├── customizer.php
│   ├── demo-import.php
│   ├── demo-articles-id.php
│   └── icons.php
├── header.php
├── front-page.php
├── single.php
├── functions.php
└── style.css

Jangan mengubah parent theme langsung

Jika Anda akan membuat modifikasi PHP/CSS besar dan masih ingin menerima update, gunakan child theme. Perubahan kecil yang memang bagian proyek khusus dapat diletakkan di Additional CSS, tetapi logic PHP sebaiknya berada di child theme atau plugin kecil.

Contoh style.css child theme

/*
Theme Name: Plus UI WP Child
Template: plus-ui-wp
Version: 1.0.0
*/

Hak akses file

Theme tidak memerlukan permission tidak biasa. Secara umum folder memakai 755 dan file 644 sesuai konfigurasi hosting. Jangan mengubah semuanya menjadi 777 untuk mengatasi error upload.

PHP memory dan upload limit

Jika ZIP gagal diupload, cek upload_max_filesize dan post_max_size. Karena theme relatif ringan, limit standar hosting modern biasanya cukup.

Sesudah import demo

Importer tidak dimaksudkan sebagai database migration. Ia hanya membuat data contoh. Setelah Anda mulai mengedit artikel demo untuk konten produksi, jangan menjalankan importer ulang tanpa backup karena artikel yang ditandai sebagai demo akan diperbarui.

Artikel demo akan diperbaruiVersi 1.1.2 sengaja memperbarui 10 artikel demo ke dokumentasi Bahasa Indonesia lengkap. Setelah Anda mengubahnya menjadi artikel produksi, hapus meta demo atau buat artikel baru agar tidak tertimpa pada import berikutnya.

Update theme manual

  1. Backup versi lama.
  2. Aktifkan theme sementara hanya jika hosting tidak mendukung replace upload.
  3. Upload ZIP baru.
  4. Pastikan folder tetap bernama plus-ui-wp.
  5. Aktifkan kembali jika diperlukan.
  6. Clear cache.

Debug mode

Untuk staging, debug WordPress dapat membantu menemukan warning PHP. Jangan menampilkan error langsung ke pengunjung production.

define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);
define('WP_DEBUG_DISPLAY', false);

Cek error log

File debug biasanya tersimpan di wp-content/debug.log ketika konfigurasi di atas aktif. Matikan kembali debug bila proses perbaikan selesai.

Kompatibilitas editor

Artikel biasa dapat ditulis dari Block Editor. Untuk komponen Plus UI yang memakai class khusus, gunakan Custom HTML block atau Code Editor agar markup tidak diubah oleh editor visual.

Checklist sebelum live

  • Logo dan favicon bukan demo.
  • Semua menu menuju URL nyata.
  • Halaman Contact memiliki metode kontak.
  • Privacy Policy diperbarui.
  • Admin default dan password aman.
  • Backup otomatis aktif.
  • Cache dan SSL berjalan.
  • Tidak ada artikel demo yang tidak ingin dipublikasikan.
Facebook X Email
admin

Author of this article.

Leave a Reply

Your email address will not be published. Required fields are marked *