Once again, I’ve managed to solve one fuzzy client request and stayed the weekend to kick this functionality into action.
My confidence in building website functionalities in the web is bursting that there is no impossible for me already, it just depends in time and of course your budget 
well…. as usual I am sharing some code snippet that could help some fellow developers out there.
This is to replace the contents within the .more-views class in media.phtml of the product details.
-
$j(‘.more-views’).html(($j(‘.’+numx)).html());
where numx is the color attribute of the configurable product. this numx also is what I named the class populated hidden within the product detail page.
And is being rendered by this code
-
<?php
-
-
$product = Mage::getModel(‘catalog/product’);
-
$parent = $product->load($_product->getId());
-
$children = Mage::getModel(‘catalog/product_type_configurable’)->getUsedProductCollection($parent);
-
$xxx = $parent->getResource()->getAttribute(‘Color’)->getFrontend()->getValue($parent);
-
foreach($children as $child){
-
$child = $product->load($child->getId()); ?>
-
-
<div style="display:none;">
-
<a href="<?php echo $this->helper(‘catalog/image’)->init($child, ‘image’); ?>" id="<?php echo "link".$child->getResource()->getAttribute(‘Color’)->getFrontend()->getValue($child); ?>">
-
<img src="<?php echo $this->helper(‘catalog/image’)->init($child, ‘image’); ?>" id="<?php echo "img".$child->getResource()->getAttribute(‘Color’)->getFrontend()->getValue($child); ?>" />
-
</a>
-
</div>
-
-
<div style="display:none;">
-
<div class=’<?php echo $child->getResource()->getAttribute(‘Color’)->getFrontend()->getValue($child); ?>‘>
-
<h2><?php echo $this->__(‘mouse over image to zoom’) ?></h2>
-
<ul>
-
<li>
-
<?php
-
$assoc_product = Mage::getModel(‘catalog/product’)->load($child->getId());
-
-
foreach($assoc_product->getMediaGalleryImages() as $assoc_product_img){ ?>
-
-
<a href="<?php echo $this->helper(‘catalog/image’)->init($assoc_product, ‘image’, $assoc_product_img->getFile()); ?>" title="<?php echo $assoc_product->getName();?>" onclick="$(‘image’).src = this.href; $(‘imagex’).src = this.href; return false;">
-
-
<img src="<?php echo $this->helper(‘catalog/image’)->init($assoc_product, ‘thumbnail’, $assoc_product_img->getFile())->resize(70, 70); ?>" alt="<?php echo $this->htmlEscape($assoc_product_img->getLabel()) ?>" title="<?php echo $this->htmlEscape($assoc_product_img->getLabel()) ?>"/>
-
</a>
-
</li>
-
<?php } ?>
-
</div>
-
</div>
-
-
<?php } ?>
Ofcourse only demi Gods can understand this without proper explaination. Just PM me if you need something like this.
As I have search the web, I can’t find any solution in magento with this functionality.
This whole project is way beyond the clients budget. Lucky Him
Hi Julius,
Was nice chatting to you yesterday!
I’ve tried implementing the coeds is media.phtml and configurable.phtml but with no luck. Can you pls show where exactly or attache the modified files? it would be great…
Thanks so much for your help, you save others a LOT of time!
Cheers,
Sharon
Hello Sharon,
I think my complete codes for this are scattered all over my blog. I will post a complete article of the implement later. I am still over whelmed with clients requests here
Looking forward…
Hi Julius,
You have great articles about images in configurable products. I can honestly say that you have the best approaches. It helped me very much. But really it’s very hard to understand the code because there is no explanation
I am sure you are busy with a lot of works, but even a small description would be great. Thank you again.
Yes I understand that this maybe very complicated for some coders to understand. I love to put some details to my explanations. I will post another one by the end of october, because thats the only time we will not be so busy.. take it easy guys…
Hey Julius,
Tried to contact you via skype but with not luck. Do contact me.
Cheers,