Mini Tutorial: Adding a Featured Products Block to the Homepage

August 1, 2012 by Corey

A common occurrence on any sort of eCommerce website is to find products listed on the homepage. Visitors to your site oftentimes are there to buy or at least browse, so being able to drill down into the catalog immediately is arguably an essential part in any website that sells products. Of course, there are many ways to allow potential customers to drill down on site content, but as mentioned before, products are a direct and effective way of doing so.

Placing a featured products block on your homepage is actually quite easy. The first thing to consider is that it will look and interact very similar to an actual page in the catalog. If you know your Magento templates, it will look specific to our catalog/product/list.phtml file. In fact, let’s copy this template and place it in our own template directory, naming it list-homepage.phtml. This will allow us to customize the actual content of the block by placing whatever we would like in the block.

The first thing we’ll need to rewrite is the beginning of the file, as there will be no product collection loaded by default via $this->getLoadedProductCollection(). We can load it simply via:

$_category = Mage::getModel(‘catalog/category’)->load($this->getCategoryId());
$_productCollection = Mage::getModel(‘catalog/product’)->getCollection();
$_productCollection
->addAttributeToSelect(‘*’)
->addAttributeToFilter(‘small_image’,array(‘neq’=>’no_selection’))
->addCategoryFilter($_category)
->setOrder(‘updated_at’, ‘ASC’)
->load();

You may also notice that we’re not retrieving a product collection without images. This is just a check to make sure customers can actually see products listed there.

*Note: We only want to output the columns that are necessary. You may also notice our max shown, column count and category ID variables. These are actually defined in where we tell Magento to output the block (in the page) instead of in the block class. Open up the backend of Magento and navigate to CMS > Manage Pages and click on Home. Place this line of code anywhere in this page’s code (adjusting whatever parameters you would like):

{{block type=”catalog/product_list” name=”home.catalog.product.list” alias=”products_homepage” max_shown=”10″ display_mode=”grid” column_count=”5″ category_id=”***” cat_name=”On Sale” template=”catalog/product/list-homepage.phtml”}}

Save this block and create a new category in Magento called “Featured Products” and place whatever products you would like ‘featured’, in this, to feature them on the homepage. Edit Home again and fill in the “***” with your category ID. Remember to dump the cache and perhaps even re-index. Then have a look at your homepage!

About Corey

Certified Magento Developer

Read more posts by Corey