Page 2 of 2

Re: Display Product Options Horizontally

Posted: Sat Feb 02, 2013 3:33 pm
by eurothai
Dear Pprmkr,

You're a hero! ;-)
Works very smooth and nice. Thanks for your work!

Re: Display Product Options Horizontally

Posted: Mon Feb 25, 2013 1:56 am
by uktom91
Does anybody know how to get this working in version 1.5.5.1? Any help would be much appreciated. I'm trying to get the image option to display horizontally

Re: Display Product Options Horizontally

Posted: Fri Jun 07, 2013 12:39 am
by shahwc
I tried to edit what pprmkr said to make radio option horizontally but i got error? my OC is 1.5.5.1

Re: Display Product Options Horizontally

Posted: Mon Nov 04, 2013 12:48 pm
by milad
How can I change the select boxes from Vertical to Horizontal??( In the Available Options)

Please help me, it is urgent!

Re: Display Product Options Horizontally

Posted: Mon Sep 15, 2014 12:54 am
by frankleng
great. found it. thanks.

Re: Display Product Options Horizontally

Posted: Fri Dec 12, 2014 6:17 am
by vixynn
thbr02 wrote:I've also been looking for the feature to display options horizontally for a long time. This works great! Thank you "pprmkr". If someone is interested I've setup a VQMod which will make the changes without changing the core files. Works fine with OC 1.5.1.3. Just upload to your vqmod/xml directory.

Hi,
will this work in OC1.5.6.4 ?
thanks!

Re: Display Product Options Horizontally

Posted: Fri Dec 12, 2014 9:47 pm
by thbr02
I don't know. Why don't try?

Re: Display Product Options Horizontally

Posted: Thu Jan 08, 2015 10:30 am
by ultrafiremods
how can i make this work for opencart 2x

Re: Display Product Options Horizontally

Posted: Sat Jul 04, 2015 3:03 am
by tmart
Hi PPrMkr,

Can you please help us for Ver 2.0.3 the latest version please?

Thanks and regards
Tissy

Re: Display Product Options Horizontally

Posted: Sat Jul 04, 2015 11:16 pm
by pprmkr
Edit catalog/view/theme/default/template/product/product.tpl

Find the div's surrounding radio and checkbox options:
<div class="radio"> and <div class="checkbox"> and remove them.

Code: Select all

            <?php if ($option['type'] == 'radio') { ?>
            <div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
              <label class="control-label"><?php echo $option['name']; ?></label>
              <div id="input-option<?php echo $option['product_option_id']; ?>">
                <?php foreach ($option['product_option_value'] as $option_value) { ?>
                <div class="radio">
                  <label>
                    <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" />
                    <?php echo $option_value['name']; ?>
                    <?php if ($option_value['price']) { ?>
                    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
                    <?php } ?>
                  </label>
                </div>
                <?php } ?>
              </div>
            </div>
            <?php } ?>
            <?php if ($option['type'] == 'checkbox') { ?>
            <div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
              <label class="control-label"><?php echo $option['name']; ?></label>
              <div id="input-option<?php echo $option['product_option_id']; ?>">
                <?php foreach ($option['product_option_value'] as $option_value) { ?>
                <div class="checkbox">
                  <label>
                    <input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" />
                    <?php echo $option_value['name']; ?>
                    <?php if ($option_value['price']) { ?>
                    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
                    <?php } ?>
                  </label>
                </div>
                <?php } ?>
              </div>
            </div>
            <?php } ?>
After change it looks like:

Code: Select all

            <?php if ($option['type'] == 'radio') { ?>
            <div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
              <label class="control-label"><?php echo $option['name']; ?></label>
              <div id="input-option<?php echo $option['product_option_id']; ?>">
                <?php foreach ($option['product_option_value'] as $option_value) { ?>

                  <label>
                    <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" />
                    <?php echo $option_value['name']; ?>
                    <?php if ($option_value['price']) { ?>
                    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
                    <?php } ?>
                  </label>

                <?php } ?>
              </div>
            </div>
            <?php } ?>
            <?php if ($option['type'] == 'checkbox') { ?>
            <div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
              <label class="control-label"><?php echo $option['name']; ?></label>
              <div id="input-option<?php echo $option['product_option_id']; ?>">
                <?php foreach ($option['product_option_value'] as $option_value) { ?>

                  <label>
                    <input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" />
                    <?php echo $option_value['name']; ?>
                    <?php if ($option_value['price']) { ?>
                    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
                    <?php } ?>
                  </label>

                <?php } ?>
              </div>
            </div>
            <?php } ?>