feat(layout): menambahkan sidebar native dan layout 2 kolom pada single.php

This commit is contained in:
Mas Budi Kusuma
2026-09-15 21:08:52 +07:00
parent 937613ac25
commit 226e09f2b1
4 changed files with 177 additions and 83 deletions
+52 -41
View File
@@ -1,55 +1,66 @@
<?php
/**
* Template untuk menampilkan satu artikel/postingan penuh.
* Template untuk menampilkan satu artikel/postingan penuh dengan Sidebar.
*/
get_header();
?>
<main id="primary" class="site-main" style="padding: 60px 20px; max-width: 900px; margin: 0 auto; min-height: 70vh;">
<?php
while ( have_posts() ) :
the_post();
?>
<main id="primary" class="site-main" style="padding: 50px 0; min-height: 75vh; background-color: #f8fafc;">
<div class="container single-layout-wrapper">
<!-- Kolom Konten Utama -->
<article id="post-<?php the_ID(); ?>" <?php post_class( 'card-style' ); ?> style="padding: 40px;">
<header class="entry-header text-center" style="margin-bottom: 30px;">
<h1 class="entry-title" style="color: var(--heading-color); margin-bottom: 15px; font-weight: 800; font-size: 32px;">
<?php the_title(); ?>
</h1>
<div class="entry-meta" style="color: #64748b; font-size: 14px;">
<span style="margin-right: 15px;">📅 <?php echo get_the_date(); ?></span>
<span>👤 <?php the_author(); ?></span>
</div>
</header>
<?php if ( has_post_thumbnail() ) : ?>
<div class="post-thumbnail" style="margin-bottom: 40px; border-radius: var(--radius); overflow: hidden;">
<?php the_post_thumbnail( 'full', array( 'style' => 'width: 100%; height: auto; display: block;' ) ); ?>
</div>
<?php endif; ?>
<div class="entry-content" style="line-height: 1.8; color: var(--text-color); font-size: 16px;">
<?php
the_content();
// Paginasi jika artikel dipecah menjadi beberapa halaman dengan tag <!--nextpage-->
wp_link_pages( array(
'before' => '<div class="page-links" style="margin-top: 30px; font-weight: bold;">' . esc_html__( 'Halaman:', 'edukarsa' ),
'after' => '</div>',
) );
<?php
while ( have_posts() ) :
the_post();
?>
</div>
<header class="entry-header" style="margin-bottom: 25px;">
<h1 class="entry-title" style="color: var(--heading-color); margin-bottom: 15px; font-weight: 800; font-size: 30px; line-height: 1.3;">
<?php the_title(); ?>
</h1>
<div class="entry-meta" style="color: #64748b; font-size: 14px; display: flex; gap: 20px; flex-wrap: wrap;">
<span>📅 <?php echo get_the_date(); ?></span>
<span>👤 <?php the_author(); ?></span>
<?php if ( has_category() ) : ?>
<span>📁 <?php the_category( ', ' ); ?></span>
<?php endif; ?>
</div>
</header>
<footer class="entry-footer" style="margin-top: 40px; padding-top: 20px; border-top: 1px solid #eee; text-align: center;">
<a href="<?php echo esc_url( get_permalink( get_option( 'page_for_posts' ) ) ); ?>" class="btn-outline-primary">
&laquo; Kembali ke Daftar Berita
</a>
</footer>
<?php if ( has_post_thumbnail() ) : ?>
<div class="post-thumbnail" style="margin-bottom: 30px; border-radius: var(--radius); overflow: hidden;">
<?php the_post_thumbnail( 'full', array( 'style' => 'width: 100%; height: auto; display: block;' ) ); ?>
</div>
<?php endif; ?>
<div class="entry-content" style="line-height: 1.85; color: var(--text-color); font-size: 16px;">
<?php
the_content();
wp_link_pages( array(
'before' => '<div class="page-links" style="margin-top: 30px; font-weight: bold;">' . esc_html__( 'Halaman:', 'edukarsa' ),
'after' => '</div>',
) );
?>
</div>
<footer class="entry-footer" style="margin-top: 40px; padding-top: 20px; border-top: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px;">
<a href="<?php echo esc_url( get_permalink( get_option( 'page_for_posts' ) ) ); ?>" class="btn-outline-primary">
&laquo; Kembali ke Daftar Berita
</a>
<div class="post-tags" style="font-size: 13px;">
<?php the_tags( '<span style="color:#64748b;">Tag: </span>', ', ', '' ); ?>
</div>
</footer>
<?php
endwhile;
?>
</article>
<?php
endwhile;
?>
<!-- Kolom Sidebar -->
<?php get_sidebar(); ?>
</div>
</main>
<?php