Using Media Image Product Attributes
This is perhaps a bit of a hidden gem with Magento, because it can be extremely useful when needed. Here’s a scenario: your client wants an image on their product page which is detached from the main image gallery. A solution may be a text field or dropdown attribute, which can be used to enter a URL to the chosen image. This won’t help clients who want to add new images though unless they have sufficient FTP privelages – we all know that this can have similar consequences as letting a bull loose in a china shop, then pricking its ass with a needle.
The solution is a media image attribute, this is how to set one up…
1) Create ‘Media Image’ attribute
Step one is pretty self explanatory – set up the attribute, rewrite your indexes and add to one of your attribute sets. You’ll notice that when you choose this attribute type all the other options disappear, which is nice cos it speeds things up! Make sure you give it an understandable frontend label too.
2) Upload image to the product
It only took me a few seconds to realise that the attribute locates itself on the ‘Images’ tab of your product edit form. You simply need to upload the image that you wish to upload to use for it. In my example I’m uploading a basic ‘Sale’ banner. Once it’s uploaded, you can set it to your new attribute label by clicking the radio button and also, setting it to ‘Exclude’ itself from the main image gallery (see below).
3) Bring out on product page
The final step is to add the code required to make this image appear where you need it to show.
<?php if ($_product->getBanner() != "no_selection") : ?>
<img src="<?php echo $this->helper('catalog/image')->init($_product, 'banner'); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" />
<?php endif; ?>
The initial conditional is essential if you wish to avoid an epic Magento error message. The final result will look something like this:
Hope this comes in useful, thanks for reading the Magento Blog at E-commerce Web Design!
Adam is Ecommerce Manager and a PHP developer at Creare Group. Adam is responsible for training Magento development within the company. Follow Adam on Twitter: http://twitter.com/adampmoss. - Read my other posts.
I was just wondering if you might have come across the problem of displaying custom image attributes on the tag cloud results view.
On our products page grid we use the tag cloud to allow customers to sort through the products. If you click on the small white arrow on one of the chair images it will rotate through 3 custom image attributes. But if you then click on one of the tags to the left hand side and try doing the same it just pulls in the magento placeholder image.
Here is the page.
http://www.thesilkwoodchair.com/chairs.html
If you have any suggestions it would be greatly appreciated.
More details of what I’ve tried so far are here http://magento-forum.co.uk/viewtopic.php?f=5&t=903
Great article, exactly what I was looking for. However, when I plugin your code to /view.html, the banner displays for that specific attribute set just fine, but if I go to any other set I get the dreaded magento error. Any help?
The simple way to solve the magento error is :
1) Create a 1px x 1px transparent PNG file and save it in your hardisk.
2) In Magento go to System -> Configuration -> Catalog -> Placeholder -> click on your new field, then select the png file.
That´s it, it is a stupid solution, so products without new “meda image” will show a transparent image.
Of course the best way is to solve this question is by code, but i don´t know how.
Cheers from Brazil.
Ps. Magento Rockz!
Thanks Adam for this good post.
I was having issue with products for whom this attribute was not applied.
Fixed it by changing line
to
regards,
Vishal Gaikwad
Hi,
Here is a scenerio, on my products page I want to add an image of the product dimensions but for this image I want to use thumbnail which is different from the actual image which will say Dimensions. This will be applied to all the products across the store. So there will be one thumnail image for all the products that will be associated with it’s dimensional image. I want to show it on the gallery page as last image.
Any help would be greatly appreciated.
Regards,
Avian
Thanks for the articel, i was searching for the new attribute where i added it in the attributeset .. : )
cheers,
matthias from Webdesign München
Thanks for the article, Very useful to me.
I am trying to implement this in a static block though.
Can anyone help?
hello
How to display in list.phtml ( category magento ) The attribut can’t be displaying in list.
Hi, i follow everything, but im not able to show the image in list.phtml. The att was created, I full it up in catalog, but it still saying that there is not image file.
Strange.
anyway, thanks a lot for this post. Congrats.
Not worked. I tried it many times on version 1.6 and version 1.7 but option is not displaying on admin.
FYI, I also ‘used in product listing – YES’ but no luck
Will you please please help me out why its not working for me. any help will be great
Well made. Can I implement this on a static block on the product page?