Wordpress Page: How to add pagination?

[vince samoy <vince_samoy@xxxxxxxxx>]

Hi guys,

I was wondering if this is the right place that this question of mine might get an answer. I'm currently working on a website project and I'm trying to add a pagination on a "Wordpress Page" as I might call it.

I was able to make it work on the archive.php page. Please take note that this page is calling out 3 "Posts" on each page and that the pagination is working.

Link: http://lgrathletics.com/lgr/category/basketball

Code:

<?php get_header();?>

<?php get_sidebar();?>

<div class="main-contents">this is the archive
<div id="gridContainer">

<div class="category_title"><h2><?php single_cat_title(); ?> </h2></div>

<?php
$c = 1; //init counter
$bpr = 3; //boxes per row

if(have_posts()) :
    while(have_posts()) :
        the_post();
?>
            <div class="post <?php
global $wp_query;
$postid = $wp_query->post->ID;

echo get_post_meta($postid, 'third_post', true);
wp_reset_query();
?>" id="post-<?php the_ID(); ?>">
                <h1 class="title"><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
                <div class="postImage">
                    <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail('grid-post-image'); ?></a>
                </div>
                <div class="postExcerpt">
                    <?php the_excerpt(); ?>
                </div>
            </div>
<?php
if($c == $bpr) :
?>
<div class="clr"></div>
<?php
$c = 0;
endif;
?>
<?php
        $c++;
    endwhile;
endif;
?>
<?php wp_pagenavi(); ?>
<div class="clr"></div>
</div>
</div>

<?php get_footer(); ?>

Now, I'm trying to make this work on a template page. With 3 "Pages" instead of posts on each page. You'll notice that the pagination is not appearing.

Link: http://lgrathletics.com/lgr/basketball

Code:

<?php
/*
Template Name: Product Grid
*/
?>

<?php get_header(); ?>

<?php get_sidebar(); ?>

<div class="main-contents">this is the product grid
<div id="gridContainer">

<div class="category_title"><h2><?php
$parent_title = get_the_title($post->post_parent);
echo $parent_title;
?>
 </h2></div>

<?php if ( (is_page('Products')) or (is_page('Basketball')) ) {

$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;    
    
query_posts(array('showposts' => 3, 'post_parent' => 173, 'post_type' => 'page'));

    while (have_posts()) {
        
        the_post(); // vital
        
        $thumbPath = get_post_meta($post->ID, 'thumbnail', true);
        
        if ($thumbPath == "") {
            $thumbPath = "/images/comingsoon.png";
        
        }
        
        ?>
        <div class="post <?php echo get_post_meta($post->ID, 'third_post', true); ?>">
        
        <h1 class="title"><a href="<?php the_permalink() ?>" class="grid-product">
        <?php the_title(); ?></a></h1>
        <div class="postImage">
            <a href="<?php the_permalink() ?>" class="grid-product"><img src="<?php echo $thumbPath ?>" alt="" /></a>
        </div>
        <div class="postExcerpt">
                    $<?php echo get_post_meta($post->ID, 'price', true); ?>
                </div>
                
        </div>
        
    <?php }
    
    wp_reset_query(); // Restore global post data
    
}
?>

<?php if(function_exists('wp_pagenavi')) { // if PageNavi is activated ?>

<?php wp_pagenavi(); // Use PageNavi ?>

<?php } else { // Otherwise, use traditional Navigation ?>

<div class="nav-previous">
<!-- next_post_link -->
</div>

<div class="nav-next">
<!-- previous_post_link -->
</div>

<?php } // End if-else statement ?>
 
<div class="clr"></div>
</div>
</div>

<?php get_footer(); ?>


I really don't what I'm currently missing or this is something that is impossible. Hope you guys can help me out.

Thanks in advance and good day!

Vince