Adding Previous & Next Button to category Products

Question

I am displaying category products in the home page using the following block. {{block type="catalog/product_list" template="catalog/product/home_short.phtml" category_id="5" column_count="6"}}.Now i need to add prev and next button to the product list and my code is

<?php $_productCollection=$this->getLoadedProductCollection() ?>
<?php if(!$_productCollection->count()): ?>
<p class="note-msg"><?php echo $this->__('There are no products matching the selection.') ?></p>
<?php else: ?>
<div class="category-products">

<?php // Grid Mode ?>

<?php $_collectionSize = $_productCollection->count() ?>
<?php $_columnCount = $this->getColumnCount(); ?>
<?php $i=0; foreach ($_productCollection as $_product): ?>
    <?php if ($i++%$_columnCount==0): ?>
    <ul class="products-grid">
    <?php endif ?>
        <li class="item<?php if(($i-1)%$_columnCount==0): ?> first<?php elseif($i%$_columnCount==0): ?> last<?php endif; ?>">
            <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(135,135); ?>" width="135" height="135" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" /></a>
            <h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->htmlEscape($_product->getName()) ?>"><?php echo $this->htmlEscape($_product->getName()) ?></a></h2>
            <?php echo $this->getPriceHtml($_product, true) ?>
            <div class="actions">
                <?php if($_product->isSaleable()): ?>
                    <button type="button" title="<?php echo $this->__('Add to Cart') ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart') ?></span></span></button>
                <?php else: ?>
                    <p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>
                <?php endif; ?>
            </div>
        </li>
    <?php if ($i%$_columnCount==0 || $i==$_collectionSize): ?>
    </ul>
    <?php endif ?>
    <?php endforeach ?>
    <script type="text/javascript">decorateGeneric($$('ul.products-grid'), ['odd','even','first','last'])</script>
</div>
<?php endif; ?>

chirag dodia chirag dodia · Accepted Answer · 2013-09-30T12:10:13

Go to CMS > Manage Pages and click on the Home page.

Under the “Design” tab, insert the following code in the “Update Layout XML” field.

<reference name="content">
  <block type="catalog/product_list" name="product_list" template="catalog/product/home_short.phtml">
  <action method="setCategoryId"><category_id>5</category_id></action>
  <action method="setCategoryId"><category_id>6</category_id></action>
  <block type="catalog/product_list_toolbar" name="product_list_toolbar" template="catalog/product/list/toolbar.phtml">
  <block type="page/html_pager" name="product_list_toolbar_pager"/>
  </block>
  <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>
  </block>
</reference>

Based on your product count magento automatically divide the page and set the pagination with previous and next button

Adding Previous & Next Button to category Products

1 Answers