HTML Emails and background images in Dreamweaver

Hello. I created a HTML email in Dreamweaver. The original design came out of Indesign and had very specific background art. I removed all the text out of the Indesign and created a jpg. I took this jpg in Photoship and sliced and optimized it. I imported this HTML into Dreamweaver. Here I need to add in all the text (which is variable). I was originally thinking that you can only place background images with CSS. But I was told that you should not use CSS for HTML emails. So instead I left all the background art as normal images inside of a table. At this point I need to add text over these images. They only way I could figure out to do it was to add a div tag right over the image and type into there. This seemed to work fine but when I tested it in some emails all the div tags with text showed up under the table with images. This needed to display over. What is the best way to handle this issue? Thank you in advance.
Melanie

Sorry, but you cannot layer text over images in emails. Simplify your design or make an image with text on it in Photoshop. Use absolute URLs to images on your web server. And give people who can't see graphics and HTML pages in their email client a link to the HTML page on your web server.
How to Code HTML Emails
http://www.sitepoint.com/article/code-html-email-newsletters/
Chart showing how various email clients handle CSS.
http://www.campaignmonitor.com/css/
Download some HTML Email Templates from the links below to get started.
Mail Chimp
http://www.mailchimp.com/resources/html_email_templates/
Constant Contact
http://www.constantcontact.com/email-marketing/html-email-templates/index.jsp
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Similar Messages

I need help Centering a div box to a background image using dreamweaver cs5.5.

I need help Centering a div box to a background image using dreamweaver cs5.5. Everything shift left when viewing on different size monitors? See what I mean at
www.woodlandhospice.com

Have you looked at your page with images disabled?
I urge you to re-think this approach to web design because images of text are not indexed by search engines, screen readers or translators. Given the demographic group your site is targeting, you really need to ensure maximum web accessibility for all users.
Navigation, headings and descriptions all need to be in real text -- not images of text.
Ken is right. Absolute positioning is pure poison for such a simple layout. My advice is to start over with one of the pre-built Starter Pages in DW. Go to File > New > Blank page > HTML. Select a layout from the 3rd column and hit CREATE button.
Nancy O.

Using Background Image In Dreamweaver

Good evening.
I'm using a non-repeating, centered background image in Dreamweaver. But i'd like it to self-adjust its size depending upon what monitor size its viewing it. Can someone provide some coding for help with this???
Here's where i'm at thus far..
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="welcome10.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body style="background-color: #000; background-position: center top; background-repeat: no-repeat; background-image: url(images/girls-bg9.jpg); background-attachment: fixed;">
<div id="wrapper">
          <div id="container">
    </div>
</div>
</body>
</html>
css -
@charset "utf-8";
/* CSS Document */
#wrapper{
          width: auto;
          height: 1600px;
#container {
          background-color: #FFF;
          height: 200px;
          margin-right: 100px;
          margin-left: 100px;
          margin-top: 100px;
thanks guys, and gals...

Background-size would do the trick, but keep in mind, most CSS3 does not function in IE9 (though this will), and won't at all in IE8 and down. If you need it to work in those browsers, the best way to do it would be with javascript. I've used the script available on this site with some success...
http://louisremi.github.io/jquery.backgroundSize.js/demo/

Background image in Dreamweaver CS3

When I set my background image in Dreamweaver it shows on the "Design", although when previewed on a browser it does not show. I've checked the directory and it seems fine. What is causing this?

Modify-->Page Properties, Im using css but not for the page background. I tried previewing the page locally and I have tried it on the server. The entire site root folder was uploaded which has the background.

BIS users in Pakistan::: HTML email view with images

Mobilink, service provider, has updated their BIS to 2.5 in July. But they are unable to provide HTML email view with images on Blackberry sets running on ver. 4.5.
Mobilink says that it is only available to BES users at the moment. BIS users will get it late on.
Please explain, is it a Mobilink issue or RIM? as all around the world BIS users are getiing it.

i dont beleive this. RIM wont leave out Mobilink, infact they cant. The upgrade was done on BIS servers across the board not for some service providers. You probably wanna try another device or may be re-install oS On device?
chk this thread: http://supportforums.blackberry.com/rim/board/message?board.id=BlackBerryInternetSolution&thread.id=...
Click on KUDOS to appreciate our efforts and mark the thread RESOLVED if your issue is resolved.

Not seeing div background image in Dreamweaver! Why?

I'm not seeing div backgrounds in Dreamweaver! When I load the files onto my server I can see them in my browser! But I'm not seeing them in Dreamweaver. Here's my code on my .aspx pg:
<link href="styles/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="hdr">
</div>
</div>
</body>
And here's a link to the web page on my server:
http://amcenergy.com/ee_site1/index.aspx
I need to put text on top of the div's background image, but it's kinda hard if I can't see the background image in Dreamweaver.
Hope someone can help!
Thanks so much!!

Horizontal-align is not a valid CSS property.
http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Famce nergy.com%2Fee_site1%2Findex.aspx
Try removing it.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Html email and other email related problems

Hi, i recently ahd my 8330(vzw) replaced i ran the restore and everything works fine, except... I cannot get HTML email, and my "more" command gives " more request cannot be completed...etc" error. ive reactivated (*228) battery pulled, registered the phone, resent service books, im out of ideas. So i come to you guys for new ones. Thanks

Welcome to the forums
In your email list, press menu/blackberry button, Options>Email Settings. Under there, for each email address, set "enable html email" to "yes" and set "download images automatically" to "Yes".
See how that works for you.
Cheers,
Kijana
Please remember to:
1. Mark Accept as Solution on the appropriate post once your issue has been resolved
2. Give Kudos to helpful posts (click the star next to the post)
Thanks

Ringtones and background images not available after call manager upgrade

Hi,
We have upgraded our call manager from version 8.5 to 10.5. Once after the upgrade we lost all the Ringtones and background images except the two default ringtone and background images. we got 8945 sccp phones(running 9-3-1 firmware) and 9951 sip phones(running 9-4-1 firmware). Both these phones lost these list. However the ringlist.xml is available in the tftp server with all the ringtones and the phones are pointed to the right tftp servers. I tried to restart the tftp servers and tried again, however that didn't help. we are using call manager 10.5 and h323 voice gateway. Could anyone please help on this.
Thanks
Barry

Hi Tony,
I can see the ringtone files in the call manager (osadmin>tftp file mgmt), i have also restarted the tftp services, but it didn't help. I believe you advised to re-upload the ringlist file (Ringlist.xml) and try again. I will try this and update you. Please let me know if you have any other suggestions.
Thanks
Barry

Send HTML Email with Embedded Images and CSS

Hi All,
I have a html page. I want to send that html page(not with attachment) with all images and css. i search and try but I cant find a good solution. can any one help... plz..........
Thank You.....

If you want to send the html page and have it
reference the images and css files on your web
site, that's pretty easy. Just create a message
with text/html content that is your html page.
If you want to include all the images and css files
in your message along with the html page, you'll
need to create a multipart/related message and
you'll need to change all the html to reference the
images and css files using "cid:" references.

HTML Email and layers

Hi,
I created an HTML file in Dreamweaver to be used for an
E-blast (html email). The html file has images and the text is in
two layers which sit on top of the images. It previews great in
Explorer, no problems.
When I go to put it into the email, it separates the layers
with the text and the rest of the html file. In other words, I see
the text first, formatted as it shouldbe and then below that is the
rest of the html file with the images. Does that make sense?
Any ideas what I can do to keep the layers where they should
be? I thought I had done this in the past but maybe not.
Thanks for any help!
Mina

Not so. If you are going to use positioning in an email, make
sure that the
styles are either inline, or in a stylesheet embedded between
<body> and
</body>.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Mad Dog" <[email protected]> wrote in message
news:e6a5a3$26g$[email protected]..
> Don't use positioned divs in an email. A lot of email
clients don't like
> 'em.
>
> MD
>
>
> MinaHabibi wrote:
>> Hi,
>>
>> I created an HTML file in Dreamweaver to be used for
an E-blast (html
>> email). The html file has images and the text is in
two layers which
>> sit on top of the images. It previews great in
Explorer, no problems.
>>
>> When I go to put it into the email, it separates the
layers with the
>> text and the rest of the html file. In other words,
I see the text
>> first, formatted as it shouldbe and then below that
is the rest of
>> the html file with the images. Does that make sense?
>>
>> Any ideas what I can do to keep the layers where
they should be? I
>> thought I had done this in the past but maybe not.
>>
>> Thanks for any help!
>> Mina
>
>

Main Wrapper, Container and background-image repeat problem-and Footer :-)

Hi everyone,
First off, i tried almost every idea i could get to solve this on my own but now im...aaa...
Well, the problem is i have a main wrapper with a background image repeat. A header,menu, body container - which has a left column and right column. I want that main wrapper,body container and both of the columns to grow auto according to content. I tried the height:100%. When i float the columns the text from left column spills over on to the footer. The left column also does not autogrow towards the footer?! I was able to set the footer at the bottom which i want it to remain at the bottom of the main wrapper, but the main wrapper and the columns do not grow automatically...I guess it has something to do with float and the clear properties but what???
body{
margin: 0;
padding: 0;
font-weight: normal;
font-style: normal;
font-size: 11px;
font-family: verdana;
text-align: center;
background:url(back_index3.png) repeat-x scroll 0 0 #E4E4E4;
#main_wrapper {
width: 959px;
margin:0 auto;
margin-top:80px;
background:url(backslice.png) repeat-y;
height:auto;
min-height:800px;
#header {
width: 959px;
margin-left: auto;
margin-right: auto;
height:119px;
background:red;
padding-top: 0px;
padding-bottom: 0px;
#topmenu {
background-color:#blue;
height:30px;
margin:0px;
width: 959px;
margin-left: auto;
margin-right: auto;
#body_container {
height:100%;
width: 949px;
margin: 0 auto;
#content {
float:left;
width: 645px;
background:yellow;
border-right:1px solid #ffffff;
padding:10px;
height:100%;
text-align:left;
#sidebar {
float:left;
width: 283px;
background:#234234;
height:100%;
#footer {
clear:both;
height:200px;
background-color: #686768;
margin:0 auto;
border-top: 1px solid #F6F6F6;
text-align:center;
width: 100%;
<html xmlns="">
<head>
<title>title</title>
<link rel="stylesheet" type="text/css" href="3css.css" />
<meta http-equiv="content-type" content="text/html" />
</head>
<body>
<div id="main_wrapper">
     <div id="header">
      <span id="header_logo">title</span>
     </div>
     <div id="topmenu">
     menu
     </div>
     <div id="body_container">
      <div id="content">
content to be added
      </div>
      <div id="sidebar">
      hallow2
      </div>
     </div>
</div>
<div id="footer">
asd
</div>
</body>
</html>
Thanks in advance if somebody can help me out here.
you can see an image of the problem in the attachement down thr... thnx

<html xmlns="">
<head>
<title>title</title>
<link rel="stylesheet" type="text/css" href="3css.css" />
<meta http-equiv="content-type" content="text/html" />
</head>
<body>
<div id="main_wrapper">
     <div id="header">
      <span id="header_logo">title</span>
     </div>
     <div id="topmenu">
     menu
     </div>
     <div id="body_container">
      <div id="content">
content to be added
      </div>
      <div id="sidebar">
      hallow2
      </div>
     </div>
</div>
<br clear="all" />
<div id="footer">
asd
</div>
</body>
</html>
Hope this will work well

Background image in dreamweaver help?

Thanks for looking,
I have this menu I made:
http://www.ivoog.com/link4
How can I make the background image fit? You can see that its
kindof messed up. How do I make it fit? Please explain or show.
Thanks!

As explained in previous posts, you cannot do what you want
without using
one of the alternatives mentioned now in this post and all
the previous
ones..
The offer still stands from the previous few posts.
I'd be happy to help.
Make the menu in pop menu magic, post the page, and I'll be
happy to show
you how to change the CSS and use a repeating background
texture image and
borders to make them look like you want.
Take care,
Tim
"hahahaadobeman" <[email protected]> wrote
in message
news:fotb49$5pe$[email protected]..
> Thanks for looking,
> I have this menu I made:
>
>
http://www.ivoog.com/link4
>
> How can I make the background image fit? You can see
that its kindof
> messed
> up. How do I make it fit? Please explain or show.
Thanks!
>

UTL_SMTP send HTML email with embedded image?

Hi, I can use UTL_SMTP to send an HTML email ok, but does anyone have an example of how to include an inline embedded image in the email? Thanks!

If you want to send the html page and have it
reference the images and css files on your web
site, that's pretty easy. Just create a message
with text/html content that is your html page.
If you want to include all the images and css files
in your message along with the html page, you'll
need to create a multipart/related message and
you'll need to change all the html to reference the
images and css files using "cid:" references.

How to make a fixed background image in Dreamweaver CC

I'm trying to make my background image fixed so when I scroll down in Dreamweaver CC it stays completely still, could someone please tell me how to do that?

You've got a lot of code that you don't need. And I'm very dubious about the file:/// path to your image. Are you working in a Defined Local Site Folder? The image path should be pointing to your site, not files:/// on your local hard drive.
body {
background:#000 url(concept_watch_dogs___wallpaper_1366x768_by_mackintosh141-d6led76.jpg) no-repeat center center fixed;
Nancy O.

Importing A Combo Banner/Menu Bar And Background Image

Hi,
In one Photoshop file, I've created a banner/menu bar, as well as what I would like to use as the background image for what appears on the remainder of the page. The menu items are not in a box of any sort. And everything is on a separate layer. The image that appears below is one I made up as an example of what I'm talking about. Can I import it into Dreamweaver as one file? Or should I make one file for the banner/menu bar, and one for the rest of the page?
Thank you.

Hi,
I believe it is best to import everything individually in most/all circumstances. When you are talking about banner images or background images think about the size of the file you are exporting from Photoshop. A 'Save for Web' image will be a lot bigger if it includes everything on the page, compared to the individual size of your banner, and therefore will increase the page load times etc.
So, you can create a photoshop file with your whole layout on there, but then crop each of the elements on its own before saving for web. Even each individual menu item.

HTML Emails and background images in Dreamweaver

Similar Messages

Maybe you are looking for