Post by mirabelleza » Tue Nov 01, 2011 5:03 am

My client offers a few options of each item, and she wants the customers to see what those options looks like. So i have created the image option for her product pages, and everything looks fantastic. Except that the images are small, and you can't really see the details in the image. Is there a way to make these thumbnails enlarge, just like the product images.

I tried adding the fancy box code to the option image section in product.tpl, and it show the pop-up but of the product images and not the option image.

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 class="option-image">
              <?php foreach ($option['option_value'] as $option_value) { ?>
              <tr>
                <td style="width: 1px;"><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']; ?>" /></td>
                <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><a href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>" class="fancybox" rel="fancybox"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" id="image" /></a></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>
              </tr>
              <?php } ?>

New member

Posts

Joined
Mon Oct 04, 2010 4:36 am

Post by mirabelleza » Tue Nov 01, 2011 5:16 am

Ok so I realized that the href and the src didn't match, so now they both have the same line of code. The popup show up, but image is still really small.

here is the update i made:

Code: Select all

<td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><a href="<?php echo $option_value['image']; ?>" title="<?php echo $heading_title; ?>" class="fancybox" rel="fancybox"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" id="image" /></a></label></td>

New member

Posts

Joined
Mon Oct 04, 2010 4:36 am

Post by mirabelleza » Tue Nov 01, 2011 6:02 am

I found this, in controller/product/product.php

Code: Select all

'image'                   => $this->model_tool_image->resize($option_value['image'], 50, 50),
So I am able to change the thumb size, but i want to be able to make it enlarge in a popup. Any ideas? Anyone?

New member

Posts

Joined
Mon Oct 04, 2010 4:36 am

Post by Qphoria » Tue Nov 01, 2011 7:38 am


Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by Concept211 » Fri Jan 27, 2012 11:14 pm

I went ahead and created a vQmod for this since I couldn't find a proper solution anywhere else:
http://www.opencart.com/index.php?route ... on_id=4768

Enjoy! ;)

User avatar
New member

Posts

Joined
Fri Oct 14, 2011 1:40 am

Post by vince805 » Thu Apr 26, 2012 3:25 am

Thanks Concept211 for that mod! I don't use fancybox though, so after I changed that to colorbox everything is working awesome!

Newbie

Posts

Joined
Thu Apr 26, 2012 3:24 am

Post by virtualgeorge » Sat Jun 09, 2012 3:21 pm

I wanted to try this out so first tried it with option boost, I see a little square like its trying to pop up something but it didn't work. Saw this in Q's code so maybe that is not ready yet or is that just for the main image swap which does work?

Code: Select all

//(useSwatch NOT YET IMPLEMENTED yet. Leave false for now. WIll be updated in next release)
var useSwatch = false; // Set to true if you want to use smaller image for option image swapping. False to swap main image.
I am trying this in 1.5.2.1
Can someone tell me what I would need to change in Concept211's mod to so the popup works with colorbox?
Something here?

Code: Select all

<a href="<?php echo $option_value['popup']; ?>" title="<?php echo $option['name'] . ': ' . $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" class="fancybox" rel="fancybox-option-<?php echo $option['product_option_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></a>

Active Member

Posts

Joined
Wed Jun 18, 2008 5:57 am
Who is online

Users browsing this forum: No registered users and 17 guests