In rwd theme, when I show 4 products in a row by following code in catalog.xml

<action method="setColumnCount"><count>4</count></action> it looks good on desktop but on mobile view product boxes collapse in each-other.

is there any way to shows 4 products in desktop view and 2 in mobile.

Please help me to achieve this ?

  • please share your code
    – Aamir
    Jun 3 '17 at 11:07

1) Firstly, dont update it directly in catalog.xml but in local.xml of your custom theme.

2) Assuming that the actual block name is:

<block type="...", name="block1" template="...">
    <action method="setColumnCount"><count>4</count></action>

//Now we add another one

<block type="...", name="block2" template="...">
        <action method="setColumnCount"><count>2</count></action>

3) In app/design/frontend/{package}/{theme}/template/path to your your phtml

replace the block that calls the block1 with:

    <?php $isMobile = Zend_Http_UserAgent_Mobile::match( Mage::helper('core/http')->getHttpUserAgent(), $_SERVER); ?>
    <?php if($isMobile): ?>
        <?php echo $this->getChildHtml('block2') ?>
    <?php else: ?>
        <?php echo $this->getChildHtml('block1') ?>
    <?php endif; ?>
  • there is no local.xml in my rwd theme
    – kind
    Jun 7 '17 at 20:52
  • 1
    you create it in layout/local.xml
    – Aamir
    Jun 7 '17 at 23:01

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.