Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 461
  • Last Modified:

How to add a background image to newsletter for outlook

Hi,
I have to code a newsletter for Outlook but unable to call the background images which has to be placed at the center of the screen.
Please help.. it's urgent.
0
qwerty021600
Asked:
qwerty021600
1 Solution
 
syedyounusCommented:
How you are trying to add the background images, i.e with the help of any programming languages ?
0
 
sajayj2009Commented:
<td style="background:url("imagename") top center no-repeat;
0
 
qwerty021600Author Commented:
@ syedyounus: I am using HTML
sajayj2009: this doesnot work in Outlook :(
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
sajayj2009Commented:
Could you please specify where it is not showing. code please?
0
 
qwerty021600Author Commented:
i created a newsletter in html and call it on outlook. it is showing all the foreground images but not the background one..
it is showing in the HTML page rendered in any of the browser but not on the mail i compose..
i need a solution of how to display it in the new mail message
0
 
sajayj2009Commented:
paste your source code here...the part where u embedded bg image
0
 
sajayj2009Commented:
Have you try adding html using email stationary?
0
 
qwerty021600Author Commented:
Yes.. did that way as well.. but it didn't work :(
0
 
sajayj2009Commented:
plz paste your source code here...the part where u embedded bg image
0
 
qwerty021600Author Commented:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>GLO Mailer</title>
</head>
<body>
<table width="990" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="990" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="4"><img src="top-left-bar.gif" width="4" height="84" /></td>
        <td width="521" background="top-bg.gif" style="height: 84px;"><img src="glo-logo.gif" alt="GlobalLogic" width="121" height="46" /></td>
        <td width="460" style="background-image: url(top-bg.gif); background-repeat: repeat-x; height: 84px;"><img src="mailer-header.gif" width="479" height="27" /></td>
        <td width="5" align="left" class="header-bg"><img src="top-right-bar.gif" width="4" height="84" /></td>
      </tr>
    </table>
    <!-- End of Header Table -->
    </td>
  </tr>
   <tr>
    <td>
    <!-- Content Table -->
    <table width="989" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="background-image: url('mailer-bg.gif'); background-repeat: no-repeat; background-position: center 70%; border-left: 1px solid #095fbb; border-right: 1px solid #095fbb;">
     <tr>
    <td colspan="2" height="1px" bgcolor="#095fbb"></td>
  </tr>
  <tr>
    <td colspan="2" height="3px" bgcolor="#c9d2df"></td>
  </tr>
      <tr>
        <td colspan="2" style="padding: 5px;"><p style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;">Dear All,</p>
          <p style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #4e4a40;">The vision of the platform is that as we grow in size as a company - we continue to utilize the collective intelligence of our people. Our size is an asset for us. The larger we get - the better we become at ensuring integrity, openness, teamwork and innovation. The platform is still in beta stage and we are bringing in features one-by-one.</p></td>
        </tr>
      <tr>
        <td colspan="2">&nbsp;</td>
       </tr>
      <tr>
        <td valign="top" style="padding-left: 5px; padding-top: 1px;"><img src="bullets.gif" width="15" height="15" /></td>
        <td style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;">Rate Any Person in the organization anonymously<br />
          <span style="color: #4e4a40;">You can login and rate (on a scale of 1 to 5) anybody in the organization  on their professional or personal skills. Your ratings are anonymous. Nobody knows what ratings you have given.</span></td>
      </tr>
       <tr>
        <td colspan="2">&nbsp;</td>
       </tr>
      <tr>
        <td valign="top" style="padding-left: 5px; padding-top: 1px;"><img src="bullets.gif" width="15" height="15" /></td>
        <td style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;">View Public Ratings<br />
          <span style="color: #4e4a40;">View what people think about anybody in the organization. You can view aggregated public or private ratings of anybody in the organization.
</span></td>
      </tr> <tr>
        <td colspan="2">&nbsp;</td>
       </tr>
      <tr>
        <td valign="top" style="padding-left: 5px; padding-top: 1px;"><img src="bullets.gif" width="15" height="15" /></td>
        <td style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;">Leave anonymous comments<br />
          <span style="color: #4e4a40;">You can leave anonymous comments or feedback for anybody. Only they will be able to see the comments. </span></td>
      </tr>
      <tr>
        <td colspan="2" valign="top">&nbsp;</td>
        </tr>
          <tr>
        <td colspan="2" valign="top">&nbsp;</td>
        </tr>
           <tr>
    <td colspan="2" height="2px" bgcolor="#095fbb"></td>
  </tr>
    </table></td>
  </tr>
  <tr>
  <td>
  <table border="0" cellpadding="0" cellspacing="0">
  <tr>
  <td><img src="../Images/bottom-bar.gif" width="990" height="6" /></td>
  </tr>
  </table>
  </td>
  </tr>  
</table>
</body>
</html>

add ur own images and try this one
0
 
sajayj2009Commented:
Which outlook version?
0
 
sajayj2009Commented:
Apart from outlook express, forget.
0
 
sajayj2009Commented:
You need to make that one image...
0
 
qwerty021600Author Commented:
Outlook 2003 and 2007
i kno dat's a workaround .. but want to go for a right solution which will work actually.
0
 
sajayj2009Commented:
Sorry outbound my knowledge
0
 
qwerty021600Author Commented:
no probs....thx fr ur effort bt srry i can't award u points even
0
 
sajayj2009Commented:
All point in this question goes for you!!
0
 
sajayj2009Commented:
I hope this would help you for a solution.

http://office.microsoft.com/en-us/outlook/HA010549271033.aspx
0
 
sajayj2009Commented:
qwerty:

Any updates?
0
 
s8webCommented:
Your "<td style="background:url("imagename") top center no-repeat;"> has to call an image that is available from the web, i.e.:

<td style="background:url("http://www.domain.com/imagename") top center no-repeat;>

Otherwise the source is pointing to the local machine.
0
 
vasudev_bhatCommented:
background dont seem to work on outlook. this is prob a bug in MS outlook
0
 
qwerty021600Author Commented:
@ sajayj2009 : no solution found till date :(
@ s8web : tried this .. bt no effect..
0
 
qwerty021600Author Commented:
this is for your efforts :)
0

Featured Post

Veeam Disaster Recovery in Microsoft Azure

Veeam PN for Microsoft Azure is a FREE solution designed to simplify and automate the setup of a DR site in Microsoft Azure using lightweight software-defined networking. It reduces the complexity of VPN deployments and is designed for businesses of ALL sizes.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now