Homepage Sorter - Adding Hero Post

This tutorial goes over how to add the markup to display the latest blog post drag and drop module on the homepage in a Bootstrap Jumbotron. Steps Open the home-heropost.php file in the /includes/ directory and make the following changes:

<?php
/**
 * File used for homepage hero post module
 *
 * @package WordPress
 */
?>


<div class="jumbotron homehero">

	<?php 
			// the query
			$homepost = new WP_Query('posts_per_page=1&ignore_sticky_posts=1'); ?>


			<?php while ( $homepost->have_posts() ) : $homepost->the_post(); ?>

			<?php global $more; $more = 0; ?>

			<?php
					/* Include the Post-Format-specific template for the content.
					 * If you want to override this in a child theme, then include a file
					 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
					 */
					get_template_part( 'content', get_post_format() );
				?>

			<?php endwhile; ?>

</div>

<?php

/**

* File used for homepage hero post module

* @package WordPress

<?php

// the query

$homepost = new WP_Query('posts_per_page=1&ignore_sticky_posts=1'); ?>

<?php while ( $homepost->have_posts() ) : $homepost->the_post(); ?>

<?php global $more; $more = 0; ?>

<?php

/* Include the Post-Format-specific template for the content.

* If you want to override this in a child theme, then include a file

* called content-___.php (where ___ is the Post Format name) and that will be used instead.

get_template_part( 'content', get_post_format() );

<?php endwhile; ?>

</div>

Open the style.css file and add a new Homepage section with the following code: […]

You need to have an active subscription to view this content.

Homepage Sorter – Adding Hero Post

Login

Stay Updated!