IT Nota

  • Home
  • How To
  • .NET
  • WordPress
  • Contact
You are here: Home / How To / How to Add Pagination on Genesis Lifestyle Theme Front Page

How to Add Pagination on Genesis Lifestyle Theme Front Page

Genesis Lifestyle Pro Theme
As an update to their top seller Genesis Theme, StudioPress released a new Lifestyle Pro Theme with responsive design and HTML5. If you’re a member of My StudioPress, then you’ll have access to setup the theme exactly as it looks like in a demo, which is already very good to begin with.

I really like how the front page was setup, however I also want it to function as my main blog along with navigation links at the bottom of the content (see picture). Genesis standard loop is still going to be used for page two and beyond so they look like a normal blog page.

In order to achieve this, we need to modify the front-page.php file. The modification was based on the code from Bill Erickson for creating custom loop with pagination.

See the modified front-page.php below with all changes highlighted.

<?php
/**
 * This file adds the Home Page to the Lifestyle Pro Theme.
 *
 * @author StudioPress
 * @package Lifestyle Pro
 * @subpackage Customizations
 */

add_action( 'genesis_meta', 'lifestyle_home_genesis_meta' );
/**
 * Add widget support for homepage. If no widgets active, display the default loop.
 *
 */
function lifestyle_home_genesis_meta() {

	if ( !is_paged() ) {

		if ( is_active_sidebar( 'home-top' ) || is_active_sidebar( 'home-middle' ) || is_active_sidebar( 'home-bottom-left' ) || is_active_sidebar( 'home-bottom-right' ) ) {
	
			// Force content-sidebar layout setting
			add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_content_sidebar' );
	
			// Add lifestyle-pro-home body class
			add_filter( 'body_class', 'lifestyle_body_class' );
	
			// Remove the default Genesis loop
			remove_action( 'genesis_loop', 'genesis_do_loop' );
	
			// Add homepage widgets
			add_action( 'genesis_loop', 'lifestyle_homepage_widgets' );

		}
	}
}

function lifestyle_body_class( $classes ) {

	$classes[] = 'lifestyle-pro-home';
	return $classes;
	
}

function lifestyle_homepage_widgets() {
	
	genesis_widget_area( 'home-top', array(
		'before' => '<div class="home-top widget-area">',
		'after'  => '</div>',
	) );
	
	genesis_widget_area( 'home-middle', array(
		'before' => '<div class="home-middle widget-area">',
		'after'  => '</div>',
	) );
	
	if ( is_active_sidebar( 'home-bottom-left' ) || is_active_sidebar( 'home-bottom-right' ) ) {

		echo '<div class="home-bottom">';

		genesis_widget_area( 'home-bottom-left', array(
			'before' => '<div class="home-bottom-left widget-area">',
			'after'  => '</div>',
		) );

		genesis_widget_area( 'home-bottom-right', array(
			'before' => '<div class="home-bottom-right widget-area">',
			'after'  => '</div>',
		) );
		
		echo '</div>';	
	}

	// Based on https://gist.github.com/billerickson/3218052
	global $post;
	// arguments, adjust as needed
	$args = array(
				'post_type' => 'post',
				'posts_per_page' => get_option( 'posts_per_page' ),
				'post_status' => 'publish',
				'paged' => get_query_var( 'paged' )
			);

	/*
	Overwrite $wp_query with our new query.
	The only reason we're doing this is so the pagination functions work,
	since they use $wp_query. If pagination wasn't an issue,
	use: https://gist.github.com/3218106
	*/
	
	global $wp_query;
	$wp_query = new WP_Query( $args );
		 
	if ( have_posts() ) :
		while ( have_posts() ) : the_post();
		endwhile;
		
		do_action( 'genesis_after_endwhile' );			
	endif;

	wp_reset_query();
}

genesis();

The pagination on the front page should look like the picture below.

Genesis Lifestyle Pro Theme Custom Pagination

Lifestyle Pro is definitely worth checking out due to its capability as one of the modern responsive WordPress themes, its elegant look, and easy customization.

Caveat

You need to pay attention on the number posts to show on the Admin settings. Since the way it’s setup on the front page is showing 8 posts at a time, you need to make sure the setting is also for 8 posts at a time so the second page of the blog doesn’t skip any postings.

WordPress Admin Setup (Reading)

January 13, 2014 Filed Under: How To, WordPress Tagged With: Genesis Framework

Comments

  1. Chuck says

    February 25, 2014 at 11:20 pm

    You have saved me hours of time! I’d looked all over the net, and been banging my head on the wall trying to get my code to work. Thank you!!

    Reply
    • platt says

      March 2, 2014 at 9:35 pm

      Hi Chuck, glad to hear it worked for you. 🙂

      Reply
  2. Jamaise Wilson says

    March 21, 2014 at 7:17 pm

    Thank you so much! So very much. I had just accepted that I would never have page navigation. Nope, not the case.

    Reply
    • platt says

      March 21, 2014 at 8:20 pm

      You’re welcome Jamaise and thanks for the feedback.

      Reply
  3. Marie says

    April 6, 2014 at 7:54 pm

    Thank you so much for posting this! I was scared to change the PHP but I can’t believe how easy it was.

    Reply
    • platt says

      April 10, 2014 at 7:55 am

      Hi Marie, thanks for letting me know. It’s always good to hear that. 🙂

      Reply
  4. Joe says

    April 14, 2014 at 4:06 pm

    Hi,

    Just one question with this theme.. I would think the pagination would have the “next page” of posts look much like the front page instead of going to a content archive look without images? Here’s a link to the blog in question:

    http://blog.boulderviewapartments.com/

    Please note, I modified the functions.php file to only show 5 posts as it works better for the desired look/layout.

    Joe

    Reply
    • platt says

      April 14, 2014 at 10:51 pm

      Hi Joe,

      The front page setup employs the use of widgets that you can follow from the Themes Setup page. For any other specific modifications beyond their demo, it’s best to use their community forums.

      Hope it helps.

      Reply
  5. Pam says

    October 8, 2014 at 4:39 am

    I was able to modify the php file and the navigation now shows at the bottom of the home page but when I click on page 2, 3, etc. the home page just reappears again — it isn’t changing the pages. Any tips? Thanks!

    Reply
    • platt says

      October 12, 2014 at 4:33 pm

      Hi Pam,

      Sorry for the late response, but I checked your website, it seems that you already got it figured out? Thanks for stopping by.

      Reply
  6. Laura says

    March 11, 2015 at 5:49 pm

    This page seems to be the answer to my problem (of lack of home page navigation), and I’d love to follow the directions. However, I am not seeing any highlighting anywhere in the code, to see where the changes need to be. Is it a color or bolded? It all looks the same to me.
    Hoping for a quick response. Thanks!

    Reply
    • platt says

      March 11, 2015 at 6:08 pm

      Hi Laura,

      I think there was a caching issue earlier that didn’t refresh the highlighting. Please try to clear your cache on your browser by pressing CTRL-F5 and you should see the highlights. Thanks.

      Reply
      • Laura / House of Joyful Noise says

        March 13, 2015 at 10:46 am

        Dear Platt –
        Yes, I do see the highlighting now. Thank you. Now I just need courage. LOL I’ve got all of the necessary windows open, but I’m terrified to make the changes and bring my site down! Nerve-wracking stuff. :/
        Thanks for your reply.

        Reply
        • platt says

          March 13, 2015 at 8:45 pm

          As long as you back up everything you should be fine. 🙂

          Reply
  7. Laura / House of Joyful Noise says

    March 13, 2015 at 11:56 am

    Well I got brave, was ever so careful, and got the whole parson error; syntax error, anyway. I restored it, after trying to tweak for awhile. I want the home page pagination bad! The problem seemed to be in the area of lines 33 (33-35). Does the spacing on each line, with those bracket symbols, have to be exact? Are we adding one? I tried to visually match it. My numbered lines are off from the above anyway. But I was sure to show a skipped line when there was one, etc. I hate to give up.

    Reply
    • platt says

      March 13, 2015 at 7:57 pm

      Laura, I suggest you copy the source and paste it on your text editor and when you’re editing something like this, it helps to use something other than Notepad (Notepad++ would be good) as it can help you with the closing brackets.

      Yes, all highlighted lines are addition to the original code. The spacing doesn’t have to be exact, but the number of closing brackets have to match the opening.

      Actually, if you don’t have any other customization on your front-page.php, you can copy this whole code and use it as your front page.

      Reply
  8. vivek kumar says

    August 18, 2015 at 3:35 am

    Thanks for the code sharing

    Reply
    • platt says

      August 18, 2015 at 4:55 pm

      You’re very welcome Vivek. Thanks for stopping by. 🙂

      Reply
  9. imti says

    September 8, 2015 at 6:40 am

    Thanks. you are my hero…

    Reply
    • platt says

      September 22, 2015 at 9:41 pm

      You’re welcome imti.

      Reply
  10. Bill Hibbler says

    September 21, 2016 at 12:28 am

    Hi, thank you for putting this tutorial up. I’m running into a problem which I think is because I’m using Metro Pro rather than the Lifestyle theme. I got it to work at one point but one of the widgets was off. After trying a few things, I just kept getting error messages.

    Can you help? Here’s the original front page php:

    ”,
    ‘after’ => ”,
    ) );

    if ( is_active_sidebar( ‘home-middle-left’ ) || is_active_sidebar( ‘home-middle-right’ ) ) {

    echo ”;

    genesis_widget_area( ‘home-middle-left’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    genesis_widget_area( ‘home-middle-right’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    echo ”;

    }

    genesis_widget_area( ‘home-bottom’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    }

    genesis();

    As you can see, the widget area is a little different than Lifestyle. The last section for Home Bottom isn’t followed by an echo tag as it is in your example. I’m not sure if you’re still monitoring comments but any help would be greatly appreciated. Here’s the temp site where I’m working on this: http://www.billhibbler.gigtime.com/

    Reply

Leave a Reply to platt Cancel reply

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

Categories

  • .NET
  • Coding
  • Cybersecurity
  • Database
  • How To
  • Internet
  • Multimedia
  • Photography
  • Programming
  • Resources
  • Review
  • WordPress
  • Writing

Recent Posts

  • F#: Seq, List, Array, Map, Set. Which One to Use?
  • How to Get Table Definition in SQL Server
  • Why You Need to Use a VPN
  • How to Use Custom Color in SSMS Using Redgate SQL Prompt
  • How to Install Python on Windows Server
WP Engine Fastest Managed WordPress Platform

Recent Posts

  • F#: Seq, List, Array, Map, Set. Which One to Use?
  • How to Get Table Definition in SQL Server
  • Why You Need to Use a VPN
  • How to Use Custom Color in SSMS Using Redgate SQL Prompt
  • How to Install Python on Windows Server
  • RSS

Tags

.NET Core Access Adobe AdSense Amazon ASP.NET Cdonts Dll Classic ASP Code Editor Connect-It Copywriting ETL FSharp Genesis Framework Git Google HP Asset Manager HTML HTML5 Hugo IIS Information Security Internet Internet Information Services iOS Linux macOS Microsoft Microsoft SQL Server MVC PHP Simple Mail Transfer Protocol Smtp Server Social Media SQL SQL Server SSIS SSMS SSRS VPN Windows Windows 8 Windows 10 Windows 2012 Windows Server

Copyright © 2011-2021 IT Nota. All rights reserved. Terms of Use | Privacy Policy | Disclosure