I have a magento store with a custom attribute called free shipping Right now this renders a free shipping icon below the product itself
But I want to make it more appealing by putting a new button on top of the product itself.
Here is the php code for the magento page:
Sample of how a page is rendered: http://www.theprinterdepo.com/lexmark-optra-t640-printer-20g0100
I need to modify the code in gallery.phtml to put the icon on TOP of the product, RIGHT top corner. I will modify the image to be transparent.
This is gallery.phtml file:
<?php $_width=$this->getImageWidth() ?>
<div class="product-image-popup" style="width:<?php echo $_width; ?>px;">
<p class="a-right"><a href="#" onclick="window.close(); return false;"><?php echo $this->__('Close Window') ?></a></p>
<?php if($this->getPreviusImageUrl() || $this->getNextImageUrl()): ?>
<div class="nav">
<?php if($_prevUrl = $this->getPreviusImageUrl()): ?>
<a href="<?php echo $_prevUrl ?>">« <?php echo $this->__('Prev') ?></a>
<?php endif; ?>
<?php if($_nextUrl = $this->getNextImageUrl()): ?>
<a href="<?php echo $_nextUrl ?>"><?php echo $this->__('Next') ?> »</a>
<?php endif; ?>
</div>
<?php endif; ?>
<?php if($_imageTitle = $this->htmlEscape($this->getCurrentImage()->getLabel())): ?>
<h1 class="image-label"><?php echo $_imageTitle ?></h1>
<?php endif; ?>
<img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $this->getImageFile()); ?>"<?php if($_width): ?> width="<?php echo $_width ?>"<?php endif; ?> alt="<?php echo $this->htmlEscape($this->getCurrentImage()->getLabel()) ?>" title="<?php echo $this->htmlEscape($this->getCurrentImage()->getLabel()) ?>" id="product-gallery-image" class="image" />
<?php if($this->getPreviusImageUrl() || $this->getNextImageUrl()): ?>
<div class="nav">
<?php if($_prevUrl = $this->getPreviusImageUrl()): ?>
<a href="<?php echo $_prevUrl ?>">« <?php echo $this->__('Prev') ?></a>
<?php endif; ?>
<?php if($_nextUrl = $this->getNextImageUrl()): ?>
<a href="<?php echo $_nextUrl ?>"><?php echo $this->__('Next') ?> »</a>
<?php endif; ?>
</div>
<?php endif; ?>
<p class="a-right"><a href="#" onclick="window.close(); return false;"><?php echo $this->__('Close Window') ?></a></p>
</div>
<script type="text/javascript">
//<![CDATA[
Event.observe(window, 'load', function(){
var demensions = $('product-gallery-image').getDimensions();
window.resizeTo(demensions.width+90, demensions.height+210);
});
//]]>
</script>
This is view.phtml
<?php $Deal = $_product->getResource()->getAttribute('deal')->getFrontend()->getValue($_product);?>
<?php $onSale = $_product->getResource()->getAttribute('on_sale')->getFrontend()->getValue($_product);?>
<?php $hotItem = $_product->getResource()->getAttribute('hot_item')->getFrontend()->getValue($_product);?>
<?php $freeShip = $_product->getResource()->getAttribute('free_shipping')->getFrontend()->getValue($_product);?>
<?php if($Deal == 'Yes'){ ?>
<img src="<?php echo $this->getSkinUrl('images/depot/icon-deal.gif') ?>" >
<?php } ?>
<?php if($onSale == 'Yes'){ ?>
<img src="<?php echo $this->getSkinUrl('images/depot/icon-sale.gif') ?>" >
<?php } ?>
<?php if($hotItem == 'Yes'){ ?>
<img src="<?php echo $this->getSkinUrl('images/depot/icon-hot.gif') ?>" >
<?php } ?>
<?php if($freeShip == 'Yes'){ ?>
<img src="<?php echo $this->getSkinUrl('images/depot/icon-freeship.gif') ?>" >
<?php }?>