slowtwitch-news/front-page.php

<?php get_header() ?>

<main class="st-main st-main-grid">
    <!-- LATEST SECTION -->
    <section class="st-article-section-grid">
        <section class="st-article-section st-article-section-highlight">
            <h2 class="st-article-section-title">Latest <a href="<?php echo home_url() . '/articles'; ?>" class="st-article-section-category-link">></a></h2>
            <?php
                query_posts('showposts=1');
                if (have_posts()) : while (have_posts()) : the_post();
                    $category = get_the_category()[0];
                    $author = get_userdata( $post->post_author );
            ?>
            <article class="st-article-section-main-article">
                <a href="<?php the_permalink(); ?>" class="st-article-section-main-article__image-link">
                    <?php the_post_thumbnail(); ?>
                </a>
                <a href="<?php echo home_url($category->slug); ?>" class="st-article-section-main-article__category-link"><?php echo $category->name; ?></a>
                <a class="st-article-section-main-article__title" href="<?php the_permalink(); ?>">
                <h3><?php the_title(); ?></h3>
                </a>

                <p class="st-article-section-main-article__excerpt"><?php echo get_the_excerpt(); ?></p>
                <a href="<?php echo get_author_posts_url( $post->post_author ); ?>" class="st-article-section-main-article__author-link">by <?php echo $author->display_name; ?>, <?php the_time('F j, Y'); ?></a>
            </article>

            <?php
            endwhile;
            endif;

            wp_reset_postdata();

            $post_section_two_args = array(
                'showposts' => 5,
                'offset'      => 1,
                'orderby'     => 'post_date',
                'order'       => 'DESC',
                'post_type'   => 'post',
                'post_status' => 'publish'
            );
            query_posts($post_section_two_args);
            ?><div class="st-article-section-sub-article-stack"><?php
            if (have_posts()) : while (have_posts()) : the_post();
                    $category = get_the_category()[0];
                    $author = get_userdata( $post->post_author );
            ?>
            
            <article class="st-article-section-sub-article">
                <a href="<?php the_permalink(); ?>" class="st-article-section-sub-article__image-link">
                    <?php the_post_thumbnail(); ?>
                </a>
                <div class="st-article-section-sub-article__text-container">
                    <a href="<?php echo home_url($category->slug); ?>" class="st-article-section-sub-article__category-link"><?php echo $category->name; ?></a>
                    <a class="st-article-section-sub-article__title" href="<?php the_permalink(); ?>"><h3><?php the_title(); ?></h3></a>
                </div>
                </a>
            </article>
            <?php
                endwhile;
                endif; 
                wp_reset_postdata();
                ?>
            </div>
        </section>
        <section class="st-ad-section st-ad-section__top">
            <img src="/wp-content/themes/slowtwitch-news/assets/images/vertical-ad-mock.jpg" alt="Ad Mock" class="st-ad-section-vertical-ad">
            <a href="https://shop.slowtwitch.com/" class="st-ad-section-shop-card-link">
                <div class="st-ad-section-shop-card">
                    <h3 class="st-ad-section-shop-card__title">Save Big On Gear at the Slowtwitch Shop <span>></span></h3>
                    <img src="/wp-content/themes/slowtwitch-news/assets/images/slowtwitch-shop.png" alt="" class="st-ad-section-shop-card__img">
                </div>
            </a>
            <a href="https://shop.slowtwitch.com/" class="st-ad-section-shop-card-link">
                <div class="st-ad-section-shop-card">
                    <h3 class="st-ad-section-shop-card__title">Save Big On Gear at the Slowtwitch Shop <span>></span></h3>
                    <img src="/wp-content/themes/slowtwitch-news/assets/images/slowtwitch-shop.png" alt="" class="st-ad-section-shop-card__img">
                </div>
            </a>
        </section>
        <!-- TECH SECTION -->
        <section class="st-article-section st-article-section-bottom">
            <h2 class="st-article-section-title">Tech <a href="<?php echo home_url() . '/tech'; ?>" class="st-article-section-category-link">></a></h2>
            <?php
                $section_category = 'Tech';
                $post_section_three_featured_args = array(
                    'showposts' => 1,
                    'category_name' => $section_category,
                    'orderby'     => 'post_date',
                    'order'       => 'DESC',
                    'post_type'   => 'post',
                    'post_status' => 'publish'
                );
                query_posts($post_section_three_featured_args);
                if (have_posts()) : while (have_posts()) : the_post();
                    $category = get_the_category()[0];
                    $author = get_userdata( $post->post_author );
            ?>
            <article class="st-article-section-main-article">
                <a href="<?php the_permalink(); ?>" class="st-article-section-main-article__image-link">
                    <?php the_post_thumbnail(); ?>
                </a>
                <a href="<?php echo home_url($category->slug); ?>" class="st-article-section-main-article__category-link"><?php echo $category->name; ?></a>
                <a class="st-article-section-main-article__title" href="<?php the_permalink(); ?>">
                <h3><?php the_title(); ?></h3>
                </a>

                <p class="st-article-section-main-article__excerpt"><?php echo get_the_excerpt(); ?></p>
                <a href="<?php echo get_author_posts_url( $post->post_author ); ?>" class="st-article-section-main-article__author-link">by <?php echo $author->display_name; ?>, <?php the_time('F j, Y'); ?></a>
            </article>

            <?php
            endwhile;
            endif;

            wp_reset_postdata();

            $post_section_two_args = array(
                'showposts' => 5,
                'offset'      => 1,
                'category_name' => $section_category,
                'orderby'     => 'post_date',
                'order'       => 'DESC',
                'post_type'   => 'post',
                'post_status' => 'publish'
            );
            query_posts($post_section_two_args);
            ?><div class="st-article-section-sub-article-stack"><?php
            if (have_posts()) : while (have_posts()) : the_post();
                    $category = get_the_category()[0];
                    $author = get_userdata( $post->post_author );
            ?>
            <article class="st-article-section-sub-article">
                <a href="<?php the_permalink(); ?>" class="st-article-section-sub-article__image-link">
                    <?php the_post_thumbnail(); ?>
                </a>
                <div class="st-article-section-sub-article__text-container">
                    <a href="<?php echo home_url($category->slug); ?>" class="st-article-section-sub-article__category-link"><?php echo $category->name; ?></a>
                    <a class="st-article-section-sub-article__title" href="<?php the_permalink(); ?>"><h3><?php the_title(); ?></h3></a>
                </div>
                </a>
            </article>
            <?php
                endwhile;
                endif; ?>
            </div>
        </section>
        <section class="st-newsletter-signup">
            <!-- TODO: Insert flat section for newsletter signup -->
        </section>
    </section>
    <!-- REPEAT TOP PATTERN WITH NEW ARTICLES AND ADS -->
    
</main>

<?php get_footer() ?>