checkvorteil/blog.php
2025-06-16 15:57:37 +02:00

121 lines
4.9 KiB
PHP

<?php
// filepath: /home/michi/landingpages/checkvorteil/home.php
get_header(); ?>
<section class="hero" style="padding: 3rem 0 5rem;">
<div class="container">
<h1 class="gradient-text">CheckVorteil Blog</h1>
<p>Aktuelle Insights, Strategien und Tools für maximale Online-Business Performance</p>
</div>
</section>
<div class="container">
<section class="section">
<?php if (have_posts()) : ?>
<!-- Kategorie Filter -->
<div style="margin-bottom: 2rem; text-align: center;">
<div style="display: inline-flex; gap: 1rem; flex-wrap: wrap; justify-content: center;">
<a href="<?php echo get_permalink(get_option('page_for_posts')); ?>"
class="btn btn-secondary" style="padding: 0.5rem 1rem;">
Alle Artikel
</a>
<?php
$categories = get_categories(array('hide_empty' => true));
foreach ($categories as $category) :
?>
<a href="<?php echo get_category_link($category->term_id); ?>"
class="btn btn-secondary" style="padding: 0.5rem 1rem;">
<?php echo $category->name; ?> (<?php echo $category->count; ?>)
</a>
<?php endforeach; ?>
</div>
</div>
<!-- Blog Cards Grid -->
<div class="grid grid-3">
<?php while (have_posts()) : the_post();
$categories = get_the_category();
$read_time = ceil(str_word_count(get_the_content()) / 200); // ~200 Wörter/Min
?>
<article class="blog-card">
<!-- Featured Image -->
<?php if (has_post_thumbnail()) : ?>
<div class="blog-card-image">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('medium', array('style' => 'width: 100%; height: 200px; object-fit: cover; border-radius: 0.5rem 0.5rem 0 0;')); ?>
</a>
</div>
<?php endif; ?>
<div class="blog-card-content">
<!-- Kategorie Tag -->
<?php if (!empty($categories)) : ?>
<div style="margin-bottom: 0.75rem;">
<span class="category-tag"><?php echo esc_html($categories[0]->name); ?></span>
</div>
<?php endif; ?>
<!-- Titel -->
<h3 style="margin-bottom: 0.75rem;">
<a href="<?php the_permalink(); ?>" style="color: #ffffff; text-decoration: none;">
<?php the_title(); ?>
</a>
</h3>
<!-- Excerpt -->
<p style="color: #9ca3af; margin-bottom: 1rem; line-height: 1.5;">
<?php echo wp_trim_words(get_the_excerpt(), 20, '...'); ?>
</p>
<!-- Meta Info -->
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; font-size: 0.875rem; color: #6b7280;">
<span>
📅 <?php echo get_the_date('j. M Y'); ?>
</span>
<span>
🕒 <?php echo $read_time; ?> Min. Lesezeit
</span>
</div>
<!-- Read More Button -->
<a href="<?php the_permalink(); ?>" class="btn btn-primary" style="width: 100%; justify-content: center;">
Weiterlesen →
</a>
</div>
</article>
<?php endwhile; ?>
</div>
<!-- Pagination -->
<div style="margin-top: 3rem;">
<?php
the_posts_pagination(array(
'mid_size' => 2,
'prev_text' => '← Vorherige',
'next_text' => 'Nächste →',
'before_page_number' => '<span class="meta-nav screen-reader-text">Seite </span>',
));
?>
</div>
<?php else : ?>
<!-- Keine Posts -->
<div style="text-align: center; padding: 5rem 0;">
<h2 style="color: #9ca3af; margin-bottom: 1rem;">Noch keine Artikel verfügbar</h2>
<p style="color: #6b7280; margin-bottom: 2rem;">
Schreiben Sie den ersten Artikel im WordPress Admin!
</p>
<a href="<?php echo admin_url('post-new.php'); ?>" class="btn btn-primary">
✍️ Ersten Artikel schreiben
</a>
</div>
<?php endif; ?>
</section>
</div>
<?php get_footer(); ?>