654 lines
60 KiB
PHP
654 lines
60 KiB
PHP
<?php
|
||
/**
|
||
* Modul Pengaturan Menu Admin, Toolbar, dan Settings API EduKarsa
|
||
*/
|
||
|
||
function edukarsa_admin_menu() {
|
||
add_menu_page(
|
||
'EduKarsa',
|
||
'EduKarsa',
|
||
'manage_options',
|
||
'edukarsa_settings',
|
||
'edukarsa_settings_page_html',
|
||
'dashicons-welcome-learn-more',
|
||
2
|
||
);
|
||
|
||
add_submenu_page( 'edukarsa_settings', 'Pengaturan Utama', '⚙️ Pengaturan Utama', 'manage_options', 'edukarsa_settings', 'edukarsa_settings_page_html' );
|
||
add_submenu_page( 'edukarsa_settings', 'Semua Slider', '🌟 Slider Banner', 'manage_options', 'edit.php?post_type=slider' );
|
||
add_submenu_page( 'edukarsa_settings', 'Semua Program', '📚 Program Kami', 'manage_options', 'edit.php?post_type=program' );
|
||
add_submenu_page( 'edukarsa_settings', 'Semua Keunggulan', '⭐ Keunggulan', 'manage_options', 'edit.php?post_type=keunggulan' );
|
||
add_submenu_page( 'edukarsa_settings', 'Semua Milestone', '🏆 Milestone', 'manage_options', 'edit.php?post_type=milestone' );
|
||
add_submenu_page( 'edukarsa_settings', 'Semua FAQ', '❓ Tanya Jawab (FAQ)', 'manage_options', 'edit.php?post_type=faq' );
|
||
}
|
||
add_action( 'admin_menu', 'edukarsa_admin_menu' );
|
||
|
||
function edukarsa_admin_bar_shortcut( $wp_admin_bar ) {
|
||
if ( ! current_user_can( 'manage_options' ) ) return;
|
||
|
||
$wp_admin_bar->add_node( array(
|
||
'id' => 'edukarsa-topbar-menu',
|
||
'title' => '<span class="ab-icon dashicons dashicons-welcome-learn-more" style="top:2px;"></span><span class="ab-label">EduKarsa</span>',
|
||
'href' => admin_url( 'admin.php?page=edukarsa_settings' ),
|
||
) );
|
||
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-settings', 'parent' => 'edukarsa-topbar-menu', 'title' => '⚙️ Pengaturan Utama', 'href' => admin_url( 'admin.php?page=edukarsa_settings' ) ) );
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-slider', 'parent' => 'edukarsa-topbar-menu', 'title' => '🌟 Slider Banner', 'href' => admin_url( 'edit.php?post_type=slider' ) ) );
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-program', 'parent' => 'edukarsa-topbar-menu', 'title' => '📚 Program Kami', 'href' => admin_url( 'edit.php?post_type=program' ) ) );
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-keunggulan', 'parent' => 'edukarsa-topbar-menu', 'title' => '⭐ Keunggulan', 'href' => admin_url( 'edit.php?post_type=keunggulan' ) ) );
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-milestone', 'parent' => 'edukarsa-topbar-menu', 'title' => '🏆 Milestone', 'href' => admin_url( 'edit.php?post_type=milestone' ) ) );
|
||
$wp_admin_bar->add_node( array( 'id' => 'edukarsa-sub-faq', 'parent' => 'edukarsa-topbar-menu', 'title' => '❓ Tanya Jawab (FAQ)', 'href' => admin_url( 'edit.php?post_type=faq' ) ) );
|
||
}
|
||
add_action( 'admin_bar_menu', 'edukarsa_admin_bar_shortcut', 80 );
|
||
|
||
function edukarsa_register_settings() {
|
||
$options = array(
|
||
// Desain & Fitur Global
|
||
'edukarsa_font_choice', 'edukarsa_primary_color', 'edukarsa_secondary_color', 'edukarsa_heading_color',
|
||
'edukarsa_tampil_bilingual', 'edukarsa_lang_en', 'edukarsa_lang_ar', 'edukarsa_lang_zh', 'edukarsa_lang_ja',
|
||
'edukarsa_tampil_accessibility',
|
||
|
||
// Halaman Depan Seksi
|
||
'edukarsa_tampil_slider', 'edukarsa_tampil_stats', 'edukarsa_tampil_about', 'edukarsa_tampil_milestone', 'edukarsa_tampil_program', 'edukarsa_tampil_video', 'edukarsa_tampil_keunggulan', 'edukarsa_tampil_cta', 'edukarsa_tampil_faq', 'edukarsa_tampil_news',
|
||
'edukarsa_header_logo',
|
||
|
||
// Label Kustom Frontend
|
||
'edukarsa_milestone_subtitle', 'edukarsa_milestone_title',
|
||
'edukarsa_program_subtitle', 'edukarsa_program_title',
|
||
'edukarsa_keunggulan_subtitle', 'edukarsa_keunggulan_title',
|
||
'edukarsa_faq_subtitle', 'edukarsa_faq_title',
|
||
'edukarsa_news_title',
|
||
|
||
// Data Beranda
|
||
'edukarsa_stat1_angka', 'edukarsa_stat1_label', 'edukarsa_stat1_desc', 'edukarsa_stat1_icon',
|
||
'edukarsa_stat2_angka', 'edukarsa_stat2_label', 'edukarsa_stat2_desc', 'edukarsa_stat2_icon',
|
||
'edukarsa_stat3_angka', 'edukarsa_stat3_label', 'edukarsa_stat3_desc', 'edukarsa_stat3_icon',
|
||
'edukarsa_foto_kepsek', 'edukarsa_nama_kepsek', 'edukarsa_subtitle_about', 'edukarsa_teks_sambutan', 'edukarsa_link_about',
|
||
'edukarsa_video1_thumb', 'edukarsa_video1_url', 'edukarsa_video2_thumb', 'edukarsa_video2_url',
|
||
'edukarsa_mid_bg_image', 'edukarsa_mid_bg_color',
|
||
'edukarsa_cta_bg', 'edukarsa_cta_title', 'edukarsa_cta_btn_teks', 'edukarsa_cta_btn_url',
|
||
|
||
// KUSTOMISASI SIDEBAR (Bebas Menu Widget)
|
||
'edukarsa_sidebar_tampil_search',
|
||
'edukarsa_sidebar_tampil_cta',
|
||
'edukarsa_sidebar_cta_badge',
|
||
'edukarsa_sidebar_cta_title',
|
||
'edukarsa_sidebar_cta_desc',
|
||
'edukarsa_sidebar_cta_btn_text',
|
||
'edukarsa_sidebar_cta_btn_url',
|
||
'edukarsa_sidebar_tampil_recent',
|
||
'edukarsa_sidebar_recent_title',
|
||
'edukarsa_sidebar_recent_count',
|
||
'edukarsa_sidebar_tampil_cats',
|
||
'edukarsa_sidebar_cats_title',
|
||
'edukarsa_sidebar_banner_img',
|
||
'edukarsa_sidebar_banner_url',
|
||
|
||
// Footer & WA
|
||
'edukarsa_footer_logo', 'edukarsa_footer_desc', 'edukarsa_footer_alamat', 'edukarsa_footer_telp', 'edukarsa_footer_email', 'edukarsa_footer_jam',
|
||
'edukarsa_wa_btn_text', 'edukarsa_wa_default_msg',
|
||
'edukarsa_tampil_fb', 'edukarsa_footer_fb', 'edukarsa_tampil_ig', 'edukarsa_footer_ig', 'edukarsa_tampil_yt', 'edukarsa_footer_yt', 'edukarsa_tampil_tiktok', 'edukarsa_footer_tiktok', 'edukarsa_tampil_x', 'edukarsa_footer_x',
|
||
'edukarsa_footer_copyright', 'edukarsa_custom_css'
|
||
);
|
||
foreach ( $options as $opt ) { register_setting( 'edukarsa_settings_group', $opt ); }
|
||
}
|
||
add_action( 'admin_init', 'edukarsa_register_settings' );
|
||
|
||
function edukarsa_settings_page_html() {
|
||
if ( ! current_user_can( 'manage_options' ) ) return;
|
||
$font_current = get_option( 'edukarsa_font_choice', 'plus_jakarta_sans' );
|
||
$primary_color = get_option( 'edukarsa_primary_color', '#0b4a8e' );
|
||
$secondary_color = get_option( 'edukarsa_secondary_color', '#1a73e8' );
|
||
$heading_color = get_option( 'edukarsa_heading_color', '#0f172a' );
|
||
?>
|
||
<style>
|
||
.edukarsa-admin-wrap { margin-top: 15px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
|
||
.edukarsa-admin-layout { display: grid; grid-template-columns: 1fr 320px; gap: 25px; align-items: start; }
|
||
.edukarsa-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); margin-bottom: 25px; }
|
||
.edukarsa-card-header { padding: 16px 24px; border-bottom: 1px solid #f1f5f9; background: #fafafa; display: flex; justify-content: space-between; align-items: center; border-radius: 10px 10px 0 0; }
|
||
.edukarsa-card-header h2 { margin: 0; font-size: 16px; font-weight: 700; color: #1e293b; display: flex; align-items: center; gap: 8px; }
|
||
.edukarsa-card-body { padding: 24px; }
|
||
|
||
.switch-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; margin-bottom: 12px; }
|
||
.switch-row-inline { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 15px; }
|
||
.switch-label-wrap { display: flex; flex-direction: column; gap: 5px; }
|
||
.switch-label { font-weight: 700; font-size: 13px; color: #334155; display: inline-flex; align-items: center; gap: 6px; }
|
||
|
||
.cpt-shortcut-link { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; color: #0b4a8e; text-decoration: none; background: #e0f2fe; padding: 2px 9px; border-radius: 12px; width: fit-content; transition: all 0.2s ease; border: 1px solid #bae6fd; }
|
||
.cpt-shortcut-link:hover { background: #0b4a8e; color: #ffffff !important; border-color: #0b4a8e; }
|
||
|
||
.tooltip-hint { position: relative; cursor: help; display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%; background: #94a3b8; color: #fff; font-size: 10px; font-weight: 800; }
|
||
.tooltip-hint:hover { background: #0b4a8e; }
|
||
.tooltip-hint .tooltip-text { visibility: hidden; opacity: 0; position: absolute; bottom: 140%; left: 50%; transform: translateX(-50%); background-color: #0f172a; color: #ffffff; text-align: left; padding: 8px 12px; border-radius: 6px; font-size: 11px; font-weight: 500; line-height: 1.45; white-space: normal; width: 220px; z-index: 1000; box-shadow: 0 10px 25px rgba(0,0,0,0.2); transition: opacity 0.2s ease, visibility 0.2s ease; pointer-events: none; }
|
||
.tooltip-hint .tooltip-text::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #0f172a transparent transparent transparent; }
|
||
.tooltip-hint:hover .tooltip-text { visibility: visible; opacity: 1; }
|
||
|
||
.edukarsa-switch { position: relative; display: inline-block; width: 42px; height: 22px; margin: 0; flex-shrink: 0; }
|
||
.edukarsa-switch input { opacity: 0; width: 0; height: 0; }
|
||
.slider-round { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #cbd5e1; transition: .25s; border-radius: 22px; }
|
||
.slider-round:before { position: absolute; content: ""; height: 16px; width: 16px; left: 3px; bottom: 3px; background-color: white; transition: .25s; border-radius: 50%; box-shadow: 0 1px 2px rgba(0,0,0,0.2); }
|
||
input:checked + .slider-round { background-color: #0b4a8e; }
|
||
input:checked + .slider-round:before { transform: translateX(20px); }
|
||
|
||
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px; }
|
||
.form-field-group { margin-bottom: 15px; }
|
||
.form-field-group label { display: block; font-weight: 600; font-size: 13px; color: #475569; margin-bottom: 6px; }
|
||
.form-field-group input[type="text"], .form-field-group textarea, .form-field-group select { width: 100%; border: 1px solid #cbd5e1; border-radius: 6px; padding: 8px 12px; font-size: 13px; box-sizing: border-box; }
|
||
.input-with-button { display: flex; gap: 8px; }
|
||
.input-with-button input { flex-grow: 1; }
|
||
|
||
.stats-config-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 15px; }
|
||
.stat-config-box { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 15px; }
|
||
.stat-config-box h4 { margin: 0 0 12px; font-size: 13px; color: #0b4a8e; font-weight: 700; border-bottom: 1px solid #e2e8f0; padding-bottom: 6px; }
|
||
|
||
.preset-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 10px; }
|
||
.preset-pill { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; cursor: pointer; transition: all .2s; }
|
||
.preset-pill:hover { border-color: #0b4a8e; transform: translateX(3px); }
|
||
.swatch-group { display: flex; border-radius: 20px; overflow: hidden; border: 1px solid rgba(0,0,0,0.1); }
|
||
.swatch-item { width: 18px; height: 18px; }
|
||
.preset-name { font-size: 12px; font-weight: 600; color: #334155; }
|
||
|
||
.edukarsa-admin-sidebar { position: sticky; top: 45px; }
|
||
.color-picker-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
|
||
.color-picker-row input[type="color"] { border: none; width: 34px; height: 34px; border-radius: 6px; cursor: pointer; background: transparent; }
|
||
|
||
@media (max-width: 1100px) {
|
||
.edukarsa-admin-layout { grid-template-columns: 1fr; }
|
||
.edukarsa-admin-sidebar { position: static; }
|
||
.stats-config-grid { grid-template-columns: 1fr; }
|
||
}
|
||
</style>
|
||
|
||
<div class="wrap edukarsa-admin-wrap">
|
||
<h1 style="font-weight: 800; font-size: 24px; margin-bottom: 20px;">Pengaturan Tema EduKarsa</h1>
|
||
<?php settings_errors(); ?>
|
||
|
||
<form action="options.php" method="post">
|
||
<?php settings_fields( 'edukarsa_settings_group' ); ?>
|
||
|
||
<div class="edukarsa-admin-layout">
|
||
<div class="edukarsa-admin-main">
|
||
|
||
<!-- 1. Header, Logo, Slider, Bahasa & Aksesibilitas -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>🏛️ 1. Header, Logo & Slider</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<div class="form-field-group">
|
||
<label>Logo Website (Header)</label>
|
||
<div class="input-with-button">
|
||
<input type="text" id="edukarsa_header_logo" name="edukarsa_header_logo" value="<?php echo esc_url(get_option('edukarsa_header_logo')); ?>" placeholder="https://...">
|
||
<button type="button" class="button btn-upload" data-target="#edukarsa_header_logo">Pilih Logo</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="switch-row" style="margin-top: 18px; background: #eef2ff; border-color: #c7d2fe;">
|
||
<div class="switch-label-wrap">
|
||
<div class="switch-label" style="color: #3730a3;">
|
||
<span>🌐 Fitur Bahasa (Penerjemah Instan)</span>
|
||
<span class="tooltip-hint">?<span class="tooltip-text">Menampilkan tombol pemilih bahasa di header situs.</span></span>
|
||
</div>
|
||
<span style="font-size: 11px; color: #4338ca;">Bahasa Indonesia (ID) aktif sebagai bahasa utama. Pilih bahasa tambahan di bawah:</span>
|
||
</div>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#lang-options-box" name="edukarsa_tampil_bilingual" value="1" <?php checked(1, get_option('edukarsa_tampil_bilingual', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
|
||
<div id="lang-options-box" style="background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 8px; padding: 14px 18px; margin-bottom: 14px;">
|
||
<span style="font-weight: 700; font-size: 12px; color: #475569; display: block; margin-bottom: 10px;">Bahasa Tambahan yang Diaktifkan:</span>
|
||
<div style="display: flex; gap: 20px; flex-wrap: wrap;">
|
||
<label style="font-size: 13px; font-weight: 600; color: #334155; cursor: pointer;">
|
||
<input type="checkbox" name="edukarsa_lang_en" value="1" <?php checked(1, get_option('edukarsa_lang_en', 1)); ?>> 🇬🇧 English (EN)
|
||
</label>
|
||
<label style="font-size: 13px; font-weight: 600; color: #334155; cursor: pointer;">
|
||
<input type="checkbox" name="edukarsa_lang_ar" value="1" <?php checked(1, get_option('edukarsa_lang_ar', 0)); ?>> 🇸🇦 العربية (AR)
|
||
</label>
|
||
<label style="font-size: 13px; font-weight: 600; color: #334155; cursor: pointer;">
|
||
<input type="checkbox" name="edukarsa_lang_zh" value="1" <?php checked(1, get_option('edukarsa_lang_zh', 0)); ?>> 🇨🇳 中文 (ZH)
|
||
</label>
|
||
<label style="font-size: 13px; font-weight: 600; color: #334155; cursor: pointer;">
|
||
<input type="checkbox" name="edukarsa_lang_ja" value="1" <?php checked(1, get_option('edukarsa_lang_ja', 0)); ?>> 🇯🇵 日本語 (JA)
|
||
</label>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="switch-row" style="background: #f0fdf4; border-color: #bbf7d0;">
|
||
<div class="switch-label-wrap">
|
||
<div class="switch-label" style="color: #166534;">
|
||
<span>♿ Fitur Aksesibilitas Disabilitas (WCAG Toolbar & Suara)</span>
|
||
<span class="tooltip-hint">?<span class="tooltip-text">Menampilkan toolbar ramah disabilitas (pembaca suara/audio, kontras, monokrom, ukuran huruf, sorot tautan).</span></span>
|
||
</div>
|
||
<span style="font-size: 11px; color: #15803d;">Dilengkapi Web Speech Synthesizer bawaan untuk membacakan artikel bagi tunanetra.</span>
|
||
</div>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" name="edukarsa_tampil_accessibility" value="1" <?php checked(1, get_option('edukarsa_tampil_accessibility', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
|
||
<div class="switch-row-inline" style="margin-top: 15px;">
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap">
|
||
<div class="switch-label"><span>Tampilkan Slider Atas</span><span class="tooltip-hint">?<span class="tooltip-text">Gambar & tautan banner dikelola pada modul 🌟 Slider Banner.</span></span></div>
|
||
<a href="<?php echo admin_url('edit.php?post_type=slider'); ?>" class="cpt-shortcut-link">Kelola Slider ↗</a>
|
||
</div>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" name="edukarsa_tampil_slider" value="1" <?php checked(1, get_option('edukarsa_tampil_slider', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap">
|
||
<div class="switch-label"><span>Tampilkan 3 Kotak Statistik</span><span class="tooltip-hint">?<span class="tooltip-text">Konfigurasi teks, angka capaian, dan ikon diatur pada formulir di bawah.</span></span></div>
|
||
<span style="font-size: 11px; color: #64748b;">Formulir Pengaturan Bawah ↓</span>
|
||
</div>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#stats-settings-box" name="edukarsa_tampil_stats" value="1" <?php checked(1, get_option('edukarsa_tampil_stats', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="stats-settings-box">
|
||
<div class="stats-config-grid">
|
||
<?php for($i=1; $i<=3; $i++) : ?>
|
||
<div class="stat-config-box">
|
||
<h4>Statistik <?php echo $i; ?></h4>
|
||
<div class="form-field-group">
|
||
<label>Ikon / Gambar</label>
|
||
<div class="input-with-button">
|
||
<input type="text" id="stat<?php echo $i; ?>_icon" name="edukarsa_stat<?php echo $i; ?>_icon" value="<?php echo esc_url(get_option('edukarsa_stat'.$i.'_icon')); ?>" placeholder="URL Ikon">
|
||
<button type="button" class="button btn-upload" data-target="#stat<?php echo $i; ?>_icon">Up</button>
|
||
</div>
|
||
</div>
|
||
<div class="form-field-group"><label>Angka / Capaian</label><input type="text" name="edukarsa_stat<?php echo $i; ?>_angka" value="<?php echo esc_attr(get_option('edukarsa_stat'.$i.'_angka')); ?>" placeholder="cth: 98%"></div>
|
||
<div class="form-field-group"><label>Judul Statistik</label><input type="text" name="edukarsa_stat<?php echo $i; ?>_label" value="<?php echo esc_attr(get_option('edukarsa_stat'.$i.'_label')); ?>" placeholder="cth: Akreditasi A"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Deskripsi Ringkas</label><textarea name="edukarsa_stat<?php echo $i; ?>_desc" rows="2"><?php echo esc_textarea(get_option('edukarsa_stat'.$i.'_desc')); ?></textarea></div>
|
||
</div>
|
||
<?php endfor; ?>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 2. Tentang Kami -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header">
|
||
<h2>👤 2. Sambutan & Profil Pimpinan</h2>
|
||
<label class="edukarsa-switch"><input type="checkbox" class="section-toggle" data-target="#about-settings-box" name="edukarsa_tampil_about" value="1" <?php checked(1, get_option('edukarsa_tampil_about', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
<div class="edukarsa-card-body" id="about-settings-box">
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Foto Pimpinan (Portrait 3:4)</label><div class="input-with-button"><input type="text" id="edukarsa_foto_kepsek" name="edukarsa_foto_kepsek" value="<?php echo esc_url(get_option('edukarsa_foto_kepsek')); ?>"><button type="button" class="button btn-upload" data-target="#edukarsa_foto_kepsek">Pilih</button></div></div>
|
||
<div class="form-field-group"><label>Nama Lengkap & Gelar</label><input type="text" name="edukarsa_nama_kepsek" value="<?php echo esc_attr(get_option('edukarsa_nama_kepsek')); ?>"></div>
|
||
</div>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Sub-Judul (cth: Rektor / Kepala Sekolah)</label><input type="text" name="edukarsa_subtitle_about" value="<?php echo esc_attr(get_option('edukarsa_subtitle_about')); ?>"></div>
|
||
<div class="form-field-group"><label>Tautan Detail (URL Profil)</label><input type="text" name="edukarsa_link_about" value="<?php echo esc_attr(get_option('edukarsa_link_about')); ?>"></div>
|
||
</div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Teks Sambutan</label><textarea name="edukarsa_teks_sambutan" rows="4"><?php echo esc_textarea(get_option('edukarsa_teks_sambutan')); ?></textarea></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 3. Program, Milestones, & Keunggulan -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>⭐ 3. Program, Milestones, & Keunggulan</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<div class="switch-row-inline">
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap"><div class="switch-label"><span>Seksi Milestone</span><span class="tooltip-hint">?<span class="tooltip-text">Data capaian diisi melalui menu 🏆 Milestone di sidebar.</span></span></div><a href="<?php echo admin_url('edit.php?post_type=milestone'); ?>" class="cpt-shortcut-link">Kelola Milestone ↗</a></div>
|
||
<label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_milestone" value="1" <?php checked(1, get_option('edukarsa_tampil_milestone', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap"><div class="switch-label"><span>Seksi Program</span><span class="tooltip-hint">?<span class="tooltip-text">Daftar program kurikulum dikelola pada menu 📚 Program Kami.</span></span></div><a href="<?php echo admin_url('edit.php?post_type=program'); ?>" class="cpt-shortcut-link">Kelola Program ↗</a></div>
|
||
<label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_program" value="1" <?php checked(1, get_option('edukarsa_tampil_program', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap"><div class="switch-label"><span>Seksi Keunggulan</span><span class="tooltip-hint">?<span class="tooltip-text">Poin keunggulan dikelola pada menu ⭐ Keunggulan.</span></span></div><a href="<?php echo admin_url('edit.php?post_type=keunggulan'); ?>" class="cpt-shortcut-link">Kelola Keunggulan ↗</a></div>
|
||
<label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_keunggulan" value="1" <?php checked(1, get_option('edukarsa_tampil_keunggulan', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="border-top: 1px solid #e2e8f0; margin-top: 20px; padding-top: 15px;">
|
||
<h4 style="margin: 0 0 10px; font-size: 13px; color: #0b4a8e;">🏆 Label Tampilan: Seksi Milestone</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Subtitle / Badge Teks</label><input type="text" name="edukarsa_milestone_subtitle" value="<?php echo esc_attr(get_option('edukarsa_milestone_subtitle', 'REKAM JEJAK')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi (Heading)</label><input type="text" name="edukarsa_milestone_title" value="<?php echo esc_attr(get_option('edukarsa_milestone_title', 'Milestone & Prestasi')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="border-top: 1px solid #e2e8f0; margin-top: 15px; padding-top: 15px;">
|
||
<h4 style="margin: 0 0 10px; font-size: 13px; color: #0b4a8e;">📚 Label Tampilan: Seksi Program</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Subtitle / Badge Teks</label><input type="text" name="edukarsa_program_subtitle" value="<?php echo esc_attr(get_option('edukarsa_program_subtitle', 'AKADEMIK & KARAKTER')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi (Heading)</label><input type="text" name="edukarsa_program_title" value="<?php echo esc_attr(get_option('edukarsa_program_title', 'Our Program')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="border-top: 1px solid #e2e8f0; margin-top: 15px; padding-top: 15px;">
|
||
<h4 style="margin: 0 0 10px; font-size: 13px; color: #0b4a8e;">⭐ Label Tampilan: Seksi Keunggulan</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Subtitle / Badge Teks</label><input type="text" name="edukarsa_keunggulan_subtitle" value="<?php echo esc_attr(get_option('edukarsa_keunggulan_subtitle', 'WHY CHOOSE US')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi (Heading)</label><input type="text" name="edukarsa_keunggulan_title" value="<?php echo esc_attr(get_option('edukarsa_keunggulan_title', 'Keunggulan Program')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 4. Video & Parallax Area -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header">
|
||
<h2>🎬 4. Video & Parallax (Area Tengah)</h2>
|
||
<label class="edukarsa-switch"><input type="checkbox" class="section-toggle" data-target="#video-settings-box" name="edukarsa_tampil_video" value="1" <?php checked(1, get_option('edukarsa_tampil_video', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
<div class="edukarsa-card-body" id="video-settings-box">
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Gambar Latar Parallax</label><div class="input-with-button"><input type="text" id="mid_bg_image" name="edukarsa_mid_bg_image" value="<?php echo esc_url(get_option('edukarsa_mid_bg_image')); ?>"><button type="button" class="button btn-upload" data-target="#mid_bg_image">Pilih</button></div></div>
|
||
<div class="form-field-group"><label>Warna Overlay Parallax</label><div style="display:flex; align-items:center; gap:10px;"><input type="color" name="edukarsa_mid_bg_color" value="<?php echo esc_attr(get_option('edukarsa_mid_bg_color', '#0b4a8e')); ?>"><code><?php echo esc_html(get_option('edukarsa_mid_bg_color', '#0b4a8e')); ?></code></div></div>
|
||
</div>
|
||
<div class="form-grid-2">
|
||
<div class="stat-config-box">
|
||
<h4>Video 1</h4>
|
||
<div class="form-field-group"><label>Thumbnail Video 1</label><div class="input-with-button"><input type="text" id="vid1_thumb" name="edukarsa_video1_thumb" value="<?php echo esc_url(get_option('edukarsa_video1_thumb')); ?>"><button type="button" class="button btn-upload" data-target="#vid1_thumb">Up</button></div></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>URL Video 1</label><input type="text" name="edukarsa_video1_url" value="<?php echo esc_attr(get_option('edukarsa_video1_url')); ?>" placeholder="https://youtube.com/watch?v=..."></div>
|
||
</div>
|
||
<div class="stat-config-box">
|
||
<h4>Video 2</h4>
|
||
<div class="form-field-group"><label>Thumbnail Video 2</label><div class="input-with-button"><input type="text" id="vid2_thumb" name="edukarsa_video2_thumb" value="<?php echo esc_url(get_option('edukarsa_video2_thumb')); ?>"><button type="button" class="button btn-upload" data-target="#vid2_thumb">Up</button></div></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>URL Video 2</label><input type="text" name="edukarsa_video2_url" value="<?php echo esc_attr(get_option('edukarsa_video2_url')); ?>" placeholder="https://youtube.com/watch?v=..."></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 5. CTA, FAQ & Berita -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>📢 5. CTA Pendaftaran, FAQ & Berita</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<div class="switch-row-inline">
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap"><span class="switch-label">Tampilkan CTA Banner</span><span style="font-size: 11px; color: #64748b;">Pengaturan Khusus PPDB</span></div>
|
||
<label class="edukarsa-switch"><input type="checkbox" class="section-toggle" data-target="#cta-settings-box" name="edukarsa_tampil_cta" value="1" <?php checked(1, get_option('edukarsa_tampil_cta', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap">
|
||
<div class="switch-label">
|
||
<span>Tampilkan Seksi FAQ</span>
|
||
<span class="tooltip-hint">?<span class="tooltip-text">Jika dinonaktifkan, seksi FAQ disembunyikan dari beranda. Seluruh item FAQ yang sudah dibuat tetap tersimpan aman di database.</span></span>
|
||
</div>
|
||
<a href="<?php echo admin_url('edit.php?post_type=faq'); ?>" class="cpt-shortcut-link">Kelola Data FAQ ↗</a>
|
||
</div>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#faq-settings-box" name="edukarsa_tampil_faq" value="1" <?php checked(1, get_option('edukarsa_tampil_faq', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
|
||
<div class="switch-row">
|
||
<div class="switch-label-wrap"><div class="switch-label"><span>Tampilkan Berita Kampus</span><span class="tooltip-hint">?<span class="tooltip-text">Berita otomatis diambil dari menu 'Pos'.</span></span></div><a href="<?php echo admin_url('edit.php'); ?>" class="cpt-shortcut-link">Kelola Berita ↗</a></div>
|
||
<label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_news" value="1" <?php checked(1, get_option('edukarsa_tampil_news', 1)); ?>><span class="slider-round"></span></label>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="cta-settings-box" class="stat-config-box" style="margin-bottom: 20px;">
|
||
<h4>Konfigurasi CTA PPDB / PMB</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Gambar Latar CTA</label><div class="input-with-button"><input type="text" id="cta_bg" name="edukarsa_cta_bg" value="<?php echo esc_url(get_option('edukarsa_cta_bg')); ?>"><button type="button" class="button btn-upload" data-target="#cta_bg">Up</button></div></div>
|
||
<div class="form-field-group"><label>Teks Tombol CTA</label><input type="text" name="edukarsa_cta_btn_teks" value="<?php echo esc_attr(get_option('edukarsa_cta_btn_teks', 'Daftar Sekarang')); ?>"></div>
|
||
</div>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Ajakan CTA</label><input type="text" name="edukarsa_cta_title" value="<?php echo esc_attr(get_option('edukarsa_cta_title')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Tautan Tombol CTA</label><input type="text" name="edukarsa_cta_btn_url" value="<?php echo esc_attr(get_option('edukarsa_cta_btn_url')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="faq-settings-box" class="stat-config-box" style="margin-bottom: 20px;">
|
||
<h4>Label Tampilan Seksi FAQ (Tanya Jawab)</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Subtitle / Badge FAQ</label><input type="text" name="edukarsa_faq_subtitle" value="<?php echo esc_attr(get_option('edukarsa_faq_subtitle', 'FAQ')); ?>" placeholder="cth: FAQ / INFO PENTING"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi FAQ</label><input type="text" name="edukarsa_faq_title" value="<?php echo esc_attr(get_option('edukarsa_faq_title', 'Pertanyaan Umum')); ?>" placeholder="cth: Pertanyaan Umum"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi Berita</label><input type="text" name="edukarsa_news_title" value="<?php echo esc_attr(get_option('edukarsa_news_title', 'News & Update')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 6. KUSTOMISASI SIDEBAR (BARU: PENGGANTI WIDGET WP) -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header">
|
||
<h2>📑 6. Pengaturan Sidebar (Artikel & Halaman)</h2>
|
||
</div>
|
||
<div class="edukarsa-card-body">
|
||
<p style="font-size: 13px; color: #64748b; margin-top:0; margin-bottom: 15px;">
|
||
Kelola komponen sidebar artikel secara native tanpa perlu menu Widget WordPress.
|
||
</p>
|
||
|
||
<!-- Toggle Komponen Sidebar -->
|
||
<div class="switch-row-inline">
|
||
<div class="switch-row">
|
||
<span class="switch-label">Kotak Pencarian Cepat</span>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" name="edukarsa_sidebar_tampil_search" value="1" <?php checked(1, get_option('edukarsa_sidebar_tampil_search', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
<div class="switch-row">
|
||
<span class="switch-label">Kartu Mini CTA Pendaftaran</span>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#sidebar-cta-box" name="edukarsa_sidebar_tampil_cta" value="1" <?php checked(1, get_option('edukarsa_sidebar_tampil_cta', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Detail Form Mini CTA Sidebar -->
|
||
<div id="sidebar-cta-box" class="stat-config-box" style="margin-bottom: 15px;">
|
||
<h4>Konfigurasi Mini CTA Sidebar</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Badge Judul CTA</label><input type="text" name="edukarsa_sidebar_cta_badge" value="<?php echo esc_attr(get_option('edukarsa_sidebar_cta_badge', 'Penerimaan Siswa/Mhs')); ?>"></div>
|
||
<div class="form-field-group"><label>Judul Ajakan</label><input type="text" name="edukarsa_sidebar_cta_title" value="<?php echo esc_attr(get_option('edukarsa_sidebar_cta_title', 'Siap Berprestasi Bersama Kami?')); ?>"></div>
|
||
</div>
|
||
<div class="form-field-group"><label>Deskripsi Singkat</label><textarea name="edukarsa_sidebar_cta_desc" rows="2"><?php echo esc_textarea(get_option('edukarsa_sidebar_cta_desc', 'Daftarkan diri Anda sekarang dan raih peluang beasiswa unggulan.')); ?></textarea></div>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Teks Tombol</label><input type="text" name="edukarsa_sidebar_cta_btn_text" value="<?php echo esc_attr(get_option('edukarsa_sidebar_cta_btn_text', 'Daftar Sekarang')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Tautan URL Tombol</label><input type="text" name="edukarsa_sidebar_cta_btn_url" value="<?php echo esc_attr(get_option('edukarsa_sidebar_cta_btn_url', '#')); ?>"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="switch-row-inline">
|
||
<div class="switch-row">
|
||
<span class="switch-label">Daftar Berita Terbaru</span>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#sidebar-recent-box" name="edukarsa_sidebar_tampil_recent" value="1" <?php checked(1, get_option('edukarsa_sidebar_tampil_recent', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
<div class="switch-row">
|
||
<span class="switch-label">Daftar Kategori Berita</span>
|
||
<label class="edukarsa-switch">
|
||
<input type="checkbox" class="section-toggle" data-target="#sidebar-cats-box" name="edukarsa_sidebar_tampil_cats" value="1" <?php checked(1, get_option('edukarsa_sidebar_tampil_cats', 1)); ?>>
|
||
<span class="slider-round"></span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="sidebar-recent-box" class="form-grid-2" style="background:#f8fafc; padding:15px; border:1px solid #e2e8f0; border-radius:8px; margin-bottom:15px;">
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Judul Seksi Berita Terkini</label><input type="text" name="edukarsa_sidebar_recent_title" value="<?php echo esc_attr(get_option('edukarsa_sidebar_recent_title', 'Warta Terkini')); ?>"></div>
|
||
<div class="form-field-group" style="margin-bottom:0;"><label>Jumlah Pos Ditampilkan</label><input type="number" name="edukarsa_sidebar_recent_count" value="<?php echo esc_attr(get_option('edukarsa_sidebar_recent_count', 5)); ?>" min="1" max="10"></div>
|
||
</div>
|
||
|
||
<div id="sidebar-cats-box" class="form-field-group" style="background:#f8fafc; padding:15px; border:1px solid #e2e8f0; border-radius:8px; margin-bottom:15px;">
|
||
<label>Judul Seksi Kategori</label>
|
||
<input type="text" name="edukarsa_sidebar_cats_title" value="<?php echo esc_attr(get_option('edukarsa_sidebar_cats_title', 'Kategori Pilihan')); ?>">
|
||
</div>
|
||
|
||
<!-- Banner Iklan / Pengumuman Khusus Sidebar -->
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group">
|
||
<label>Banner Poster Sidebar (Opsional)</label>
|
||
<div class="input-with-button">
|
||
<input type="text" id="edukarsa_sidebar_banner_img" name="edukarsa_sidebar_banner_img" value="<?php echo esc_url(get_option('edukarsa_sidebar_banner_img')); ?>" placeholder="https://...">
|
||
<button type="button" class="button btn-upload" data-target="#edukarsa_sidebar_banner_img">Pilih</button>
|
||
</div>
|
||
</div>
|
||
<div class="form-field-group">
|
||
<label>Tautan Klik Banner Poster</label>
|
||
<input type="text" name="edukarsa_sidebar_banner_url" value="<?php echo esc_attr(get_option('edukarsa_sidebar_banner_url')); ?>" placeholder="https://...">
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 7. Footer, Kontak & WhatsApp -->
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>📞 7. Footer, Kontak & Tombol WhatsApp</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<div style="background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px; padding: 16px 20px; margin-bottom: 20px;">
|
||
<h4 style="margin: 0 0 12px; font-size: 13px; color: #166534;">💬 Kustomisasi Tombol WhatsApp Melayang</h4>
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group" style="margin-bottom: 0;">
|
||
<label>Label / Tulisan Tombol</label>
|
||
<input type="text" name="edukarsa_wa_btn_text" value="<?php echo esc_attr(get_option('edukarsa_wa_btn_text', 'Tanya PMB')); ?>">
|
||
</div>
|
||
<div class="form-field-group" style="margin-bottom: 0;">
|
||
<label>Template Pesan Awal Otomatis</label>
|
||
<input type="text" name="edukarsa_wa_default_msg" value="<?php echo esc_attr(get_option('edukarsa_wa_default_msg', 'Halo Admin EduKarsa, saya ingin bertanya informasi lebih lanjut.')); ?>">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group">
|
||
<label>Logo Footer (Opsional, kosongkan jika pakai logo header)</label>
|
||
<div class="input-with-button">
|
||
<input type="text" id="edukarsa_footer_logo" name="edukarsa_footer_logo" value="<?php echo esc_url(get_option('edukarsa_footer_logo')); ?>" placeholder="https://...">
|
||
<button type="button" class="button btn-upload" data-target="#edukarsa_footer_logo">Pilih</button>
|
||
</div>
|
||
</div>
|
||
<div class="form-field-group">
|
||
<label>Jam Operasional / Layanan (Multi-baris / Bebas Tekan Enter)</label>
|
||
<textarea name="edukarsa_footer_jam" rows="3"><?php echo esc_textarea(get_option('edukarsa_footer_jam', "Senin – Jumat: 08.00 – 16.00 WIB\nSabtu: 08.00 – 12.00 WIB")); ?></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-field-group">
|
||
<label>Deskripsi Singkat Kampus / Visi Ringkas</label>
|
||
<textarea name="edukarsa_footer_desc" rows="3"><?php echo esc_textarea(get_option('edukarsa_footer_desc', 'Institusi pendidikan terakreditasi unggul yang berdedikasi mencetak generasi berkarakter cerdas, kompetitif, dan berintegritas.')); ?></textarea>
|
||
</div>
|
||
|
||
<div class="form-field-group"><label>Alamat Lengkap Institusi</label><textarea name="edukarsa_footer_alamat" rows="2"><?php echo esc_textarea(get_option('edukarsa_footer_alamat')); ?></textarea></div>
|
||
|
||
<div class="form-grid-2">
|
||
<div class="form-field-group"><label>Nomor Telepon / WhatsApp Layanan</label><input type="text" name="edukarsa_footer_telp" value="<?php echo esc_attr(get_option('edukarsa_footer_telp')); ?>" placeholder="+62 ..."></div>
|
||
<div class="form-field-group"><label>Alamat Email Resmi</label><input type="text" name="edukarsa_footer_email" value="<?php echo esc_attr(get_option('edukarsa_footer_email')); ?>" placeholder="[email protected]"></div>
|
||
</div>
|
||
|
||
<div class="form-field-group"><label>Teks Hak Cipta (Copyright Bar)</label><input type="text" name="edukarsa_footer_copyright" value="<?php echo esc_attr(get_option('edukarsa_footer_copyright', 'EduKarsa University. All Rights Reserved.')); ?>"></div>
|
||
|
||
<h4 style="margin: 25px 0 12px; font-size:14px; color:#0b4a8e; border-bottom:1px solid #e2e8f0; padding-bottom:8px;">Jaringan Media Sosial Resmi</h4>
|
||
<div class="switch-row"><span class="switch-label">Facebook</span><div style="display:flex; align-items:center; gap:12px; width:70%;"><input type="text" name="edukarsa_footer_fb" value="<?php echo esc_attr(get_option('edukarsa_footer_fb')); ?>" placeholder="https://facebook.com/..." style="flex-grow:1; border:1px solid #cbd5e1; border-radius:6px; padding:6px 10px;"><label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_fb" value="1" <?php checked(1, get_option('edukarsa_tampil_fb', 1)); ?>><span class="slider-round"></span></label></div></div>
|
||
<div class="switch-row"><span class="switch-label">Instagram</span><div style="display:flex; align-items:center; gap:12px; width:70%;"><input type="text" name="edukarsa_footer_ig" value="<?php echo esc_attr(get_option('edukarsa_footer_ig')); ?>" placeholder="https://instagram.com/..." style="flex-grow:1; border:1px solid #cbd5e1; border-radius:6px; padding:6px 10px;"><label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_ig" value="1" <?php checked(1, get_option('edukarsa_tampil_ig', 1)); ?>><span class="slider-round"></span></label></div></div>
|
||
<div class="switch-row"><span class="switch-label">YouTube</span><div style="display:flex; align-items:center; gap:12px; width:70%;"><input type="text" name="edukarsa_footer_yt" value="<?php echo esc_attr(get_option('edukarsa_footer_yt')); ?>" placeholder="https://youtube.com/..." style="flex-grow:1; border:1px solid #cbd5e1; border-radius:6px; padding:6px 10px;"><label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_yt" value="1" <?php checked(1, get_option('edukarsa_tampil_yt', 1)); ?>><span class="slider-round"></span></label></div></div>
|
||
<div class="switch-row"><span class="switch-label">TikTok</span><div style="display:flex; align-items:center; gap:12px; width:70%;"><input type="text" name="edukarsa_footer_tiktok" value="<?php echo esc_attr(get_option('edukarsa_footer_tiktok')); ?>" placeholder="https://tiktok.com/@..." style="flex-grow:1; border:1px solid #cbd5e1; border-radius:6px; padding:6px 10px;"><label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_tiktok" value="1" <?php checked(1, get_option('edukarsa_tampil_tiktok', 0)); ?>><span class="slider-round"></span></label></div></div>
|
||
<div class="switch-row"><span class="switch-label">X (Twitter)</span><div style="display:flex; align-items:center; gap:12px; width:70%;"><input type="text" name="edukarsa_footer_x" value="<?php echo esc_attr(get_option('edukarsa_footer_x')); ?>" placeholder="https://x.com/..." style="flex-grow:1; border:1px solid #cbd5e1; border-radius:6px; padding:6px 10px;"><label class="edukarsa-switch"><input type="checkbox" name="edukarsa_tampil_x" value="1" <?php checked(1, get_option('edukarsa_tampil_x', 0)); ?>><span class="slider-round"></span></label></div></div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- KOLOM KANAN (SIDEBAR ACTION PANEL) -->
|
||
<div class="edukarsa-admin-sidebar">
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>💾 Publikasi</h2></div>
|
||
<div class="edukarsa-card-body text-center" style="padding:18px;">
|
||
<p style="font-size:12px; color:#64748b; margin-top:0; margin-bottom:15px;">Simpan konfigurasi tema EduKarsa.</p>
|
||
<?php submit_button( 'Simpan Pengaturan', 'primary large', 'submit', false, array('style'=>'width:100%; border-radius:6px; font-weight:700; padding:10px;') ); ?>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>🔤 Tipografi Font</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<div class="form-field-group" style="margin-bottom:0;">
|
||
<label>Pilihan Font Utama</label>
|
||
<select name="edukarsa_font_choice" id="edukarsa_font_choice" style="width:100%; padding:8px; border-radius:6px;">
|
||
<option value="plus_jakarta_sans" <?php selected( 'plus_jakarta_sans', $font_current ); ?>>Plus Jakarta Sans (Rekomendasi)</option>
|
||
<option value="inter" <?php selected( 'inter', $font_current ); ?>>Inter (Modern UI)</option>
|
||
<option value="poppins" <?php selected( 'poppins', $font_current ); ?>>Poppins (Geometris)</option>
|
||
<option value="roboto" <?php selected( 'roboto', $font_current ); ?>>Roboto (Klasik)</option>
|
||
<option value="system" <?php selected( 'system', $font_current ); ?>>System Native (Super Cepat)</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="edukarsa-card">
|
||
<div class="edukarsa-card-header"><h2>🎨 Skema Warna</h2></div>
|
||
<div class="edukarsa-card-body">
|
||
<label style="font-weight:700; font-size:12px; color:#64748b; text-transform:uppercase; letter-spacing:0.5px; display:block; margin-bottom:10px;">Pilih Preset Instan</label>
|
||
<div class="preset-grid">
|
||
<div class="preset-pill" data-p="#0b4a8e" data-s="#1a73e8" data-h="#0f172a"><div class="swatch-group"><span class="swatch-item" style="background:#0b4a8e;"></span><span class="swatch-item" style="background:#1a73e8;"></span></div><span class="preset-name">Classic Navy (Default)</span></div>
|
||
<div class="preset-pill" data-p="#065f46" data-s="#10b981" data-h="#064e3b"><div class="swatch-group"><span class="swatch-item" style="background:#065f46;"></span><span class="swatch-item" style="background:#10b981;"></span></div><span class="preset-name">Islamic Emerald Green</span></div>
|
||
<div class="preset-pill" data-p="#881337" data-s="#e11d48" data-h="#4c0519"><div class="swatch-group"><span class="swatch-item" style="background:#881337;"></span><span class="swatch-item" style="background:#e11d48;"></span></div><span class="preset-name">Prestige Maroon</span></div>
|
||
<div class="preset-pill" data-p="#0f766e" data-s="#06b6d4" data-h="#134e4a"><div class="swatch-group"><span class="swatch-item" style="background:#0f766e;"></span><span class="swatch-item" style="background:#06b6d4;"></span></div><span class="preset-name">Techno Teal</span></div>
|
||
<div class="preset-pill" data-p="#581c87" data-s="#8b5cf6" data-h="#3b0764"><div class="swatch-group"><span class="swatch-item" style="background:#581c87;"></span><span class="swatch-item" style="background:#8b5cf6;"></span></div><span class="preset-name">Royal Violet</span></div>
|
||
<div class="preset-pill" data-p="#b45309" data-s="#f59e0b" data-h="#78350f"><div class="swatch-group"><span class="swatch-item" style="background:#b45309;"></span><span class="swatch-item" style="background:#f59e0b;"></span></div><span class="preset-name">Autumn Gold</span></div>
|
||
</div>
|
||
<hr style="margin:20px 0; border:none; border-top:1px solid #f1f5f9;">
|
||
<label style="font-weight:700; font-size:12px; color:#64748b; text-transform:uppercase; letter-spacing:0.5px; display:block; margin-bottom:12px;">Sesuaikan Manual</label>
|
||
<div class="color-picker-row"><span style="font-size:13px; font-weight:600;">Warna Primer</span><div style="display:flex; align-items:center; gap:8px;"><input type="color" id="primary_picker" name="edukarsa_primary_color" value="<?php echo esc_attr( $primary_color ); ?>"><code id="primary_code"><?php echo esc_html( $primary_color ); ?></code></div></div>
|
||
<div class="color-picker-row"><span style="font-size:13px; font-weight:600;">Warna Aksen</span><div style="display:flex; align-items:center; gap:8px;"><input type="color" id="secondary_picker" name="edukarsa_secondary_color" value="<?php echo esc_attr( $secondary_color ); ?>"><code id="secondary_code"><?php echo esc_html( $secondary_color ); ?></code></div></div>
|
||
<div class="color-picker-row"><span style="font-size:13px; font-weight:600;">Warna Judul</span><div style="display:flex; align-items:center; gap:8px;"><input type="color" id="heading_picker" name="edukarsa_heading_color" value="<?php echo esc_attr( $heading_color ); ?>"><code id="heading_code"><?php echo esc_html( $heading_color ); ?></code></div></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<script>
|
||
jQuery(document).ready(function($){
|
||
function syncToggles() {
|
||
$('.section-toggle').each(function(){
|
||
var target = $(this).data('target');
|
||
if ($(this).is(':checked')) { $(target).slideDown(200); } else { $(target).slideUp(200); }
|
||
});
|
||
}
|
||
$('.section-toggle').change(syncToggles);
|
||
syncToggles();
|
||
|
||
$('.preset-pill').click(function(){
|
||
var p = $(this).data('p'), s = $(this).data('s'), h = $(this).data('h');
|
||
$('#primary_picker').val(p); $('#primary_code').text(p);
|
||
$('#secondary_picker').val(s); $('#secondary_code').text(s);
|
||
$('#heading_picker').val(h); $('#heading_code').text(h);
|
||
$('.preset-pill').css('border-color', '#e2e8f0');
|
||
$(this).css('border-color', '#0b4a8e');
|
||
});
|
||
|
||
$('#primary_picker').on('input change', function(){ $('#primary_code').text($(this).val()); });
|
||
$('#secondary_picker').on('input change', function(){ $('#secondary_code').text($(this).val()); });
|
||
$('#heading_picker').on('input change', function(){ $('#heading_code').text($(this).val()); });
|
||
|
||
var mediaUploader;
|
||
$('.btn-upload').click(function(e) {
|
||
e.preventDefault();
|
||
var targetInput = $(this).data('target');
|
||
if (mediaUploader) { mediaUploader.targetInput = targetInput; mediaUploader.open(); return; }
|
||
mediaUploader = wp.media.frames.file_frame = wp.media({ title: 'Pilih Berkas Media', button: { text: 'Gunakan Media Ini' }, multiple: false });
|
||
mediaUploader.targetInput = targetInput;
|
||
mediaUploader.on('select', function() {
|
||
var attachment = mediaUploader.state().get('selection').first().toJSON();
|
||
$(mediaUploader.targetInput).val(attachment.url);
|
||
});
|
||
mediaUploader.open();
|
||
});
|
||
});
|
||
</script>
|
||
<?php
|
||
}
|