Magento Display New Products With Pagination

First, let’s set the record straight. It is possible to display a list of new products in Magento using a default block. You can do this without any coding changes or modifications to Magento itself. This code will allow you to bring up a list of new products on one of your CMS pages. It is also possible to use this to bring new products up within a template file or on your homepage, though we are not covering that here.

The following steps will help you to add new products to a Magento CMS page and show pagination for the products.

1. Create all of the folders in the following path if they do not already exist.

   app/code/local/Mage/Catalog/Block/Product

   Note: We do not want to modify core Magento code so we create our own path in the “local” folder
   
2. Create a New.php file and place it in the following location:

   app/code/local/Mage/Catalog/Block/Product/New.php

   Note: We named our file New.php which worked for our purposes.
   Note: If your file is named “New.php” it will overwrite Magento’s default New.php page located in app/code/core/Mage/Catalog/Block/Product. If you are going to be using the default New.php file included with Magento in other parts of your site you may want to name your file differently.
   
3. Add the following code to your New.php file (The key to the pagination is extending the List class ):

<?php
class Mage_Catalog_Block_Product_New extends Mage_Catalog_Block_Product_List
{
    function get_prod_count()
    {
        //unset any saved limits
        Mage::getSingleton('catalog/session')->unsLimitPage();
        return (isset($_REQUEST['limit'])) ? intval($_REQUEST['limit']) : 10;
    }// get_prod_count

    function get_cur_page()
    {
        return (isset($_REQUEST['p'])) ? intval($_REQUEST['p']) : 1;
    }// get_cur_page

    /**
     * Retrieve loaded category collection
     *
     * @return Mage_Eav_Model_Entity_Collection_Abstract
     **/
    protected function _getProductCollection()
    {
        $todayDate  = Mage::app()->getLocale()->date()->toString(Varien_Date::DATETIME_INTERNAL_FORMAT);

        $collection = Mage::getResourceModel('catalog/product_collection');
        $collection->setVisibility(Mage::getSingleton('catalog/product_visibility')->getVisibleInCatalogIds());

        $order = (isset($_REQUEST['order'])) ? $_REQUEST['order'] : "name";
        $dir = (isset($_REQUEST['dir'])) ? $_REQUEST['dir'] : "asc";

        $collection = $this->_addProductAttributesAndPrices($collection)
            ->addStoreFilter()
            ->addAttributeToFilter('news_from_date', array('date' => true, 'to' => $todayDate))
            ->addAttributeToFilter('news_to_date', array('or'=> array(
                0 => array('date' => true, 'from' => $todayDate),
                1 => array('is' => new Zend_Db_Expr('null')))
            ), 'left')
            ->addAttributeToSort($order, $dir)
            ->setPageSize($this->get_prod_count());

        $collection->setCurPage($this->get_cur_page());
        $this->setProductCollection($collection);
        return $collection;
    }// get product collection
}
?>

4.  Alright – save your New.php file. Now it’s time to add your Magento CMS page and get it to show the new products.

Now, I’m assuming you already know how to add a CMS page to your Magento site so we will not be covering it in this post. Once you have added your CMS page, there are a couple of ways to get your new products to show up. I plan on going through both of them below.


 Add code in cms->page->design->Layout Update XML area.

<reference name="content">
    <block type="catalog/product_new" name="product_new" template="catalog/product/new.phtml">
        <action method="setCategoryId"><category_id>10</category_id></action>
        <action method="setColumnCount"><column_count>5</column_count></action>
        <action method="setProductsCount"><count>0</count></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="addColumnCountLayoutDepend"><layout>one_column</layout><count>6</count></action>
        <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>
    </block>
</reference>

Save your page!

And add code in new.phtml file
path :  app->design->fronted->default->default->template->catalog->product->new.phtml

<?php
/**
 * Magento
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License (AFL 3.0)
 * that is bundled with this package in the file LICENSE_AFL.txt.
 * It is also available through the world-wide-web at this URL:
 * http://opensource.org/licenses/afl-3.0.php
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@magentocommerce.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade Magento to newer
 * versions in the future. If you wish to customize Magento for your
 * needs please refer to http://www.magentocommerce.com for more information.
 *
 * @category    design
 * @package     base_default
 * @copyright   Copyright (c) 2012 Magento Inc. (http://www.magentocommerce.com)
 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */
?>
<?php
$_productCollection=$this->getProductCollection();
$_helper = $this->helper('catalog/output');
?>
<?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 echo $this->getToolbarHtml() ?>
        <?php // List mode ?>
        <?php if($this->getMode()!='grid'): ?>
            <?php $_iterator = 0; ?>
            <ol class="products-list" id="products-list">
                <?php foreach ($_productCollection as $_product): ?>
                    <li class="item<?php if( ++$_iterator == sizeof($_productCollection) ): ?> last<?php endif; ?>">
                        <?php // Product Image ?>
                        <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(135); ?>" width="135" height="135" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>
                        <?php // Product description ?>
                        <div class="product-shop">
                            <div class="f-fix">
                                <?php $_productNameStripped = $this->stripTags($_product->getName(), null, true); ?>
                                <h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped; ?>"><?php echo $this->htmlEscape($_product->getName()) ?></a></h2>
                                <div class="desc std">
                                    <?php echo $_helper->productAttribute($_product, $_product->getShortDescription(), 'short_description') ?>
                                    <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped ?>" class="link-learn"><?php echo $this->__('Learn More') ?></a>
                                </div>
                                <?php echo $this->getPriceHtml($_product, true) ?>
                                <?php if($_product->isSaleable()): ?>
                                    <p><button type="button" title="<?php echo $this->__('Add to Cart') ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><img src="<?php echo $this->getSkinUrl('images/add_to_cart_btn.jpg');?>"/></button></p>
                                <?php else: ?>
                                    <p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>
                                <?php endif; ?>
                                <?php echo $this->getReviewsSummaryHtml($_product, 'short') ?>
                            </div>
                        </div>
                    </li>
                <?php endforeach; ?>
            </ol>
            <script type="text/javascript">decorateList('products-list', 'none-recursive')</script>

        <?php else: ?>

            <?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->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(135); ?>" width="135" height="135" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>
                <h2 class="product-name">
                    <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($_product->getName(), null, true) ?>">
                        <?php echo $this->htmlEscape($_product->getName()) ?>
                    </a>
                </h2>
                <?php echo $this->getReviewsSummaryHtml($_product, 'short') ?>
                <?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) ?>')"><img src="<?php echo $this->getSkinUrl('images/add_to_cart_btn.jpg');?>"/></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>
        <?php endif; ?>

        <div class="toolbar-bottom">
            <?php echo $this->getToolbarHtml() ?>
        </div>
    </div>
<?php endif; ?>

and save file !!

clear cache and refresh browser tab.  :)

Let’s quickly go over what this does.

1. <block type="catalog/product_new" name="product_new" template="catalog/product/list.phtml">

   First we set the block type and the template we are using. In our case we set the block type to “catalog/product_new” which pulls the block from the New.php file we placed in our local directory at the beginning of the post.
   
2. The template we are using is “list.phtml” which gives us access to the Pager and Toolbar.

3. <action method="setCategoryId"><category_id>10</category_id></action>

   setCategoryId – Next we set the Category ID. In our situation we had two Magento stores running off of two different root categories. We changed the category ID depending on which category we wanted to pull new products for. You can set this to whatever category you want, or remove the line altogether.
   Note: You can put this XML on multiple pages. So you could have a page for new Children clothing and a page for new Adult clothing. You would simply need to put the same XML on each page and change the Category ID to reflect the children and adult clothing categories.
   

4. <action method="setColumnCount"><column_count>6</column_count></action>

   setColumnCount – This allows us to show six products in one row on the page. We set the column count to six because this fit our design. Feel free to set it to whatever suits your purposes.
   

5. <action method="setProductsCount"><count>0</count></action>

   setProductsCount – Setting the products count. Leave this set to zero in order to display all new products – change it if you only wish to limit display to a certain number.

6. <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" />

   Adds the toolbar and pager.
   

7. <action method="setDefaultGridPerPage"><limit>12</limit></action>

   setDefaultGridPerPage – Configure the toolbar to show what the number of products you wish. By default we are showing 12 products per page, which is two rows of six columns.

8. <action method="addPagerLimit"><mode>grid</mode><limit>12</limit></action>

   addPagerLimit – These all add options to the toolbar which will allow your customers to choose how many products they want to see on one page. The XML given will allow the customer to choose to display 12, 24, 36, 48, or All products on one page.
   

9. <action method="addColumnCountLayoutDepend"><layout>one_column</layout><count>6</count></action>

   Finally, in our design, the one_column layout has to be selected in order for 6 columns to show up (otherwise there isn’t enough room).

10. <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>

    Set the toolbar name.
    
11. You may notice one caveat with this approach. You need to make sure there is content in the Content area of the CMS page. Any easy way around this is to enter a “<br />” in the html portion of the Content entry section.
12. Save your page!

Visit your Magento CMS page. You should see all of your new products listed with pagination.