HTML Programming
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me

The Shed is going Social! Join us on FaceBook and Twitter and chime in on the conversation.

Go Back   Dev Shed Forums > Web Design > HTML Programming
Reload this Page

HTML EMAIL: Background Images


Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old March 5th, 2012, 01:05 AM
PoojaAgrawal PoojaAgrawal is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jan 2012
Posts: 11 PoojaAgrawal User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 4 h 25 m 43 sec
Reputation Power: 0
HTML EMAIL: Background Images
Hi All,
I want to use a background image and have to write text over it. But such type of email is not supported by Outlook. Please suggest me with a very good solution.
Thanks & Regards,
Pooja
Reply With Quote
  #2  
Old March 5th, 2012, 09:20 AM
elkehinze's Avatar
elkehinze elkehinze is offline
The Queen of Typos
Dev Shed Beginner (1000 - 1499 posts)
  
Join Date: Sep 2004
Location: San Clemente
Posts: 1,471 elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level)elkehinze User rank is First Lieutenant (10000 - 20000 Reputation Level) 
Time spent in forums: 2 Weeks 1 Day 5 h 31 m 29 sec
Reputation Power: 189
Send a message via ICQ to elkehinze Send a message via AIM to elkehinze Send a message via MSN to elkehinze Send a message via Yahoo to elkehinze Send a message via Skype to elkehinze
Facebook
Make the image with your text ON the image and then write your text in the alt tag of the image. That's the only way that's going to work for you.
Reply With Quote
  #3  
Old March 22nd, 2012, 11:55 PM
PoojaAgrawal PoojaAgrawal is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jan 2012
Posts: 11 PoojaAgrawal User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 4 h 25 m 43 sec
Reputation Power: 0
Quote:
Originally Posted by elkehinze
Make the image with your text ON the image and then write your text in the alt tag of the image. That's the only way that's going to work for you.


Hi elkehinze,
Can you please explain me again. I am very much depressed about this. Can you help me out in how to add a background image to an email body.

Thanks & Regards,
Pooja
Reply With Quote
  #4  
Old May 3rd, 2012, 05:41 AM
mapitinc mapitinc is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Apr 2012
Posts: 23 mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level)mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level)mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level)mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level)mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level)mapitinc User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 11 h 31 m 15 sec
Reputation Power: 0
@pooja
you can add background image in your outlook by click on header menu button of format and from there click on insert background image. Then add the image from its source area. Then type it as what you want to type on it. Thats it.
Reply With Quote
  #5  
Old May 3rd, 2012, 06:54 AM
myphpdeveloper myphpdeveloper is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2012
Posts: 2 myphpdeveloper User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 51 m 53 sec
Reputation Power: 0
Arrow Process in brief.............!!
Quote:
I want to use a background image and have to write text over it. But such type of email is not supported by Outlook.

http://www.campaignmonitor.com/blog/post/3363/updated-applying-a-background-image-to-html-email/

Quote:
Applying a background image to the body of an HTML email

As outlined in our previous post, 'Add a background image to your email in two simple steps', this method uses a table of width="100%" to ensure that background images display in clients like Gmail. However, Brian Thies' updated approach varies in that it uses Microsoft VML to force images to display in Outlook '07 & '10. Here's the code in two steps. First, there's the Microsoft-specific HTML namespace declaration. Then there's the HTML in the body, a sample of which looks like this:
Code:
<body style="margin:0; padding:0; width:100% !important;">

<!--[if gte mso 9]>
<v:background fill="t">
   <v:fill type="tile" src="YOUR IMAGE LOCATION URL" />
</v:background>
<![endif]-->

<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tr>
    <td align="center" background="YOUR IMAGE LOCATION URL">
    <table width="600" cellpadding="0" cellspacing="0" border="0">
        <tr>
          <td>
             <p> If you can see this over the image, background images are successful. </p>
           </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

</body>

----------------------------------------------------------
For a repeating background image in a table cell:

1. Use the Microsoft HTML namespace declaration featured earlier in this post
2. Adapt the following VML code sample:

Code:
<table width="600" cellpadding="0" cellspacing="0" border="0">
  <tr>
    <!-- Backup background color is #DDDDDD -->
    <td bgcolor="#DDDDDD" style="background-image: url('YOUR IMAGE LOCATION URL');" background="YOUR IMAGE LOCATION URL" width="600" height="120" valign="top">
    <!--[if gte mso 9]>
       <v:rect style="width:600px;height:120px;" strokecolor="none">
          <v:fill type="tile" color="#DDDDDD" src="YOUR IMAGE LOCATION URL" /></v:fill>
       </v:rect>
       <v:shape id="theText" style="position:absolute;width:600px;height:120px;">
       <![endif]-->
    <p>If you can see this over the image, background images are successful.</p>
    <!--[if gte mso 9]>
       </v:shape>
    <![endif]--></td>
  </tr>
</table>
Last edited by Kravvitz : May 3rd, 2012 at 08:54 AM. Reason: added [code] tags and the URL to the source of the article
Reply With Quote
  #6  
Old May 3rd, 2012, 09:52 PM
edwardallene edwardallene is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Mar 2012
Posts: 8 edwardallene User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 53 m 38 sec
Reputation Power: 0
Send a message via Yahoo to edwardallene
This will help me also in making my website an HTML background. wherein I can put the text over the image. I will try your reply codes and wish it would run. Thanks anyway.
Reply With Quote
  #7  
Old May 22nd, 2012, 11:12 PM
keth keth is offline
Permanently Banned
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2012
Posts: 2 keth User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 50 m 48 sec
Reputation Power: 0
Html
hi
HTML is the language in which web pages are written to be interpreted by the server as a graphic interface. Javascipt is similar, but is actually a web-adapted version of actual programming code, intended to write applets (small, web-based applications) for use on websites. They are both a type of code, but html is NOT a programming code. The HTML defines what the webpage looks like, the javascript handles things like counters, games, etc. Other web-based scripting languages, such as php and asp can be used to create entire webpages, but, like Javascript, are generally confined to handling what goes beyond the cosmetics of a website. The cosmetics are what HTML is for.
Reply With Quote
  #8  
Old May 22nd, 2012, 11:27 PM
Kravvitz's Avatar
Kravvitz Kravvitz is offline
CSS & JS/DOM Adept
Dev Shed God 30th Plane (19500 - 19999 posts)
  
Join Date: Jul 2004
Location: USA
Posts: 19,835 Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level) 
Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192
Quote:
Originally Posted by keth
HTML is the language in which web pages are written to be interpreted by the server as a graphic interface.

The server doesn't interpret HTML. That's what the web browser (or other user-agent) does.

Quote:
Originally Posted by keth
Other web-based scripting languages, such as php and asp can be used to create entire webpages

Yes, they generate content which is typically marked up with HTML.

Quote:
Originally Posted by keth
The cosmetics are what HTML is for.

No, cosmetics are what CSS is for.
__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > HTML Programming > HTML EMAIL: Background Images

« Previous Thread | Next Thread »

Developer Shed Advertisers and Affiliates



Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump

Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 


Powered by: vBulletin Version 3.0.5
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.

© 2003-2013 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap