masbudikusuma/edukarsa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(readme): tulis ulang dokumentasi lengkap fitur tema edukarsa

Browse Source
This commit is contained in:
Mas Budi Kusuma
2026-09-16 08:55:31 +07:00
parent ba56ff015d
commit 751863680c
1 changed files with 87 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+87 -76
View File
@@ -1,106 +1,117 @@
# EduKarsa — Tema WordPress Native Sekolah & Perguruan Tinggi # EduKarsa — Tema WordPress Native Sekolah & Perguruan Tinggi
EduKarsa adalah tema WordPress profesional yang dirancang khusus untuk portal resmi institusi pendidikan, sekolah, madrasah, pesantren, maupun perguruan tinggi. Dibangun dengan mematuhi prinsip 100% Native & Zero Plugin, tema ini menjamin performa akses ultra cepat, efisiensi beban server, keamanan tingkat tinggi, serta bebas dari lisensi plugin pihak ketiga yang berbayar. EduKarsa adalah tema WordPress institusional yang dibangun dengan arsitektur **100% Native & Zero Plugin**. Didesain khusus untuk portal sekolah, madrasah, pesantren, dan perguruan tinggi dengan mengutamakan performa, keamanan ketat, serta aksesibilitas ramah disabilitas.
- Demo Langsung: https://edukarsa.masbudi.my.id - **Demo Situs**: https://edukarsa.masbudi.my.id
- Repositori Resmi: https://git.masbudi.my.id - **Portal Aplikasi**: https://apps.masbudi.my.id/edukarsa
- Portal Aplikasi: https://apps.masbudi.my.id/ - **Dukungan & Donasi**: https://donate.masbudi.my.id/edukarsa
- Dukungan & Donasi: https://donate.masbudi.my.id - **Pengembang**: Mas Budi Kusuma (masbudikusuma@gmail.com — https://masbudi.my.id)
- Pengembang: Mas Budi Kusuma (masbudikusuma@gmail.com)
--- ---
## Keunggulan Utama ## Pilar Arsitektur
- Zero Plugin Dependency: Berjalan penuh hanya dengan inti WordPress native. Seluruh fitur (slider banner, program, milestone, keunggulan, FAQ, dan sidebar) dikelola tanpa ACF, Elementor, atau plugin pembangun halaman lainnya. 1. **Zero Plugin Dependency**: Berjalan optimal tanpa ketergantungan plugin pihak ketiga (tanpa ACF, Elementor, atau plugin galeri).
- Keamanan Berlapis (Hardened Security): 2. **Modular Architecture (`inc/`)**: Berkas `functions.php` berfungsi murni sebagai pemanggil (*router*). Seluruh fungsionalitas diisolasi ke dalam sub-berkas direktori `inc/`.
- Proteksi eksekusi langsung berkas PHP (defined('ABSPATH') || exit;). 3. **Hardened Security Native**:
- Injeksi header keamanan HTTP native (X-Content-Type-Options, X-Frame-Options, Referrer-Policy). - Pengecekan eksekusi langsung via `defined('ABSPATH') || exit;`.
- Penyamaran sidik jari versi WordPress dari tag meta dan pembersihan query string aset. - Injeksi HTTP *security headers* native (`X-Frame-Options`, `X-Content-Type-Options`, `Referrer-Policy`).
- Proteksi pemindaian nama pengguna (anti-author enumeration ?author=N). - Penonaktifan *author enumeration* (`?author=N`) dan proteksi rute REST API `/wp/v2/users` untuk pengguna anonim.
- Pembatasan endpoint REST API /wp/v2/users untuk pengunjung tanpa login. - Sanitasi data ketat di seluruh antarmuka Settings API.
- Sanitasi ketat di seluruh basis Settings API (sanitize_hex_color, esc_url_raw, wp_kses_post, dll.). 4. **WCAG 2.1 Accessibility**: Widget aksesibilitas bawaan dengan Web Speech API (suara baca audio), pengubah ukuran teks, kontras tinggi, mode monokrom, dan sorotan tautan.
- Aksesibilitas Disabilitas (WCAG 2.1): Dilengkapi toolbar aksesibilitas melayang dengan pembaca suara audio (Web Speech Synthesizer bawaan browser), penyesuaian ukuran huruf, kontras tinggi, mode monokrom, dan penegas garis tautan. 5. **Multilingual Terpadu**: Penerjemah instan sisi depan (ID, EN, AR, ZH, JA) serta panel admin dwibahasa (ID/EN).
- Fitur Multilingual Dinamis: Dukungan translasi instan otomatis (ID, EN, AR, ZH, JA) pada frontend tanpa merusak database, serta panel admin bilingual yang otomatis mendeteksi bahasa sistem. 6. **SEO & Structured Data**: Skema data terstruktur JSON-LD `EducationalOrganization` dan `NewsArticle` native untuk visibilitas mesin pencari.
- SEO & Rich Snippets Otomatis: Injeksi OpenGraph, Twitter Cards, Canonical URL, dan skema data terstruktur JSON-LD (NewsArticle dan EducationalOrganization) tanpa plugin SEO.
- Dashboard Akordeon Ergonomis: Pengaturan tema modular 7 seksi dengan animasi luncur (smooth slide) dan panel aksi simpan yang selalu melayang (sticky).
--- ---
## Fitur & Modul Tema ## Modul & Fitur Utama
### 1. Tata Letak Beranda (Front Page) ### 1. Tata Letak Beranda (Native Section Builder)
- Slider Banner: Dukungan tautan khusus per gambar menggunakan Custom Meta Box native. - Pengaturan urutan seksi secara visual (*drag-and-drop*) berbasis jQuery UI Sortable bawaan WordPress.
- Kartu Statistik Melayang: Tiga kartu capaian/prestasi dengan ikon kustom yang menumpuk anggun di atas slider banner. - Loop rendering berbasis daftar putih (*whitelist array*) untuk mencegah celah LFI.
- Profil Pimpinan & Sambutan: Tata letak portrait rasio 3:4 dengan format tipografi yang rapi. - Slider layar penuh terkunci di posisi teratas dengan dukungan custom link per slide.
- Milestone & Rekam Jejak: Empat kartu capaian ringkas dengan perlindungan anti-rongga kosong otomatis. - Kartu statistik melayang dengan penyesuaian margin dinamis.
- Program Unggulan: Tampilan grid 3 kolom yang terhubung ke template detail kurikulum khusus (single-program.php). - Sambutan pimpinan institusi dengan rasio potret 3:4.
- Seksi Video & Parallax: Media player video ganda dengan latar belakang parallax dinamis yang warnanya menyatu dengan tema. - Rekam jejak capaian (Milestones) anti-celah kosong.
- 9 Butir Keunggulan: Grid fleksibel dengan penomoran otomatis dua digit. - Tiga program unggulan terhubung ke template detail `single-program.php`.
- Floating CTA Banner: Kartu ajakan pendaftaran mahasiswa/siswa baru (PPDB/PMB) yang memecah visual secara kontras. - Video profil ganda berlatar efek parallax.
- Warta & Berita Terkini: Menampilkan artikel pos terbaru dalam format kartu modern. - Sembilan poin keunggulan bernomor otomatis dua digit.
- Akordeon FAQ Interaktif: Seksi tanya-jawab buka-tutup yang posisinya berada di bawah berita dan tertutup secara default. - Banner pendaftaran (CTA PPDB/PMB) kontras tinggi.
- Warta berita terbaru dan akordeon tanya-jawab (FAQ) interaktif.
### 2. Sidebar & Halaman Dalam ### 2. Galeri Fasilitas & Lightbox (`page-galeri.php`)
- 100% Pengaturan Sidebar Native: Komponen pencarian cepat, mini CTA pendaftaran, warta terkini, daftar kategori, banner promosi poster, serta Box HTML kustom (untuk Google Maps atau teks bebas) diatur langsung dari menu EduKarsa tanpa menyentuh widget WordPress. - Custom Post Type `galeri` terintegrasi dengan taksonomi `kategori_galeri`.
- Paginasi Ganda: Navigasi multi-halaman dalam satu artikel (intra-post) dan kartu tautan navigasi artikel Sebelumnya / Selanjutnya (inter-post). - Tombol penyaring kategori beranimasi halus via JavaScript murni.
- Bilah Berbagi Cepat: Tombol bagikan artikel native ke WhatsApp, Facebook, X, serta tombol salin tautan. - Lightbox popup native dengan kontrol zoom, navigasi geser, deskripsi foto, dan dukungan tombol keyboard (Esc, Panah Kiri/Kanan).
- Breadcrumbs Terpadu: Navigasi penunjuk posisi halaman otomatis pada artikel pos dan laman statis.
### 3. Footer & Kontak ### 3. Pop-up Flyer Promosi (`inc/popup.php`)
- Arsitektur 4 Kolom Institusi: Menampung profil kampus, kontak resmi, navigasi tautan penting, dan jam layanan kantor multi-baris. - Modal dialog promosi PMB/pengumuman penting dengan pengatur waktu tunda (*delay*).
- Ikon Sosial Media SVG: Tombol interaktif tajam tanpa file font eksternal untuk Facebook, Instagram, YouTube, TikTok, dan X. - Mekanisme penyimpanan sesi (`sessionStorage`) agar tidak berulang kali memblokir layar pengguna.
- Floating WhatsApp Hotline: Tombol konsultasi melayang dengan label dan draf pesan awal yang dapat disesuaikan. - Opsi pembatasan hanya di beranda serta parameter pratinjau `?preview_popup=1`.
- Tombol Kembali ke Atas: Tombol melayang Back-to-Top otomatis dengan animasi gulir halus.
### 4. Navigasi, Sidebar, & Footer
- Dropdown menu bertingkat bebas tanda butir (*bullet*).
- Sidebar dinamis: form pencarian, mini CTA, daftar berita terkini, arsip kategori, poster gambar, dan kotak HTML kustom.
- Navigasi paginasi ganda (antar-halaman dan intra-artikel) serta tombol berbagi media sosial native.
- Footer 4 kolom: profil institusi, jam layanan kantor multi-baris, kontak resmi, lencana akreditasi, tombol WhatsApp melayang dinamis, dan atribusi pengembang.
--- ---
## Struktur Berkas Modular ## Rekomendasi Dimensi Aset
edukarsa/ | Aset Media | Rekomendasi Dimensi | Rasio Aspek | Format Ideal |
├── 404.php # Halaman penanganan galat 404 | :--- | :--- | :--- | :--- |
├── footer.php # Footer institusi 4 kolom, WA float, & a11y toolbar | **Logo Header** | Lebar proporsional, tinggi 110 px | Fleksibel | PNG Transparan / WebP |
├── front-page.php # Tata letak modular beranda | **Slider Banner** | 1920 × 1080 px atau 1920 × 800 px | 16:9 / Lebar | JPG / WebP (< 300 KB) |
├── functions.php # Loader utama tema (Router) | **Foto Pimpinan** | 600 × 800 px atau 800 × 1067 px | 3:4 (Potret) | JPG / WebP |
├── header.php # Navigasi utama, hamburger mobile, & language switcher | **Latar Parallax** | 1920 × 1080 px | 16:9 Lanskap | JPG / WebP |
├── inc/ | **Flyer Pop-up** | Minimal 800 × 800 px | 1:1 / 4:5 | JPG / WebP (< 250 KB) |
│ ├── admin-menu.php # Settings API, dashboard akordeon, & shortcut toolbar | **Poster Sidebar** | Lebar 600 px (tinggi bebas) | Vertikal | JPG / WebP |
│ ├── cpt-slider.php # Registrasi CPT (Slider, Program, Milestone, Keunggulan, FAQ) | **Galeri Kampus** | 1200 × 900 px | 4:3 Lanskap | JPG / WebP |
│ ├── i18n.php # Logika bilingual dan kamus antarmuka admin
│ ├── security.php # Hardening header, proteksi REST API, & anti-enumeration
│ ├── seo.php # Meta tag media sosial & JSON-LD Structured Data
│ └── setup.php # Theme support, pendaftaran menu, & dynamic inline CSS
├── index.php # Template fallback dan arsip daftar warta
├── page.php # Template laman statis tunggal dengan sidebar
├── sidebar.php # Template sidebar native berbasis dasbor
├── single-program.php # Template detail khusus program studi & kurikulum
├── single.php # Template baca artikel penuh dengan breadcrumbs & paging
├── style.css # Berkas CSS utama (Plus Jakarta Sans & CSS custom variables)
└── README.md # Dokumentasi tema
--- ---
## Panduan Instalasi ## Struktur Direktori
1. Salin folder tema edukarsa ke direktori: wp-content/themes/edukarsa edukarsa/
2. Masuk ke panel admin WordPress, buka menu Tampilan > Tema, lalu aktifkan EduKarsa. ├── 404.php
3. Akses menu EduKarsa > Pengaturan Utama pada bilah menu admin untuk mengatur logo, palet warna, tipografi font, dan seksi halaman depan. ├── footer.php
4. Buka menu Tampilan > Menu untuk menetapkan menu pada lokasi Menu Utama dan Menu Footer. ├── front-page.php
├── functions.php
├── header.php
├── inc/
│ ├── admin-menu.php
│ ├── cpt-slider.php
│ ├── i18n.php
│ ├── popup.php
│ ├── security.php
│ ├── seo.php
│ └── setup.php
├── index.php
├── page-galeri.php
├── page.php
├── README.md
├── sidebar.php
├── single-program.php
├── single.php
└── style.css
--- ---
## Donasi & Kontribusi ## Petunjuk Penggunaan
Pengembangan tema ini dilakukan secara independen untuk mendukung digitalisasi sekolah dan institusi pendidikan di Indonesia agar memiliki portal web yang cepat, aman, dan elegan tanpa beban lisensi plugin berbayar. 1. **Pengaturan Identitas**: Masuk ke **EduKarsa > ⚙️ Pengaturan Utama** untuk konfigurasi logo, warna tema, font, profil, kontak, dan footer.
2. **Menyusun Halaman Utama**: Buka **EduKarsa > 🏗️ Tata Letak** untuk mengatur urutan seksi secara drag-and-drop, lalu simpan perubahan.
Jika tema ini bermanfaat untuk sekolah, kampus, atau proyek Anda, Anda dapat menyalurkan dukungan dan donasi melalui: 3. **Membuat Halaman Galeri**:
https://donate.masbudi.my.id (Pilih EduKarsa) - Tambahkan dokumentasi pada **EduKarsa > 📸 Galeri Fasilitas** dan tandai kategorinya.
- Buat laman baru (**Laman > Tambah Baru**), pilih template **Galeri & Fasilitas** di panel atribut laman, lalu terbitkan.
Dukungan Anda membantu keberlanjutan pembaruan keamanan, penambahan fitur, dan perawatan repositori ini. 4. **Mengaktifkan Pop-up Flyer**:
- Buka panel **🪟 8. Pop-up Flyer & Pengumuman** di Pengaturan Utama.
- Aktifkan sakelar, unggah berkas flyer, isi tautan tujuan pendaftaran, lalu simpan.
--- ---
## Lisensi & Hak Cipta ## Lisensi & Hak Cipta
Tema ini dirancang dan dikembangkan oleh Mas Budi Kusuma (https://masbudi.my.id). Dirancang dan dikembangkan oleh **Mas Budi Kusuma** ([masbudi.my.id](https://masbudi.my.id)).
Didistribusikan di bawah lisensi GNU General Public License v2 atau yang lebih baru. Didistribusikan di bawah naungan lisensi **GNU General Public License v2** atau yang lebih baru.