2

Recently we started upgrading our transactional email templates: making it somewhat responsive, work on all devices and more snappy.

For example when you receive an order confirmation, what do you really need to know? Why copy all the order info ot the order you just placed? So we just said: order confirmed, see attachment via http://www.magentocommerce.com/magento-connect/fooman-email-attachments.html

Then we realized that the store logo (almost the only unique bit in a multistore environment) is attached and often doesn't show directly in gmail.

Ths gives us 3 options: option 1: dont show the image at all, just show the store name (they have seen your logo before) option 2: embed the store logo inline. option 3: don't bother, leave as is

Now my question is related to option 2: have you come across some extension that ONLY embeds/inlines* the store logo? I understand there are some extension to inline all images.

And in addition: Is there a place where all the optimized and secret email templates for Magento reside?

Many thanks

Some links: http://www.magentocommerce.com/blog/responsive-design-quick-guide-for-email-templates-and-websites/ http://www.magentocommerce.com/magento-connect/magentron-emailimages.html and an extension from mageex (cannot find)

snh_nl
  • 5,442
  • 13
  • 69
  • 133
  • Your question is unclear and hard to understand. The default Magento email templates already embed the store logo. What did you change to affect this default behavior? – Axel Aug 29 '13 at 18:05

3 Answers3

0

There is a good extension which embeds images directly in the email:

http://www.magentocommerce.com/magento-connect/magentron-emailimages.html

I tested it in Magento 1.7 and it works well. It is unit tested. However, it rewrites some Magento email model, so it might not work with other extensions changing email bevavior (but you could integrate this, since it is open source).

mpaepper
  • 4,700
  • 3
  • 23
  • 42
0

How about this?

Two overlapping divs. If the image is not found the transparent background shows the text underneath. Otherwise the image (but must have white background!!) is shown

<div style="height:30px;width:100%;margin:4px 0;padding:0;">
     <div style="height: 30px; width: 100%; background:transparent 
         url('C:/Users/seanfloor/Desktop/logo_email_ml7.png') no-repeat left center;
         z-index:200; position: absolute">
     </div>
     <div style="height: 30px; width: 100%; z-index:100; position: absolute;
         font:24px/30px "Arial Black", Gadget, sans-serif;">Your test here
     </div>
</div>

UPDATE: I just read that gmail has an issue with backgrounds in DIV, but does support the background in TABLE. But then the code above would not work

onetwo12
  • 103
  • 3
snh_nl
  • 5,442
  • 13
  • 69
  • 133
  • 1
    Using an alt tag in a img tag will produce the same results. If the image doesn't load, the text in the alt tag will appear. – Axel Aug 29 '13 at 19:47
  • I suggest using as little CSS as possible. Email clients often render CSS in different ways or not at all. As Axel mentioned, the ALT text is the way to go here. Also, you might have done this for testing, but your image path shouldn't be a local path. – Sander Mangel Aug 29 '13 at 20:03
  • Thx Axel and I agree Sander. Somehow we just got a little frustrated by email clients do/dont showing images, hence we moved back to text store titles (without the logo). – snh_nl Aug 30 '13 at 18:50
  • @Axel could you move your comment to an answer so snh_nl can vote it as answer and close the question? Thanks :) – Sander Mangel Sep 06 '13 at 09:44
0

Using an alt attribute in an <img> tag will produce the same results.

For example:

<img src="logo.jpg" alt="My Company Name" />

If logo.jpg doesn't load, the text My Company Name will be displayed instead.

Axel
  • 630
  • 3
  • 12