Magento Custom Product Listing in the CMS Page

MagentoWhen developing applications on Magento’s Ecommerce platform, it’s occasionally necessary to customize the way products are displayed.  While the default store layout has the product listing built-in, custom product listings can highlight certain products and attributes, or make it easier for customers to find their desired products.  When integrated into a CMS page, the custom product listing will provide a robust and easy-to-maintain feature without the overhead of plugin development.

The first step to developing the custom listing is to create a PHP placeholder and link it from the CMS page.  The custom listing will be hosted in a CMS page, in order to enable the customer administrator to easily add content above or below the listing as necessary, or to duplicate it in other areas of the site.

Custom PHP pages in Magento are saved with the PHTML extension.  They reside under the frontend theme folder, and can be overridden in the theme structure.  Creating a custom PHP page is as simple as follows.  First, create the PHTML page with test content in the following page:

//app/design/frontend/default/THEME/template/page/custom_product_listing.phtml
TEST - CUSTOM PHP IS WORKING

Next, add the PHP page to the CMS by insert the following in the body of the CMS page:

{{block type="core/template" template="page/custom_product_listing.phtml"}}

If the CMS page shows the test content, everything is working properly.  Next, change the content of the custom PHP page to the following:

<?
$products = Mage::getModel('catalog/category')->load($cat_id)
  ->getProductCollection()
  ->addAttributeToSelect('*')
  ->addAttributeToFilter('status', 1);
 
foreach($products as $product){
  //Display product row
  echo $product->getName().'<br/>';
}
?>

The first line in this code loads all products of a target category ID into the products array.  Select, filter, and sort attributes can be added to manipulate the collection of items returned.  Finally, with the array populated, each product can be parsed and displayed to the screen.  In this simple example, the only the product name for each item is displayed.

A custom product listing can provide improved usability and increase store sales.  Using this technique, the Magento cart can be customized to display products in virtually any form, rivalling the built-in display and providing a fully custom listing for any implementation requirements.

Written by Andrew Palczewski

About the Author
Andrew Palczewski is CEO of apHarmony, a Chicago software development company. He holds a Master's degree in Computer Engineering from the University of Illinois at Urbana-Champaign and has over ten years' experience in managing development of software projects.
Google+

RSS Twitter LinkedIn Facebook Email

Leave a Reply

Your email address will not be published. Required fields are marked *