Multi-Column Responsive All-Brands CMS Page
Here’s a simple method to create a separate CMS page that lists all brands and/or manufacturers (uses the manufacturer attribute).
Instead of using the advanced search page (which uses the attribute code instead of name) that doesn’t have a dynamic page title, this method uses the regular search page which displays the manufacturer name in the url and title.
If you want the columns to be responsive, include the responsive CSS section and add additional sections (or delete) as needed. It’s totally optional.
Create a new template:
app/design/frontend/default/YOURTHEME/template/catalog/product/brand.phtml
<?php /** * Separate CMS Page listing all Brand and Manufacturers * CMS content: {{block type="catalog/product" template="catalog/product/brand.phtml"}} * */ ?> <div> <style> .newspaper { -webkit-column-count: 3; /* Chrome, Safari, Opera */ -moz-column-count: 3; /* Firefox */ column-count: 3; } /* Optional - Used for responsive display (adjust px and cols as needed) */ @media (max-width: 600px) { .newspaper { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } </style> <div class="newspaper"> <?php $product = Mage::getModel('catalog/product'); $attributes = Mage::getResourceModel('eav/entity_attribute_collection') ->setEntityTypeFilter($product->getResource()->getTypeId()) ->addFieldToFilter('attribute_code', 'manufacturer'); $attribute = $attributes->getFirstItem()->setEntity($product->getResource()); $manufacturers = $attribute->getSource()->getAllOptions(false); ?> <ul id="manufacturer_list"> <?php foreach ($manufacturers as $manufacturer): ?> <?php $query = str_replace(' ', '+', trim($manufacturer['label'])); $query = str_replace('&','%26', $query); ?> <?php $base_url = Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?> <li><?php echo "<a href=\"" . $base_url . "catalogsearch/result/?q=" . $query . "\">" . $manufacturer['label'] . "</a>"; ?></li> <?php endforeach; ?> </ul> </div> </div>
Note the in-line style – this is the key to automatic multi-column newspaper-like styling. Change the numbers if you’d like a different amount of columns.
Upload the new template and create a new CMS page – in the content, simply place the following –
{{block type=”catalog/product” template=”catalog/product/brand.phtml”}}
Once saved, your page should resemble something like this ..
Note: The manufacturer attribute needs to be ‘searchable’ – also, where this uses the regular search, it will also search through the other searchable attributes looking for this keyword combination.
If you’d prefer to use the ‘advanced search’ method, simply change the link to advanced search and the manufacturer label to the code instead.
Comments
Leave a Reply
You must be logged in to post a comment.
You need to make sure the attribute is defined as type ‘dropdown’. The cms page then lists all the values that have been defined in the dropdown.
In admin, click on the attribute and then manage label/options and there should be the list of all that should show up on the cms page. If nothing’s in the list, you’ll need to add values
Hi There
I tried to do it as You described. But it not shows up anything. About what do I need to think off?
I defined manufactures in the attributes, but nothing shows up. But as I am new in Magento, I did maybe something wrong. Possible to guide me a bit? Do I need to define products with the attribute manufatures too?