I'd like to change how the display options look like. I want them in In Block after info column.

But I don't want all options in rows but I'd like them in 3 or 4 columns. They are now looking like this:

enter image description here

I'd like them to look like this (below), it would save a lot of space.

Thanks in advance.


  • You need to edit css of your site. – Adarsh Khatri Jun 12 '15 at 10:41

The template used for the custom options is catalog/product/view/options.phtml
You can clone that template into your theme and change the last lines byt adding some markup around them.


<?php foreach($_options as $_option): ?>
    <?php echo $this->getOptionHtml($_option) ?>
<?php endforeach; ?>

can become something like this (I'm not that good at css):

<?php $index = 0;?>
<?php foreach($_options as $_option): ?>
    <?php $index++;?>
    <div class="custom-option<?php echo ($index % 4 == 0) ? ' last':''?>">
        <?php echo $this->getOptionHtml($_option) ?>
<?php endforeach; ?>

This will wrap every option in a div with class custom-option and every other 4th div will have the class last.
Then you can do your magic in css making the elements with this class float:left and maybe add a margin or a padding. And you can have special styles for each 4th element.

| 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.