Page 1 of 1
option image in more columns[SOLVED]
Posted: Wed Mar 28, 2012 1:21 pm
by klavi
Hello,
my problem was that i wanted to use image option as "checkbox" not as "radio". the sollution was easy
but i wish to know is there any chance to make that choices as 2-3column table not in a single one.
Thanks in advance
Re: option image in more columns
Posted: Fri Mar 30, 2012 6:51 pm
by klavi
Here is some kind of solluition. Itstarts at row 123 using $_iterator
Code: Select all
<?php if ($option['type'] == 'image') { ?>
<div id="option-<?php echo $option['product_option_id']; ?>" class="option">
<?php if ($option['required']) { ?>
<span class="required">*</span>
<?php } ?>
<b><?php echo $option['name']; ?>:</b><br />
<table border='0' class="option-image">
<?php $_iterator=2; foreach ($option['option_value'] as $option_value) { ?>
<?php if(!$_iterator || (++$_iterator+1)%2 == 0) { ?>
<tr>
<?php } ?>
<td style="width: 1px;"><input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></td>
<td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td>
<td><label for="option-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></td>
<?php if(($_iterator)%2 == 0) { ?>
<?php } elseif($_iterator == count($option['option_value'])) { ?>
<?php }?>
<?php } ?>
</table>
</div>
<br />
<?php } ?>
if someone have an idea how to do it better (in more than 2 columns) please let me know
Re: option image in more columns[SOLVED]
Posted: Fri Apr 06, 2012 8:19 am
by DSGI
I just broke the option images table up and made divs out of it and used CSS to style the Option Images accordingly. I also used the VQMOD to enlarge my image options to 200px by 200px. Below is the changes I made:
Code: Select all
<?php } ?>
<?php if ($option['type'] == 'image') { ?>
<div id="option-<?php echo $option['product_option_id']; ?>" class="option">
<div class="option-title"><?php if ($option['required']) { ?>
<!--<span class="required">*</span>-->
<?php } ?>
<b><?php echo $option['name']; ?>:</b><br /></div>
<div class="option-image">
<?php foreach ($option['option_value'] as $option_value) { ?>
<div class="option-image-item"><div class="option-image-name-price"><label for="option-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><div class="option-image-image"><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></div><div class="option-image-radio"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></div>
</div>
<?php } ?>
</div>
</div>
Re: option image in more columns[SOLVED]
Posted: Wed May 02, 2012 6:50 am
by shimapi
Thank you very much for your reply! It was the solution for my need.
I don't know how to do the VQMOD but, I solve that by changing directly on the controller product file. I don't know if is ok, but it worked for me.
I Changed this
'image' => $this->model_tool_image->resize($option_value['image'], 50, 50),
to this:
'image' => $this->model_tool_image->resize($option_value['image'], 80, 80),
Thanks!!
DSGI wrote:I just broke the option images table up and made divs out of it and used CSS to style the Option Images accordingly. I also used the VQMOD to enlarge my image options to 200px by 200px. Below is the changes I made:
Code: Select all
<?php } ?>
<?php if ($option['type'] == 'image') { ?>
<div id="option-<?php echo $option['product_option_id']; ?>" class="option">
<div class="option-title"><?php if ($option['required']) { ?>
<!--<span class="required">*</span>-->
<?php } ?>
<b><?php echo $option['name']; ?>:</b><br /></div>
<div class="option-image">
<?php foreach ($option['option_value'] as $option_value) { ?>
<div class="option-image-item"><div class="option-image-name-price"><label for="option-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><div class="option-image-image"><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></div><div class="option-image-radio"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></div>
</div>
<?php } ?>
</div>
</div>
Re: option image in more columns[SOLVED]
Posted: Wed May 01, 2013 8:49 pm
by Elboy
You could just try
Code: Select all
.option-image tr {
display: inline;
}
Re: option image in more columns[SOLVED]
Posted: Sun Jun 16, 2013 1:44 am
by gartheman
Elboy wrote:You could just try
Code: Select all
.option-image tr {
display: inline;
}
excellent, thanks for that. these forums need a thank button
Re: option image in more columns[SOLVED]
Posted: Fri Jul 18, 2014 9:27 am
by gcextreme
where do u insert that at?
Re: option image in more columns[SOLVED]
Posted: Wed Jul 30, 2014 5:32 pm
by kjshier
You insert this anywhere in the stylesheet.css file.
It works a treat but they dont line up very well.
Much better than a two mile high page though.
