Search
Close this search box.

Creating the Custom Template in the Genesis Framework

WordPress never ceases to toss at us some exceptionally useful features and capabilities that make our website development endeavor much more simpler and rewarding. Genesis happens to be another great addition to the ever growing list of WordPress goodies.
Table of Contents

Sponsored Ad

If you purchase through a link on our site, we may earn a commission.

WordPress never ceases to toss at us some exceptionally useful features and capabilities that make our website development endeavor much more simpler and rewarding. Genesis happens to be another great addition to the ever growing list of WordPress goodies.

Genesis, in its truest form, is a WordPress framework that can give you the free rein to glide past the restrictions or the lack of room that you may be encountering with the standard WordPress features. And there is a whole new level of diversity to Genesis, since it can handle a whole lot of facets of a WordPress website, which include its SEO structure, its security, its speed and so on.

Apart from its amazing features, Genesis is also very flexible in nature that gives you the freedom to make a number of customizations, based on your very specific requirements. In the following section, I am going to throw light on how you can create a custom template in the Genesis framework. The ensuing steps are easy to comprehend and understand.

Here We Go

To begin with, we will create a usual WordPress page that is defined by the standard features we have come to know of a typical WordPress setup. And then, we will add the page to the list of posts in respect to the categories they belong to.

As an example, let’s say we already have a page by the name of Genesis Movie Genre and there is also some content on the website. There is also a category of the same name on the website which shows the best movies of different genres respectively.

Now, what we intend to create here is a custom page template on the Genesis Movie Genres page that enlists the posts in Genesis Movie Genres category.

You might say that we also have the inbuilt Genesis archive at our behest, but the challenge with using it is the fact that we can’t find the suitable enough custom fields in the post editor that is meant to be used to align posts in category archives.

Let’s Create the Page Template

Now that we already have a page that is populated with certain posts and also a category, our default template looks like the one in the picture:

Our main purpose here is to extend the functionality above and beyond the defaults.

Let’s Create the Template File

Moving forward, we will create a new file that will be labelled with any name of our choice. Now that there is a page template with us, let’s use for Genesis Movie Genres. We will name it movie-genre-template.php

Here is the code for our custom page template:

<?php

/**

* Template Name: Movie Genres Template

* Description: Used as a page template to show page contents, followed by a loop

* through the “Genesis Movie Genres” category

*/

// Add our custom loop

add_action( ‘genesis_loop’, ‘cd_goh_loop’ );

function cd_goh_loop() {

$args = array(

‘category_name’ => ‘genesis-movie-genres’, // replace with your category slug

‘orderby’Β Β Β Β Β Β  => ‘post_date’,

‘order’Β Β Β Β Β Β Β Β  => ‘DESC’,

‘posts_per_page’=> ’10’, // overrides posts per page in theme settings

);

$loop = new WP_Query( $args );

if( $loop->have_posts() ) {

// loop through posts

while( $loop->have_posts() ): $loop->the_post();

$video_id = esc_attr( genesis_get_custom_field( ‘cd_youtube_id’ ) );

$video_thumbnail = ‘<img src=”http://img.youtube.com/vi/’ . $video_id . ‘/0.jpg” alt=”” />’;

$video_link = ‘http://www.youtube.com/watch?v=’ . $video_id;

echo ‘<div class=”one-third first”>’;

echo ‘<a href=”‘ . $video_link . ‘” target=”_blank”>’ . $video_thumbnail . ‘</a>’;

echo ‘</div>’;

echo ‘<div class=”two-thirds”>’;

echo ‘<h4>’ . get_the_title() . ‘</h4>’;

echo ‘<p>’ . get_the_date() . ‘</p>’;

echo ‘<p><a href=”‘ . $video_link . ‘” target=”_blank”>Watch It</a> | <a href=”‘ . get_permalink() . ‘” target=”_blank”>Show Notes</a></p>’;

echo ‘</div>’;

endwhile;

}

wp_reset_postdata();

}

Β genesis();

What you should note above is that we are not doing away completely with the defaults. We are only making some modifications and after that, we are making use of a query for extracting posts from the genesis-movie-genres category. We then sort the posts by the post date.

The next step involves looping through the posts which the query has returnedΒ  and simultaneously, we printing certain elements

We also need to upload the above template in the WordPress theme we have, and it will be uploaded in the active child theme.

Using This Custom Template

Now, you need to access the page where we have to use the custom page template and there, head to the Page Attributes drop down menu. In this drop down, you can find the custom page template you created above. Save the page, close it and then reopen it. There you are, with the new custom template added to the options.

That’s all. Thus, against the popular opinion, making tweaks in the Genesis framework is a breeze. Do let us know in the comments if you have done some experiments of your own in Genesis.

Alyona is a WordPress enthusiast, focused on sharing interesting things she comes across during her work with this great CMS. She loves exploring new destinations and maintains a travel blog at www.alyonatravels.com

Sponsored Ad

If you purchase through a link on our site, we may earn a commission.

All suggestions are anonymous.

More from our blog...

8 Responses

  1. I use “TemplateToaster” framework for building templates and themes . Never used Genesis.

  2. Hi Emily,
    Very nice article. You have explained the ‘Genesis Framework’ in a professional manner. I want to know can I edit any other theme with this Framework?

  3. The code looks familiar. Glad it was helpful. πŸ™‚

    BTW – You can create your own function name to whatever suits your code best. Nothing meaningful about ‘cd_goh_loop’ in this case. Maybe ‘custom_movie_loop’ or similar to make your code more self-documenting.

Post a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Stay updated with WP Mayor's newsletter showcase every week

Stay on top of every new WordPress innovation and latest launches. Receive all our fresh product reviews and expert guides directly in your inbox.

Hosting Survey 2024

Are you happy with your hosting provider or are you over-paying for too little? Have your say below!

"*" indicates required fields

What's the main reason you picked this host?*
How happy are you with your host?*

OPTIONAL: If you'd like to receive the results of this survey, please enter your details below.