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

feat(builder): implementasi native drag and drop homepage layout builder yang 100% aman

Browse Source
This commit is contained in:
Mas Budi Kusuma
2026-09-16 08:11:03 +07:00
parent e6e39f4fa9
commit 1cee7ecf5c
2 changed files with 459 additions and 288 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front-page.php
+345 -288
View File
@@ -3,7 +3,9 @@
<main id="primary" class="site-main edukarsa-home">
<!-- 1. SLIDER -->
<!-- ==========================================
1. SLIDER (TERKUNCI DI PALING ATAS)
=========================================== -->
<?php if ( get_option('edukarsa_tampil_slider', 1) == 1 ) : ?>
<section class="edukarsa-section edukarsa-hero-slider" style="padding: 0;">
<div class="slider-container" id="hero-slider-container">
@@ -33,311 +35,366 @@
</section>
<?php endif; ?>
<!-- 2. STATISTIK DESAIN KARTU MELAYANG -->
<?php if ( get_option('edukarsa_tampil_stats', 1) == 1 ) : ?>
<section class="edukarsa-stats">
<div class="container stats-grid">
<?php for($i=1; $i<=3; $i++) : ?>
<div class="stat-item card-style stat-card-modern">
<div class="stat-icon-wrapper">
<?php $icon = get_option('edukarsa_stat'.$i.'_icon'); ?>
<?php if($icon) : ?>
<img src="<?php echo esc_url($icon); ?>" alt="Icon">
<?php else: ?>
<span>🏫</span>
<?php endif; ?>
</div>
<h3 class="stat-number"><?php echo esc_html( get_option('edukarsa_stat'.$i.'_angka', '00') ); ?></h3>
<h4 class="stat-title"><?php echo esc_html( get_option('edukarsa_stat'.$i.'_label', 'Judul Statistik') ); ?></h4>
<p class="stat-desc"><?php echo nl2br(esc_html( get_option('edukarsa_stat'.$i.'_desc', 'Deskripsi singkat') )); ?></p>
</div>
<?php endfor; ?>
</div>
</section>
<?php endif; ?>
<!-- 3. ABOUT US / SAMBUTAN -->
<?php if ( get_option('edukarsa_tampil_about', 1) == 1 ) : ?>
<section class="edukarsa-section edukarsa-sambutan">
<div class="container sambutan-grid">
<div class="sambutan-image-wrapper">
<div class="img-wrapper-portrait">
<?php $foto = get_option('edukarsa_foto_kepsek'); ?>
<?php if(!empty($foto)) : ?>
<img src="<?php echo esc_url($foto); ?>" alt="Kepala Sekolah">
<?php else : ?>
<div class="img-placeholder"><i>👤</i><span>Upload Foto Kepala Sekolah</span></div>
<?php endif; ?>
</div>
</div>
<div class="sambutan-content">
<span class="badge-title">ABOUT US</span>
<h2 class="section-title" style="margin-bottom: 6px;"><?php echo esc_html( get_option('edukarsa_nama_kepsek', 'Nama Kepala Sekolah') ); ?></h2>
<h4 class="section-subtitle-strong" style="color:var(--primary-color); margin-bottom:18px; font-size:17px; font-weight:700;"><?php echo esc_html( get_option('edukarsa_subtitle_about', 'Pimpinan Institusi') ); ?></h4>
<div class="sambutan-text"><?php echo wpautop( wp_kses_post( get_option('edukarsa_teks_sambutan') ) ); ?></div>
<a href="<?php echo esc_url( get_option('edukarsa_link_about', '#') ); ?>" class="btn-primary" style="margin-top: 5px;">Ketahui Lebih Lanjut</a>
</div>
</div>
</section>
<?php endif; ?>
<!-- 4. MILESTONES -->
<?php
if ( get_option('edukarsa_tampil_milestone', 1) == 1 ) :
$query_milestone = new WP_Query( array( 'post_type' => 'milestone', 'posts_per_page' => 4 ) );
if ( $query_milestone->have_posts() ) :
$m_sub = get_option( 'edukarsa_milestone_subtitle', 'REKAM JEJAK' );
$m_title = get_option( 'edukarsa_milestone_title', 'Milestone & Prestasi' );
?>
<section class="edukarsa-section edukarsa-milestones bg-light-blue" style="padding: 50px 0;">
<div class="container">
<?php if ( ! empty( $m_title ) ) : ?>
<div class="section-header text-center" style="margin-bottom: 30px;">
<?php if ( ! empty( $m_sub ) ) : ?><span class="badge-title"><?php echo esc_html( $m_sub ); ?></span><?php endif; ?>
<h2 class="section-title"><?php echo esc_html( $m_title ); ?></h2>
<hr class="title-underline">
</div>
<?php endif; ?>
<div class="milestone-grid text-center">
<?php
while ( $query_milestone->have_posts() ) : $query_milestone->the_post();
?>
<div class="milestone-item card-style" style="padding: 25px 20px;">
<h3 class="milestone-title" style="color: var(--primary-color); font-size: 34px; font-weight: 800; margin-bottom: 6px; line-height: 1;">
<?php the_title(); ?>
</h3>
<div class="milestone-desc" style="font-size: 13px; color: var(--text-muted); line-height: 1.5;">
<?php the_excerpt(); ?>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
</div>
</section>
<?php
endif;
endif;
?>
<!-- 5. PROGRAM UNGGULAN -->
<?php
if ( get_option('edukarsa_tampil_program', 1) == 1 ) :
$prog_sub = get_option( 'edukarsa_program_subtitle', 'AKADEMIK & KARAKTER' );
$prog_title = get_option( 'edukarsa_program_title', 'Our Program' );
?>
<section class="edukarsa-section edukarsa-programs">
<div class="container">
<div class="section-header text-center">
<?php if ( ! empty( $prog_sub ) ) : ?><span class="badge-title"><?php echo esc_html( $prog_sub ); ?></span><?php endif; ?>
<h2 class="section-title"><?php echo esc_html( $prog_title ); ?></h2>
<hr class="title-underline">
</div>
<div class="program-grid">
<?php
$query_program = new WP_Query( array( 'post_type' => 'program', 'posts_per_page' => 3 ) );
if ( $query_program->have_posts() ) :
while ( $query_program->have_posts() ) : $query_program->the_post();
?>
<div class="program-card card-style text-center top-border-blue">
<div class="img-wrapper-landscape" style="margin-bottom: 18px;">
<?php if ( has_post_thumbnail() ) : ?>
<?php the_post_thumbnail( 'medium' ); ?>
<?php else: ?>
<div class="img-placeholder"><i>🏫</i><span>Gambar Program</span></div>
<?php endif; ?>
</div>
<h3 style="margin-bottom: 10px; font-size: 19px; color: var(--heading-color); font-weight: 700;">
<?php the_title(); ?>
</h3>
<div class="program-desc" style="margin-bottom: 20px; font-size: 14px; color: var(--text-muted); line-height: 1.6;">
<?php echo wp_trim_words( get_the_excerpt(), 15, '...' ); ?>
</div>
<a href="<?php the_permalink(); ?>" class="btn-outline-primary">Lihat Detail</a>
</div>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
<?php endif; ?>
<!-- 6 & 7. WRAPPER PARALLAX -->
<?php
<!-- ==========================================
2. ENGINE BUILDER NATIVE (DRAG & DROP)
=========================================== -->
<?php
// Urutan Bawaan
$default_layout = array('stats','about','milestone','program','video','keunggulan','cta','news','faq');
// Ambil Data Urutan dari Database
$layout_option = get_option('edukarsa_homepage_layout', implode(',', $default_layout));
if (empty($layout_option)) $layout_option = implode(',', $default_layout);
$sections = explode(',', $layout_option);
// Konfigurasi Latar Parallax Global
$mid_bg = get_option('edukarsa_mid_bg_image');
$parallax_style = $mid_bg ? 'background-image: url('.esc_url($mid_bg).');' : 'background: linear-gradient(135deg, var(--primary-color), var(--heading-color));';
?>
<div class="parallax-section-wrapper" style="<?php echo $parallax_style; ?>">
<div class="parallax-overlay"></div>
<div class="parallax-content relative-z2">
// RENDER LOOP BERDASARKAN URUTAN ARRAY
foreach ( $sections as $index => $section ) {
$section = trim($section);
switch ( $section ) {
<!-- 6. VIDEO -->
<?php if ( get_option('edukarsa_tampil_video', 1) == 1 ) : ?>
<section class="edukarsa-section edukarsa-videos" style="padding-bottom: 30px;">
<div class="container video-grid">
<?php for($i=1; $i<=2; $i++) : ?>
<div class="video-item">
<?php $vid_thumb = get_option('edukarsa_video'.$i.'_thumb'); ?>
<a href="<?php echo esc_url( get_option('edukarsa_video'.$i.'_url', '#') ); ?>" target="_blank">
<div class="img-wrapper-video">
<?php if($vid_thumb) : ?>
<img src="<?php echo esc_url($vid_thumb); ?>" alt="Video">
// --- SEKSI STATISTIK ---
case 'stats':
if ( get_option('edukarsa_tampil_stats', 1) == 1 ) :
// Jika urutan pertama, berikan efek melayang (overlap slider)
$is_first = ($index === 0);
$margin_style = $is_first ? 'margin-top: -80px;' : 'margin-top: 50px;';
?>
<section class="edukarsa-stats">
<div class="container stats-grid" style="<?php echo $margin_style; ?>">
<?php for($i=1; $i<=3; $i++) : ?>
<div class="stat-item card-style stat-card-modern">
<div class="stat-icon-wrapper">
<?php $icon = get_option('edukarsa_stat'.$i.'_icon'); ?>
<?php if($icon) : ?>
<img src="<?php echo esc_url($icon); ?>" alt="Icon">
<?php else: ?>
<div class="img-placeholder" style="background:#1e293b; color:#cbd5e1; border:none;"><i>▶️</i><span>Upload Thumbnail Video <?php echo $i; ?></span></div>
<span>🏫</span>
<?php endif; ?>
</div>
<?php if($vid_thumb) echo '<div class="play-btn">▶</div>'; ?>
</a>
<h3 class="stat-number"><?php echo esc_html( get_option('edukarsa_stat'.$i.'_angka', '00') ); ?></h3>
<h4 class="stat-title"><?php echo esc_html( get_option('edukarsa_stat'.$i.'_label', 'Judul Statistik') ); ?></h4>
<p class="stat-desc"><?php echo nl2br(esc_html( get_option('edukarsa_stat'.$i.'_desc', 'Deskripsi singkat') )); ?></p>
</div>
<?php endfor; ?>
</div>
<?php endfor; ?>
</div>
</section>
<?php endif; ?>
</section>
<?php
endif;
break;
<!-- 7. KEUNGGULAN DINAMIS -->
<?php
if ( get_option('edukarsa_tampil_keunggulan', 1) == 1 ) :
$k_sub = get_option( 'edukarsa_keunggulan_subtitle', 'WHY CHOOSE US' );
$k_title = get_option( 'edukarsa_keunggulan_title', 'Keunggulan Program' );
?>
<section class="edukarsa-section edukarsa-keunggulan" style="padding-top: 20px; padding-bottom: 80px;">
<div class="container">
<div class="section-header text-center">
<?php if ( ! empty( $k_sub ) ) : ?><span class="badge-title text-white"><?php echo esc_html( $k_sub ); ?></span><?php endif; ?>
<h2 class="section-title text-white"><?php echo esc_html( $k_title ); ?></h2>
// --- SEKSI TENTANG KAMI / SAMBUTAN ---
case 'about':
if ( get_option('edukarsa_tampil_about', 1) == 1 ) :
?>
<section class="edukarsa-section edukarsa-sambutan">
<div class="container sambutan-grid">
<div class="sambutan-image-wrapper">
<div class="img-wrapper-portrait">
<?php $foto = get_option('edukarsa_foto_kepsek'); ?>
<?php if(!empty($foto)) : ?>
<img src="<?php echo esc_url($foto); ?>" alt="Kepala Sekolah">
<?php else : ?>
<div class="img-placeholder"><i>👤</i><span>Upload Foto Kepala Sekolah</span></div>
<?php endif; ?>
</div>
</div>
<div class="sambutan-content">
<span class="badge-title">ABOUT US</span>
<h2 class="section-title" style="margin-bottom: 6px;"><?php echo esc_html( get_option('edukarsa_nama_kepsek', 'Nama Kepala Sekolah') ); ?></h2>
<h4 class="section-subtitle-strong" style="color:var(--primary-color); margin-bottom:18px; font-size:17px; font-weight:700;"><?php echo esc_html( get_option('edukarsa_subtitle_about', 'Pimpinan Institusi') ); ?></h4>
<div class="sambutan-text"><?php echo wpautop( wp_kses_post( get_option('edukarsa_teks_sambutan') ) ); ?></div>
<a href="<?php echo esc_url( get_option('edukarsa_link_about', '#') ); ?>" class="btn-primary" style="margin-top: 5px;">Ketahui Lebih Lanjut</a>
</div>
</div>
<div class="keunggulan-grid">
<?php
$query_keunggulan = new WP_Query( array( 'post_type' => 'keunggulan', 'posts_per_page' => 9 ) );
if ( $query_keunggulan->have_posts() ) :
$nomor = 1;
while ( $query_keunggulan->have_posts() ) : $query_keunggulan->the_post();
</section>
<?php
endif;
break;
// --- SEKSI MILESTONE ---
case 'milestone':
if ( get_option('edukarsa_tampil_milestone', 1) == 1 ) :
$query_milestone = new WP_Query( array( 'post_type' => 'milestone', 'posts_per_page' => 4 ) );
if ( $query_milestone->have_posts() ) :
$m_sub = get_option( 'edukarsa_milestone_subtitle', 'REKAM JEJAK' );
$m_title = get_option( 'edukarsa_milestone_title', 'Milestone & Prestasi' );
?>
<section class="edukarsa-section edukarsa-milestones bg-light-blue" style="padding: 50px 0;">
<div class="container">
<?php if ( ! empty( $m_title ) ) : ?>
<div class="section-header text-center" style="margin-bottom: 30px;">
<?php if ( ! empty( $m_sub ) ) : ?><span class="badge-title"><?php echo esc_html( $m_sub ); ?></span><?php endif; ?>
<h2 class="section-title"><?php echo esc_html( $m_title ); ?></h2>
<hr class="title-underline">
</div>
<?php endif; ?>
<div class="milestone-grid text-center">
<?php
while ( $query_milestone->have_posts() ) : $query_milestone->the_post();
?>
<div class="keunggulan-card card-style">
<div class="keunggulan-number"><?php echo sprintf("%02d", $nomor); ?></div>
<div class="keunggulan-content-inner">
<h4><?php the_title(); ?></h4>
<div style="font-size: 14px; color: var(--text-muted); line-height: 1.6;">
<?php echo wp_trim_words( wp_strip_all_tags( get_the_content() ), 15, '...' ); ?>
<div class="milestone-item card-style" style="padding: 25px 20px;">
<h3 class="milestone-title" style="color: var(--primary-color); font-size: 34px; font-weight: 800; margin-bottom: 6px; line-height: 1;">
<?php the_title(); ?>
</h3>
<div class="milestone-desc" style="font-size: 13px; color: var(--text-muted); line-height: 1.5;">
<?php the_excerpt(); ?>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
</div>
</section>
<?php
endif;
endif;
break;
// --- SEKSI PROGRAM UNGGULAN ---
case 'program':
if ( get_option('edukarsa_tampil_program', 1) == 1 ) :
$prog_sub = get_option( 'edukarsa_program_subtitle', 'AKADEMIK & KARAKTER' );
$prog_title = get_option( 'edukarsa_program_title', 'Our Program' );
?>
<section class="edukarsa-section edukarsa-programs">
<div class="container">
<div class="section-header text-center">
<?php if ( ! empty( $prog_sub ) ) : ?><span class="badge-title"><?php echo esc_html( $prog_sub ); ?></span><?php endif; ?>
<h2 class="section-title"><?php echo esc_html( $prog_title ); ?></h2>
<hr class="title-underline">
</div>
<div class="program-grid">
<?php
$query_program = new WP_Query( array( 'post_type' => 'program', 'posts_per_page' => 3 ) );
if ( $query_program->have_posts() ) :
while ( $query_program->have_posts() ) : $query_program->the_post();
?>
<div class="program-card card-style text-center top-border-blue">
<div class="img-wrapper-landscape" style="margin-bottom: 18px;">
<?php if ( has_post_thumbnail() ) : ?>
<?php the_post_thumbnail( 'medium' ); ?>
<?php else: ?>
<div class="img-placeholder"><i>🏫</i><span>Gambar Program</span></div>
<?php endif; ?>
</div>
<h3 style="margin-bottom: 10px; font-size: 19px; color: var(--heading-color); font-weight: 700;">
<?php the_title(); ?>
</h3>
<div class="program-desc" style="margin-bottom: 20px; font-size: 14px; color: var(--text-muted); line-height: 1.6;">
<?php echo wp_trim_words( get_the_excerpt(), 15, '...' ); ?>
</div>
<a href="<?php the_permalink(); ?>" class="btn-outline-primary">Lihat Detail</a>
</div>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
<?php
endif;
break;
// --- SEKSI VIDEO ---
case 'video':
if ( get_option('edukarsa_tampil_video', 1) == 1 ) :
?>
<div class="parallax-section-wrapper" style="<?php echo $parallax_style; ?>">
<div class="parallax-overlay"></div>
<div class="parallax-content relative-z2">
<section class="edukarsa-section edukarsa-videos" style="padding: 60px 0;">
<div class="container video-grid">
<?php for($i=1; $i<=2; $i++) : ?>
<div class="video-item">
<?php $vid_thumb = get_option('edukarsa_video'.$i.'_thumb'); ?>
<a href="<?php echo esc_url( get_option('edukarsa_video'.$i.'_url', '#') ); ?>" target="_blank">
<div class="img-wrapper-video">
<?php if($vid_thumb) : ?>
<img src="<?php echo esc_url($vid_thumb); ?>" alt="Video">
<?php else: ?>
<div class="img-placeholder" style="background:#1e293b; color:#cbd5e1; border:none;"><i>▶️</i><span>Upload Thumbnail Video <?php echo $i; ?></span></div>
<?php endif; ?>
</div>
<?php if($vid_thumb) echo '<div class="play-btn">▶</div>'; ?>
</a>
</div>
<?php endfor; ?>
</div>
</section>
</div>
</div>
<?php
endif;
break;
// --- SEKSI KEUNGGULAN ---
case 'keunggulan':
if ( get_option('edukarsa_tampil_keunggulan', 1) == 1 ) :
$k_sub = get_option( 'edukarsa_keunggulan_subtitle', 'WHY CHOOSE US' );
$k_title = get_option( 'edukarsa_keunggulan_title', 'Keunggulan Program' );
?>
<div class="parallax-section-wrapper" style="<?php echo $parallax_style; ?>">
<div class="parallax-overlay"></div>
<div class="parallax-content relative-z2">
<section class="edukarsa-section edukarsa-keunggulan" style="padding: 60px 0 80px;">
<div class="container">
<div class="section-header text-center">
<?php if ( ! empty( $k_sub ) ) : ?><span class="badge-title text-white"><?php echo esc_html( $k_sub ); ?></span><?php endif; ?>
<h2 class="section-title text-white"><?php echo esc_html( $k_title ); ?></h2>
</div>
<div class="keunggulan-grid">
<?php
$query_keunggulan = new WP_Query( array( 'post_type' => 'keunggulan', 'posts_per_page' => 9 ) );
if ( $query_keunggulan->have_posts() ) :
$nomor = 1;
while ( $query_keunggulan->have_posts() ) : $query_keunggulan->the_post();
?>
<div class="keunggulan-card card-style">
<div class="keunggulan-number"><?php echo sprintf("%02d", $nomor); ?></div>
<div class="keunggulan-content-inner">
<h4><?php the_title(); ?></h4>
<div style="font-size: 14px; color: var(--text-muted); line-height: 1.6;">
<?php echo wp_trim_words( wp_strip_all_tags( get_the_content() ), 15, '...' ); ?>
</div>
</div>
</div>
<?php
$nomor++;
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
</div>
</div>
<?php
endif;
break;
// --- SEKSI CTA PENDAFTARAN ---
case 'cta':
if ( get_option('edukarsa_tampil_cta', 1) == 1 ) :
?>
<section class="edukarsa-cta-floating-section" style="padding: 50px 0;">
<div class="container">
<div class="cta-floating-card">
<div class="cta-floating-content">
<span class="badge-title" style="color: rgba(255,255,255,0.85);">PENDAFTARAN MAHASISWA BARU</span>
<h2 class="cta-floating-title"><?php echo esc_html( get_option('edukarsa_cta_title', 'Siap Bergabung Bersama Kami?') ); ?></h2>
</div>
<div class="cta-floating-action">
<a href="<?php echo esc_url( get_option('edukarsa_cta_btn_url', '#') ); ?>" class="btn-primary btn-light cta-btn-custom">
<?php echo esc_html( get_option('edukarsa_cta_btn_teks', 'Daftar Sekarang') ); ?> &raquo;
</a>
</div>
</div>
</div>
</section>
<?php
endif;
break;
// --- SEKSI LATEST NEWS ---
case 'news':
if ( get_option('edukarsa_tampil_news', 1) == 1 ) :
?>
<section class="edukarsa-section edukarsa-latest-news" style="padding-top: 50px; padding-bottom: 60px;">
<div class="container">
<div class="section-header text-center" style="margin-bottom: 35px;">
<h2 class="section-title"><?php echo esc_html( get_option('edukarsa_news_title', 'News & Update') ); ?></h2>
<hr class="title-underline">
</div>
<div class="news-grid">
<?php
$query_news = new WP_Query( array('post_type' => 'post', 'posts_per_page' => 6) );
if ( $query_news->have_posts() ) :
while ( $query_news->have_posts() ) : $query_news->the_post();
?>
<article class="news-card card-style">
<div class="img-wrapper-landscape" style="border-radius: 12px 12px 0 0;">
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail( 'medium' ); ?></a>
<?php else: ?>
<div class="img-placeholder"><i>📰</i><span>Gambar Berita</span></div>
<?php endif; ?>
</div>
<div class="news-content">
<h3 class="news-title"><a href="<?php the_permalink(); ?>" style="color:var(--heading-color);"><?php the_title(); ?></a></h3>
<div class="news-excerpt" style="color:var(--text-muted); font-size:14px; margin-bottom:15px;"><?php echo wp_trim_words( get_the_excerpt(), 15, '...' ); ?></div>
<a href="<?php the_permalink(); ?>" class="btn-outline-primary" style="margin-top: auto; align-self: flex-start;">Read More</a>
</div>
</article>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
<?php
endif;
break;
// --- SEKSI FAQ ---
case 'faq':
if ( get_option('edukarsa_tampil_faq', 1) == 1 ) :
$query_faq = new WP_Query( array( 'post_type' => 'faq', 'posts_per_page' => -1, 'order' => 'ASC' ) );
if ( $query_faq->have_posts() ) :
$faq_title = get_option( 'edukarsa_faq_title', 'Pertanyaan Umum' );
?>
<section class="edukarsa-section edukarsa-faq-section" style="padding: 50px 0 75px; background-color: #f8fafc;">
<div class="container">
<div class="section-header text-center" style="margin-bottom: 35px;">
<h2 class="section-title"><?php echo esc_html( $faq_title ); ?></h2>
<hr class="title-underline">
</div>
<div class="faq-accordion-container">
<?php
while ( $query_faq->have_posts() ) : $query_faq->the_post();
?>
<div class="faq-item">
<button type="button" class="faq-header">
<span class="faq-title"><?php the_title(); ?></span>
<span class="faq-icon">＋</span>
</button>
<div class="faq-body">
<div class="faq-body-content">
<?php the_content(); ?>
</div>
</div>
</div>
<?php
$nomor++;
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
<?php endif; ?>
</div>
</div>
<!-- 8. CTA SECTION (FLOATING CARD) -->
<?php if ( get_option('edukarsa_tampil_cta', 1) == 1 ) : ?>
<section class="edukarsa-cta-floating-section">
<div class="container">
<div class="cta-floating-card">
<div class="cta-floating-content">
<span class="badge-title" style="color: rgba(255,255,255,0.85);">PENDAFTARAN MAHASISWA BARU</span>
<h2 class="cta-floating-title"><?php echo esc_html( get_option('edukarsa_cta_title', 'Siap Bergabung Bersama Kami?') ); ?></h2>
</div>
<div class="cta-floating-action">
<a href="<?php echo esc_url( get_option('edukarsa_cta_btn_url', '#') ); ?>" class="btn-primary btn-light cta-btn-custom">
<?php echo esc_html( get_option('edukarsa_cta_btn_teks', 'Daftar Sekarang') ); ?> &raquo;
</a>
</div>
</div>
</div>
</section>
<?php endif; ?>
<!-- 9. LATEST NEWS (JUDUL BERSIH TANPA BADGE BERLEBIH) -->
<?php if ( get_option('edukarsa_tampil_news', 1) == 1 ) : ?>
<section class="edukarsa-section edukarsa-latest-news" style="padding-top: 50px; padding-bottom: 60px;">
<div class="container">
<div class="section-header text-center" style="margin-bottom: 35px;">
<h2 class="section-title"><?php echo esc_html( get_option('edukarsa_news_title', 'News & Update') ); ?></h2>
<hr class="title-underline">
</div>
<div class="news-grid">
<?php
$query_news = new WP_Query( array('post_type' => 'post', 'posts_per_page' => 6) );
if ( $query_news->have_posts() ) :
while ( $query_news->have_posts() ) : $query_news->the_post();
?>
<article class="news-card card-style">
<div class="img-wrapper-landscape" style="border-radius: 12px 12px 0 0;">
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail( 'medium' ); ?></a>
<?php else: ?>
<div class="img-placeholder"><i>📰</i><span>Gambar Berita</span></div>
<?php endif; ?>
</div>
<div class="news-content">
<h3 class="news-title"><a href="<?php the_permalink(); ?>" style="color:var(--heading-color);"><?php the_title(); ?></a></h3>
<div class="news-excerpt" style="color:var(--text-muted); font-size:14px; margin-bottom:15px;"><?php echo wp_trim_words( get_the_excerpt(), 15, '...' ); ?></div>
<a href="<?php the_permalink(); ?>" class="btn-outline-primary" style="margin-top: auto; align-self: flex-start;">Read More</a>
</div>
</article>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</section>
<?php endif; ?>
<!-- 10. SEKSI FAQ (JUDUL BERSIH TANPA BADGE REDUNDAN) -->
<?php
if ( get_option('edukarsa_tampil_faq', 1) == 1 ) :
$query_faq = new WP_Query( array( 'post_type' => 'faq', 'posts_per_page' => -1, 'order' => 'ASC' ) );
if ( $query_faq->have_posts() ) :
$faq_title = get_option( 'edukarsa_faq_title', 'Pertanyaan Umum' );
?>
<section class="edukarsa-section edukarsa-faq-section" style="padding: 50px 0 75px; background-color: #f8fafc;">
<div class="container">
<div class="section-header text-center" style="margin-bottom: 35px;">
<h2 class="section-title"><?php echo esc_html( $faq_title ); ?></h2>
<hr class="title-underline">
</div>
<div class="faq-accordion-container">
<?php
while ( $query_faq->have_posts() ) : $query_faq->the_post();
?>
<div class="faq-item">
<button type="button" class="faq-header">
<span class="faq-title"><?php the_title(); ?></span>
<span class="faq-icon">＋</span>
</button>
<div class="faq-body">
<div class="faq-body-content">
<?php the_content(); ?>
</div>
?>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
</div>
</section>
<?php
endif;
endif;
</section>
<?php
endif;
endif;
break;
// Mencegah eksekusi diluar blok template (White-list security)
default:
break;
}
}
?>
</main>