Add pagination to this Wordpress Home - php

Question

I Guys! I'm working on a pagination for this theme homepage. The original code is:
<?php
/**
Blog
**/
$display_count = get_theme_mod('wpex_home_blog_count', '30');
$wpex_query = new WP_Query(
array(
'post_type' => 'post',
'posts_per_page' => $display_count,
'no_found_rows' => true,
)
);
if ( $wpex_query->posts && '0' != $display_count ) { ?>
<div id="homepage-blog" class="clr">
<h2 class="heading"><span><?php _e( 'From The Blog', 'wpex' ); ?></span></h2>
<?php $wpex_count=0; ?>
<?php foreach( $wpex_query->posts as $post ) : setup_postdata( $post ); ?>
<?php $wpex_count++; ?>
<article class="recent-blog-entry clr col span_1_of_3 col-<?php echo $wpex_count; ?>">
<?php
// Display post thumbnail
if ( has_post_thumbnail() ) { ?>
<div class="recent-blog-entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>">
<img src="<?php echo wpex_get_featured_img_url(); ?>" alt="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>" />
</a>
</div><!-- .recent-blog-entry-thumbnail -->
<?php } ?>
<header>
<h3 class="recent-blog-entry-title"><?php the_title(); ?></h3>
<?php
// Display post meta details
wpex_post_meta() ;?>
</header>
<div class="recent-blog-entry-content entry clr">
<?php wpex_excerpt( 18, false ); ?>
</div><!-- .recent-blog-entry-content -->
</article><!-- .recent-blog -->
<?php if ( $wpex_count == '3' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endforeach; ?>
</div><!-- #homepage-portfolio -->
<?php } ?>
What I did is, I changed it to
<div id="homepage-blog" class="clr">
<h2 class="heading"><span><?php _e( 'From The Blog', 'wpex' ); ?></span></h2>
<?php $wpex_count=0; ?>
<?php
$temp = $wp_query; $wp_query= null;
$wp_query = new WP_Query(); $wp_query->query('showposts=4' . '&paged='.$paged);
while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
<?php $wpex_count++; ?>
<article class="recent-blog-entry clr col span_1_of_3 col-<?php echo $wpex_count; ?>">
<?php
// Display post thumbnail
if ( has_post_thumbnail() ) { ?>
<div class="recent-blog-entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>">
<img src="<?php echo wpex_get_featured_img_url(); ?>" alt="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>" />
</a>
</div><!-- .recent-blog-entry-thumbnail -->
<?php } ?>
<header>
<h3 class="recent-blog-entry-title"><?php the_title(); ?></h3>
<ul class="post-meta clr">
<li class="meta-date">
<?php _e('Posted on','wpex'); ?>
<span class="meta-date-text"><?php echo get_the_date(); ?></span>
</li>
</ul>
</header>
<div class="recent-blog-entry-content entry clr">
<?php wpex_excerpt( 18, false ); ?>
</div><!-- .recent-blog-entry-content -->
</article><!-- .recent-blog -->
<?php if ( $wpex_count == '3' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endwhile; ?>
</div>
<?php wp_pagenavi();?>
<?php wp_reset_postdata(); ?>
</article>
This seems to work on the first page, but when i go to page 2, it gives an copy after copy after copy of the whole page, like an infinate page one. That's not how it should work.
Any ideas what goes wrong here? Does this make any sense to you?
EDIT:
I tried the following. Right now the first page looks good, but when i press the second page on the pagination, it outputs the same as the first.
<?php
$args = array(
'paged' => (get_query_var('paged') ? get_query_var('paged') : 1),
'posts_per_page' => 4
);
query_posts($args);
?>
<div id="homepage-blog" class="clr">
<h2 class="heading"><span><?php _e( 'From The Blog', 'wpex' ); ?></span></h2>
<?php $wpex_count=0; ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php $wpex_count++; ?>
<article class="recent-blog-entry clr col span_1_of_3 col-<?php echo $wpex_count; ?>">
<?php
// Display post thumbnail
if ( has_post_thumbnail() ) { ?>
<div class="recent-blog-entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>">
<img src="<?php echo wpex_get_featured_img_url(); ?>" alt="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>" />
</a>
</div><!-- .recent-blog-entry-thumbnail -->
<?php } ?>
<header>
<h3 class="recent-blog-entry-title"><?php the_title(); ?></h3>
<ul class="post-meta clr">
<li class="meta-date"><?php _e('Posted on','wpex'); ?> <span class="meta-date-text"><?php echo get_the_date(); ?></span> </li>
</ul>
</header>
<div class="recent-blog-entry-content entry clr">
<?php wpex_excerpt( 18, false ); ?>
</div><!-- .recent-blog-entry-content -->
</article><!-- .recent-blog -->
<?php if ( $wpex_count == '3' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endwhile; ?>
<?php wp_pagenavi();?>
</div><!-- #homepage-portfolio -->
<?php endif; ?>
<?php wp_reset_query(); ?>
</article><!-- #post -->
<?php endwhile; ?>
Whole original code:
<div id="primary" class="content-area clr">
<div id="content" class="site-content" role="main">
<?php while ( have_posts() ) : the_post(); ?>
<article class="homepage-wrap clr">
<?php
/**
Post Content
**/ ?>
<?php if ( get_the_content() !== '' ) { ?>
<div id="homepage-content" class="entry clr">
<?php the_content(); ?>
</div><!-- .entry-content -->
<?php } ?>
<?php
/**
Features
**/
$wpex_query = new WP_Query(
array(
'order' => 'ASC',
'orderby' => 'menu_order',
'post_type' => 'features',
'posts_per_page' => '-1',
'no_found_rows' => true,
)
);
if ( $wpex_query->posts ) { ?>
<div id="homepage-features" class="clr">
<?php $wpex_count=0; ?>
<?php foreach( $wpex_query->posts as $post ) : setup_postdata( $post ); ?>
<?php $wpex_count++; ?>
<?php get_template_part( 'content-features', get_post_format() ); ?>
<?php if ( $wpex_count == '4' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endforeach; ?>
</div><!-- #homepage-features -->
<?php } ?>
<?php wp_reset_postdata(); ?>
<?php
/**
Portfolio
**/
$display_count = get_theme_mod('wpex_home_portfolio_count', '8');
$wpex_query = new WP_Query(
array(
'post_type' => 'portfolio',
'posts_per_page' => $display_count,
'no_found_rows' => true,
'tax_query' => wpex_home_portfolio_taxonomy(),
)
);
if ( $wpex_query->posts && '0' != $display_count ) { ?>
<div id="homepage-portfolio" class="clr">
<h2 class="heading"><span><?php _e( 'Recent Work', 'wpex' ); ?></span></h2>
<?php $wpex_count=0; ?>
<?php foreach( $wpex_query->posts as $post ) : setup_postdata( $post ); ?>
<?php $wpex_count++; ?>
<?php get_template_part( 'content-portfolio', get_post_format() ); ?>
<?php if ( $wpex_count == '4' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endforeach; ?>
</div><!-- #homepage-portfolio -->
<?php } ?>
<?php wp_reset_postdata(); ?>
<?php
/**
Blog
**/
$display_count = get_theme_mod('wpex_home_blog_count', '30');
$wpex_query = new WP_Query(
array(
'post_type' => 'post',
'posts_per_page' => $display_count,
'no_found_rows' => true,
)
);
if ( $wpex_query->posts && '0' != $display_count ) { ?>
<div id="homepage-blog" class="clr">
<h2 class="heading"><span><?php _e( 'From The Blog', 'wpex' ); ?></span></h2>
<?php $wpex_count=0; ?>
<?php foreach( $wpex_query->posts as $post ) : setup_postdata( $post ); ?>
<?php $wpex_count++; ?>
<article class="recent-blog-entry clr col span_1_of_3 col-<?php echo $wpex_count; ?>">
<?php
// Display post thumbnail
if ( has_post_thumbnail() ) { ?>
<div class="recent-blog-entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>">
<img src="<?php echo wpex_get_featured_img_url(); ?>" alt="<?php echo esc_attr( the_title_attribute( 'echo=0' ) ); ?>" />
</a>
</div><!-- .recent-blog-entry-thumbnail -->
<?php } ?>
<header>
<h3 class="recent-blog-entry-title"><?php the_title(); ?></h3>
<?php
// Display post meta details
wpex_post_meta() ;?>
</header>
<div class="recent-blog-entry-content entry clr">
<?php wpex_excerpt( 18, false ); ?>
</div><!-- .recent-blog-entry-content -->
</article><!-- .recent-blog -->
<?php if ( $wpex_count == '3' ) { ?>
<?php $wpex_count=0; ?>
<?php } ?>
<?php endforeach; ?>
</div><!-- #homepage-portfolio -->
<?php } ?>
<?php wp_reset_postdata(); ?>
</article><!-- #post -->
<?php comments_template(); ?>
<?php endwhile; ?>
</div><!-- #content -->
</div><!-- #primary -->

Answer 1

Try declaring $paged outside, and call this in the query_posts
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'posts_per_page' => 4
);
query_posts($args . '&paged=' . $paged);

Answer 2

I might have found an answer for this myself, apparently it's different when you use pagination on the frontpage. I used this and it seems to be working!:
if( is_front_page() ){
$paged = (get_query_var('page')) ? get_query_var('page') : 1;
} else {
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
}