2

I Have a latest / new products grid on my homepage, it's displaying in 3 columns. I would like to change it to 4.

Backend - CMS > Page > Design

<reference name="content">  <block type="catalog/product_list" name="product_list" after="product_filter" template="catalog/product/list.phtml">
      <action method="setCategoryId"><category_id>2</category_id></action>
      <block type="core/text_list" name="product_list.name.after" as="name.after"> </block>
      <block type="core/text_list" name="product_list.after" as="after"> </block>
      <block type="catalog/product_list_toolbar" name="product_list_toolbar" template="catalog/product/list/toolbar.phtml"></block>
      <block type="page/html_pager" name="product_list_toolbar_pager"> </block>
      </block>
</reference>

Cpanel - app/design/frontend/rwd/default/layout/catalog.xml

    <default>

        <!-- Mage_Catalog -->
        <reference name="left">
            <!--<block type="core/template" name="left.permanent.callout" template="callouts/left_col.phtml">-->
                <!--<action method="setImgSrc"><src>images/media/col_left_callout.jpg</src></action>-->
                <!--<action method="setImgAlt" translate="alt" module="catalog"><alt>Our customer service is available 24/7. Call us at (555) 555-0123.</alt></action>-->
                <!--<action method="setLinkUrl"><url>checkout/cart</url></action>-->
            <!--</block>-->
        </reference>
        <reference name="right">
            <block type="catalog/product_compare_sidebar" before="cart_sidebar" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
            <!--<block type="core/template" name="right.permanent.callout" template="callouts/right_col.phtml">-->
                <!--<action method="setImgSrc"><src>images/media/col_right_callout.jpg</src></action>-->
                <!--<action method="setImgAlt" translate="alt" module="catalog"><alt>Keep your eyes open for our special Back to School items and save A LOT!</alt></action>-->
            <!--</block>-->
        </reference>
        <reference name="footer_links">
            <action method="addLink" translate="label title" module="catalog" ifconfig="catalog/seo/site_map"><label>Site Map</label><url helper="catalog/map/getCategoryUrl" /><title>Site Map</title></action>
        </reference>
        <block type="catalog/product_price_template" name="catalog_product_price_template" />
    </default>


<!--
Category default layout
-->

    <catalog_category_default translate="label">
        <label>Catalog Category (Non-Anchor)</label>
        <reference name="left_first">
            <block type="catalog/navigation" name="catalog.leftnav" after="currency" template="catalog/navigation/left.phtml">
                <block type="core/text_list" name="catalog.leftnav.state.renderers" as="state_renderers" />
            </block>
        </reference>
        <reference name="content">
            <block type="catalog/category_view" name="category.products" template="catalog/category/view.phtml">
                <block type="catalog/product_list" name="product_list" template="catalog/product/list.phtml">
                    <block type="core/text_list" name="product_list.name.after" as="name.after" />
                    <block type="core/text_list" name="product_list.after" as="after" />
                    <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"/>
                        <!-- The following code shows how to set your own pager increments -->
                        <!--
                            <action method="setDefaultListPerPage"><limit>4</limit></action>
                            <action method="setDefaultGridPerPage"><limit>9</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>2</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>4</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>6</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>8</limit></action>
                            <action method="addPagerLimit" translate="label"><mode>list</mode><limit>all</limit><label>All</label></action>
                        -->
                    </block>

                    <action method="addColumnCountLayoutDepend"><layout>empty</layout><count>6</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>one_column</layout><count>5</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>two_columns_left</layout><count>4</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>two_columns_right</layout><count>4</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>three_columns</layout><count>3</count></action>
                    <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>
                    <!-- Since the addColumnCountLayoutDepend does not work, we are manually setting the max columns -->
                    <action method="setColumnCount"><count>4</count></action>
                </block>
            </block>
        </reference>
    </catalog_category_default>

<!--
Category layered navigation layout
-->

    <catalog_category_layered translate="label">
        <label>Catalog Category (Anchor)</label>
        <reference name="left_first">
            <block type="catalog/layer_view" name="catalog.leftnav" after="currency" template="catalog/layer/view.phtml">
                <block type="core/text_list" name="catalog.leftnav.state.renderers" as="state_renderers" />
            </block>
        </reference>
        <reference name="content">
            <block type="catalog/category_view" name="category.products" template="catalog/category/view.phtml">
                <block type="catalog/product_list" name="product_list" template="catalog/product/list.phtml">
                    <block type="core/text_list" name="product_list.name.after" as="name.after" />
                    <block type="core/text_list" name="product_list.after" as="after" />
                    <!-- <action method="addReviewSummaryTemplate"><type>default</type><template>review/helper/su.phtml</template></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"/>
                        <!-- The following code shows how to set your own pager increments -->
                        <!--
                            <action method="setDefaultListPerPage"><limit>4</limit></action>
                            <action method="setDefaultGridPerPage"><limit>3</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>2</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>4</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>6</limit></action>
                            <action method="addPagerLimit"><mode>list</mode><limit>8</limit></action>
                            <action method="addPagerLimit" translate="label"><mode>list</mode><limit>all</limit><label>All</label></action>
                            <action method="addPagerLimit"><mode>grid</mode><limit>3</limit></action>
                            <action method="addPagerLimit"><mode>grid</mode><limit>6</limit></action>
                            <action method="addPagerLimit"><mode>grid</mode><limit>9</limit></action>
                            <action method="addPagerLimit" translate="label"><mode>grid</mode><limit>all</limit><label>All</label></action>
                        -->
                    </block>



                    <action method="addColumnCountLayoutDepend"><layout>empty</layout><count>6</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>one_column</layout><count>5</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>two_columns_left</layout><count>4</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>two_columns_right</layout><count>4</count></action>
                    <action method="addColumnCountLayoutDepend"><layout>three_columns</layout><count>3</count></action>
                    <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>
                    <!-- Since the addColumnCountLayoutDepend does not work, we are manually setting the max columns -->
                    <action method="setColumnCount"><count>4</count></action>
                </block>
            </block>
        </reference>
    </catalog_category_layered>

<!--
Compare products page
-->

    <catalog_product_compare_index translate="label">
        <label>Catalog Product Compare List</label>
        <!-- Mage_Catalog -->
        <reference name="root">
            <action method="setTemplate"><template>page/popup.phtml</template></action>
        </reference>
        <reference name="head">
            <action method="addJs"><script>scriptaculous/scriptaculous.js</script></action>
            <action method="addJs"><script>varien/product.js</script></action>
            <action method="unsetChild"><name>head.viewport</name></action>
        </reference>
        <reference name="content">
            <block type="catalog/product_compare_list" name="catalog.compare.list" template="catalog/product/compare/list.phtml"/>
        </reference>
    </catalog_product_compare_index>

    <customer_account_index>
        <reference name="right">
            <action method="unsetChild"><name>catalog.compare.sidebar</name></action>
        </reference>
    </customer_account_index>

<!--
Product view
-->

    <catalog_product_view translate="label">
        <label>Catalog Product View (Any)</label>
        <!-- Mage_Catalog -->
        <reference name="root">
            <action method="setTemplate"><template>page/1column.phtml</template></action>
        </reference>
        <reference name="head">
            <action method="addJs"><script>varien/product.js</script></action>
            <action method="addJs"><script>varien/configurable.js</script></action>
            <action method="addItem"><type>skin_js</type><script>js/lib/elevatezoom/jquery.elevateZoom-3.0.8.min.js</script></action>

            <action method="addItem"><type>js_css</type><name>calendar/calendar-win2k-1.css</name><params/><!--<if/><condition>can_load_calendar_js</condition>--></action>
            <action method="addItem"><type>js</type><name>calendar/calendar.js</name><!--<params/><if/><condition>can_load_calendar_js</condition>--></action>
            <action method="addItem"><type>js</type><name>calendar/calendar-setup.js</name><!--<params/><if/><condition>can_load_calendar_js</condition>--></action>
        </reference>
        <reference name="content">
            <block type="catalog/product_view" name="product.info" template="catalog/product/view.phtml">
                <!--
                <action method="addReviewSummaryTemplate"><type>default</type><template>review/helper/summary.phtml</template></action>
                <action method="addReviewSummaryTemplate"><type>short</type><template>review/helper/summary_short.phtml</template></action>
                <action method="addReviewSummaryTemplate"><type>...</type><template>...</template></action>
                -->
                <block type="catalog/product_view_media" name="product.info.media" as="media" template="catalog/product/view/media.phtml">
                    <block type="core/text_list" name="product.info.media.after" as="after" />
                </block>
                <block type="core/text_list" name="alert.urls" as="alert_urls" translate="label">
                    <label>Alert Urls</label>
                </block>

                <action method="setTierPriceTemplate"><template>catalog/product/view/tierprices.phtml</template></action>

                <block type="catalog/product_list_upsell" name="product.info.upsell" as="upsell_products" template="catalog/product/list/upsell.phtml">
                    <action method="setColumnCount"><columns>6</columns></action>
                    <action method="setItemLimit"><type>upsell</type><limit>6</limit></action>
                </block>

                <block type="catalog/product_view_additional" name="product.info.additional" as="product_additional_data" />
                <block type="catalog/product_view_description" name="product.description" as="description" template="catalog/product/view/description.phtml">
                    <action method="addToParentGroup"><group>detailed_info</group></action>
                    <action method="setTitle" translate="value"><value>Description</value></action>
                </block>
                <block type="catalog/product_view_attributes" name="product.attributes" as="additional" template="catalog/product/view/attributes.phtml">
                    <action method="addToParentGroup"><group>detailed_info</group></action>
                    <action method="setTitle" translate="value"><value>Additional Information</value></action>
                </block>
                <block type="catalog/product_list_related" name="catalog.product.related" as="related_products" template="catalog/product/list/related.phtml" />

                <block type="catalog/product_view" name="product.info.addto" as="addto" template="catalog/product/view/addto.phtml"/>
                <block type="catalog/product_view" name="product.info.sharing" as="sharing" template="catalog/product/view/sharing.phtml"/>
                <block type="catalog/product_view" name="product.info.addtocart" as="addtocart" template="catalog/product/view/addtocart.phtml"/>

                <block type="core/text_list" name="product.info.extrahint" as="extrahint" translate="label">
                    <label>Product View Extra Hint</label>
                </block>

                <block type="catalog/product_view" name="product.info.options.wrapper" as="product_options_wrapper" template="catalog/product/view/options/wrapper.phtml" translate="label">
                    <label>Info Column Options Wrapper</label>
                    <block type="core/template" name="options_js" template="catalog/product/view/options/js.phtml"/>
                    <block type="catalog/product_view_options" name="product.info.options" as="product_options" template="catalog/product/view/options.phtml">
                        <action method="addOptionRenderer"><type>text</type><block>catalog/product_view_options_type_text</block><template>catalog/product/view/options/type/text.phtml</template></action>
                        <action method="addOptionRenderer"><type>file</type><block>catalog/product_view_options_type_file</block><template>catalog/product/view/options/type/file.phtml</template></action>
                        <action method="addOptionRenderer"><type>select</type><block>catalog/product_view_options_type_select</block><template>catalog/product/view/options/type/select.phtml</template></action>
                        <action method="addOptionRenderer"><type>date</type><block>catalog/product_view_options_type_date</block><template>catalog/product/view/options/type/date.phtml</template></action>
                </block>
                        <block type="core/html_calendar" name="html_calendar" as="html_calendar" template="page/js/calendar.phtml"/>
                    </block>
                <block type="catalog/product_view" name="product.info.options.wrapper.bottom" as="product_options_wrapper_bottom" template="catalog/product/view/options/wrapper/bottom.phtml" translate="label">
                    <label>Bottom Block Options Wrapper</label>
                    <action method="insert"><block>product.tierprices</block></action>
                    <block type="catalog/product_view" name="product.clone_prices" as="prices" template="catalog/product/view/price_clone.phtml"/>
                    <action method="append"><block>product.info.addtocart</block></action>
                    <action method="append"><block>product.info.addto</block></action>
                    <action method="append"><block>product.info.sharing</block></action>
                </block>

                <block type="core/template_facade" name="product.info.container1" as="container1">
                    <action method="setDataByKey"><key>alias_in_layout</key><value>container1</value></action>
                    <action method="setDataByKeyFromRegistry"><key>options_container</key><key_in_registry>product</key_in_registry></action>
                    <action method="append"><block>product.info.options.wrapper</block></action>
                    <action method="append"><block>product.info.options.wrapper.bottom</block></action>
                </block>
                <block type="core/template_facade" name="product.info.container2" as="container2">
                    <action method="setDataByKey"><key>alias_in_layout</key><value>container2</value></action>
                    <action method="setDataByKeyFromRegistry"><key>options_container</key><key_in_registry>product</key_in_registry></action>
                    <action method="append"><block>product.info.options.wrapper</block></action>
                    <action method="append"><block>product.info.options.wrapper.bottom</block></action>
                </block>
                <action method="unsetCallChild"><child>container1</child><call>ifEquals</call><if>0</if><key>alias_in_layout</key><key>options_container</key></action>
                <action method="unsetCallChild"><child>container2</child><call>ifEquals</call><if>0</if><key>alias_in_layout</key><key>options_container</key></action>
            </block>
        </reference>
        <reference name="right">

        </reference>
    </catalog_product_view>

<!--
Additional block dependant on product type
-->
    <PRODUCT_TYPE_simple translate="label" module="catalog">
        <label>Catalog Product View (Simple)</label>
        <reference name="product.info">
            <block type="catalog/product_view_type_simple" name="product.info.simple" as="product_type_data" template="catalog/product/view/type/default.phtml">
                <block type="core/text_list" name="product.info.simple.extra" as="product_type_data_extra" translate="label">
                    <label>Product Extra Info</label>
                </block>
            </block>
            <block type="catalog/product_view_type_simple" name="product.info.availability" as="product_type_availability" template="catalog/product/view/type/availability/default.phtml" />
        </reference>
    </PRODUCT_TYPE_simple>
    <PRODUCT_TYPE_configurable translate="label" module="catalog">
        <label>Catalog Product View (Configurable)</label>
        <reference name="product.info">
            <block type="catalog/product_view_type_configurable" name="product.info.configurable" as="product_type_data" template="catalog/product/view/type/default.phtml">
                <block type="core/text_list" name="product.info.configurable.extra" as="product_type_data_extra" translate="label">
                    <label>Product Extra Info</label>
                </block>
            </block>
            <block type="catalog/product_view_type_configurable" name="product.info.availability" as="product_type_availability" template="catalog/product/view/type/availability/default.phtml" />
        </reference>
        <reference name="product.info.options.wrapper">
            <block type="catalog/product_view_type_configurable" name="product.info.options.configurable" as="options_configurable" before="-" template="catalog/product/view/type/options/configurable.phtml">
                <block type="core/text_list" name="product.info.options.configurable.renderers" as="attr_renderers" />
                <block type="core/text_list" name="product.info.options.configurable.after" as="after" />
            </block>
        </reference>
    </PRODUCT_TYPE_configurable>
    <PRODUCT_TYPE_grouped translate="label" module="catalog">
        <label>Catalog Product View (Grouped)</label>
        <reference name="product.info">
            <block type="catalog/product_view_type_grouped" name="product.info.grouped" as="product_type_data" template="catalog/product/view/type/grouped.phtml">
                <block type="core/text_list" name="product.info.grouped.extra" as="product_type_data_extra" translate="label">
                    <label>Product Extra Info</label>
                </block>
            </block>
            <block type="catalog/product_view_type_grouped" name="product.info.availability" as="product_type_availability" template="catalog/product/view/type/availability/grouped.phtml" />
        </reference>
    </PRODUCT_TYPE_grouped>
    <PRODUCT_TYPE_virtual translate="label" module="catalog">
        <label>Catalog Product View (Virtual)</label>
        <reference name="product.info">
            <block type="catalog/product_view_type_virtual" name="product.info.virtual" as="product_type_data" template="catalog/product/view/type/default.phtml">
                <block type="core/text_list" name="product.info.virtual.extra" as="product_type_data_extra" translate="label">
                    <label>Product Extra Info</label>
                </block>
            </block>
            <block type="catalog/product_view_type_virtual" name="product.info.availability" as="product_type_availability" template="catalog/product/view/type/availability/default.phtml" />
        </reference>
    </PRODUCT_TYPE_virtual>



<!--
Product send to friend
-->

    <catalog_product_send translate="label">
        <label>Catalog Product Email to a Friend</label>
        <!-- Mage_Catalog -->
        <reference name="root">
            <action method="setTemplate"><template>page/2columns-right.phtml</template></action>
        </reference>
        <reference name="head">
            <action method="addJs"><script>varien/product.js</script></action>
        </reference>
        <reference name="content">
            <block type="catalog/product_send" name="product.send" template="catalog/product/send.phtml">
            </block>
        </reference>
    </catalog_product_send>

<!--
Product additional images gallery popup
-->

    <catalog_product_gallery translate="label">
        <label>Catalog Product Image Gallery Popup</label>
        <!-- Mage_Catalog -->
        <reference name="root">
            <action method="setTemplate"><template>page/popup.phtml</template></action>
        </reference>
        <reference name="content">
            <block type="catalog/product_gallery" name="catalog_product_gallery" template="catalog/product/gallery.phtml"/>
        </reference>
    </catalog_product_gallery>

<!--
SEO Site Map
-->

    <catalog_seo_sitemap translate="label">
        <label>Catalog Seo Sitemap (Common)</label>
        <remove name="right"/>
        <remove name="left"/>

        <reference name="root">
            <action method="setTemplate"><template>page/1column.phtml</template></action>
        </reference>
        <reference name="content">
            <block type="page/template_container" name="seo.sitemap.container" template="catalog/seo/sitemap/container.phtml">
                <block type="page/template_links" name="seo.sitemap.links" as="links" template="page/template/links.phtml"/>
                <block type="page/html_pager" name="seo.sitemap.pager.top" as="pager_top" template="page/html/pager.phtml"/>
                <block type="page/html_pager" name="seo.sitemap.pager.bottom" as="pager_bottom" template="page/html/pager.phtml"/>
            </block>
        </reference>
    </catalog_seo_sitemap>

    <catalog_seo_sitemap_category translate="label">
        <label>Catalog Seo Sitemap (Category List)</label>
        <reference name="head">
            <action method="setTitle" translate="title" module="catalog"><title>Site Map</title></action>
        </reference>
        <update handle="catalog_seo_sitemap" />
        <reference name="seo.sitemap.container">
            <action method="setTitle" translate="title" module="catalog"><title>Categories</title></action>
            <block type="catalog/seo_sitemap_category" name="seo.sitemap.sitemap" as="sitemap" after="pager_top" template="catalog/seo/sitemap.phtml">
                <action method="bindPager"><pager>seo.sitemap.pager.top</pager></action>
                <action method="bindPager"><pager>seo.sitemap.pager.bottom</pager></action>
                <action method="setItemsTitle" translate="title" module="catalog"><title>categories</title></action>
            </block>
        </reference>
        <reference name="seo.sitemap.links">
            <action method="addLink" translate="label title" module="catalog"><label>Products Sitemap</label><url helper="catalog/map/getProductUrl"/><title>Products Sitemap</title></action>
        </reference>
    </catalog_seo_sitemap_category>

    <catalog_seo_sitemap_category_tree translate="label">
        <label>Catalog Seo Sitemap (Category Tree)</label>
        <reference name="seo.sitemap.container">
            <remove name="seo.sitemap.pager.top" />
            <remove name="seo.sitemap.pager.bottom" />
            <block type="catalog/seo_sitemap_tree_pager" name="seo.sitemap.tree.pager.top" as="pager_top" template="page/html/pager.phtml"/>
            <block type="catalog/seo_sitemap_tree_pager" name="seo.sitemap.tree.pager.bottom" as="pager_bottom" template="page/html/pager.phtml"/>
            <remove name="seo.sitemap.sitemap" />
            <block type="catalog/seo_sitemap_tree_category" name="seo.sitemap.sitemap_tree" as="sitemap" after="pager_top" template="catalog/seo/tree.phtml">
                <action method="bindPager"><pager>seo.sitemap.tree.pager.top</pager></action>
                <action method="bindPager"><pager>seo.sitemap.tree.pager.bottom</pager></action>
            </block>
        </reference>
    </catalog_seo_sitemap_category_tree>

    <catalog_seo_sitemap_product translate="label">
        <label>Catalog Seo Sitemap (Product List)</label>
        <reference name="head">
            <action method="setTitle" translate="title" module="catalog"><title>Site Map</title></action>
        </reference>
        <update handle="catalog_seo_sitemap" />
        <reference name="seo.sitemap.container">
            <action method="setTitle" translate="title" module="catalog"><title>Products</title></action>
            <block type="catalog/seo_sitemap_product" name="seo.sitemap.sitemap" as="sitemap" after="pager_top" template="catalog/seo/sitemap.phtml">
                <action method="bindPager"><pager>seo.sitemap.pager.top</pager></action>
                <action method="bindPager"><pager>seo.sitemap.pager.bottom</pager></action>
                <action method="setItemsTitle" translate="title" module="catalog"><title>products</title></action>
            </block>
        </reference>
        <reference name="seo.sitemap.links">
            <action method="addLink" translate="label title" module="catalog"><label>Categories Sitemap</label><url helper="catalog/map/getCategoryUrl"/><title>Categories Sitemap</title></action>
        </reference>
    </catalog_seo_sitemap_product>
1

You should add the following line to your xml:

<action method="addColumnCountLayoutDepend">
    <layout>three_columns</layout><count>4</count>
</action>

Depending on which layout is used on the homepage, you'll have to change the value in the <layout>-tag.

This should be the resulting xml:

<reference name="content"> 
    <block type="catalog/product_list" name="product_list" after="product_filter" template="catalog/product/list.phtml">
      <action method="setCategoryId"><category_id>2</category_id></action>
      <block type="core/text_list" name="product_list.name.after" as="name.after"> </block>
      <block type="core/text_list" name="product_list.after" as="after"> </block>
      <block type="catalog/product_list_toolbar" name="product_list_toolbar" template="catalog/product/list/toolbar.phtml"></block>
      <block type="page/html_pager" name="product_list_toolbar_pager"> </block>
      <action method="addColumnCountLayoutDepend"><layout>three_columns</layout><count>4</count></action>
  </block>
</reference>
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.