#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2012
    Posts
    11
    Rep 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
  2. #2
  3. The Queen of Typos
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Sep 2004
    Location
    San Clemente
    Posts
    1,471
    Rep Power
    191
    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.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2012
    Posts
    11
    Rep Power
    0
    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
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2012
    Posts
    22
    Rep 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.
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2012
    Posts
    2
    Rep Power
    0

    Arrow Process in brief.............!!


    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/

    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 09:54 AM. Reason: added [code] tags and the URL to the source of the article
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2012
    Posts
    8
    Rep Power
    0
    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.
  12. #7
  13. No Profile Picture
    Permanently Banned
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2012
    Posts
    2
    Rep 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.
  14. #8
  15. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,131
    Rep Power
    4304
    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.

    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.

    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.

    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).

IMN logo majestic logo threadwatch logo seochat tools logo