MEET SITKA | A super-customizable modern WP theme!

Okay
  Print

Add Category Index to the Homepage or Blog in Hawthorn

Hawthorn offers a Category Index Shortcode which you can use to display beautiful rows of grid items highlighting your latest posts or even a particular category of posts. 

The shortcode is generally used to add the category index to a post or static page by copying and pasting its shortcode into the text editor box. 

To learn how to create a Category Index and insert it into a post or page's body, you can follow the instructions outlined in this article: Hawthorn's Category Index Shortcode.


Alternatively, if you wish to display a Category Index on your homepage or blog page which contains your published latest post feed, this is also possible by inserting a bit of code into a theme's "index.php" file ( the theme file related to your post feed page). 

We'll go through the process below.

 



First, create your desired Category Index Shortcode (for instructions on how to do this, please reference the tutorial article linked above). This may include a title, which category in particular you'd wish to display, the number of grid posts for the row, etc. 

For example, it may look like this:

[hawthorn_index title="Our latest adventures" cat="travels" amount="3" cols="3"]


Next, navigate to WP Dashboard > Appearance > Editor > and open up the theme file titled "index.php". 

On Line 11, you'll see this line of code:

<div id="main" <?php if(get_theme_mod('hawthorn_sidebar_homepage') == true) : ?>class="fullwidth"<?php endif; ?>>


On the blank line directly BELOW this line of code, you can copy and paste the following code:

<div class="post-entry">
    <?php echo do_shortcode('YOUR-CATEGORY-INDEX-SHORTCODE-HERE'); ?>
</div>


Please remember to replace the dummy YOUR-CATEGORY-INDEX-SHORTCODE-HERE on the second line of that code with your own category index shortcode. When finished, using our example above, it will look similar to this:


<div class="post-entry">
    <?php echo do_shortcode('[hawthorn_index title="Our latest adventures" cat="travel" amount="3" cols="3"]'); ?>
</div>




This will have your Index Shortcode display above your post feed. 




Note: If you would like to add more than 1 category index shortcode stacked upon each other, you can use the following template. Just be sure to add a separate category index shortcode onto each of the "php echo do_shortcode" lines. 

<div class="post-entry">
    <?php echo do_shortcode('[hawthorn_index title="Featured Desserts for Autumn" cat="desserts" amount="3" cols="3" display_date="no" display_title="yes"]'); ?>
    <?php echo do_shortcode('[hawthorn_index title="Featured Vegetarian Recipes" cat="vegetarian" amount="4" cols="4" display_date="no" display_title="yes"]'); ?>
</div>


Save changes to the file when finished.