Can't find table source in Welcome Email

[ssolis5788]

I am using 1.3.8a (upgraded from 1.3.7 over a year ago), and am trying to modify a box in the welcome email - see screen shot below.

I want to change the size of the yellow box to be the same length as my logo but cannot find the source code. Can someone point me in the right direction? Thanks.

[DrByte]

What is the raw HTML from that particular email message?

[ssolis5788]

What is the raw HTML from that particular email message?

Hi DrByte,

Here is the file I've been working with. If it were html I don't think I'd have a problem finding it, but it is a php file. I'm not sure if there is another one that is being used to create that box (I've highlited the text that is in the box in red):

<?php
/**
* @package languageDefines
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: create_account.php 5745 2007-02-01 00:52:06Z ajeh $
*/
define('NAVBAR_TITLE', 'Create an Account');
define('HEADING_TITLE', 'My Account Information');
define('TEXT_ORIGIN_LOGIN', '<strong class="note">NOTE:</strong> If you already have an account with us, please login at the <a href="%s">login page</a>.');
// greeting salutation
define('EMAIL_SUBJECT', 'Welcome to ' . STORE_NAME);
define('EMAIL_GREET_MR', 'Dear Mr. %s,' . "\n\n");
define('EMAIL_GREET_MS', 'Dear Ms. %s,' . "\n\n");
define('EMAIL_GREET_NONE', 'Dear %s' . "\n\n");
// First line of the greeting
define('EMAIL_WELCOME', 'We wish to welcome you to <strong>' . STORE_NAME . '</strong>.');
define('EMAIL_SEPARATOR', '--------------------');
define('EMAIL_COUPON_INCENTIVE_HEADER', 'Congratulations! To make your next visit to our online shop a more rewarding experience, listed below are details for a <br>Discount Coupon created just for you!' . "\n\n");
define('EMAIL_COUPON_REDEEM', 'To use the Discount Coupon, enter the ' . TEXT_GV_REDEEM . ' code during checkout: <strong>%s</strong>' . "\n\n");
define('TEXT_COUPON_HELP_DATE', '');
define('EMAIL_GV_INCENTIVE_HEADER', 'Just for stopping by today, we have sent you a ' . TEXT_GV_NAME . ' for %s!' . "\n");
define('EMAIL_GV_REDEEM', 'The ' . TEXT_GV_NAME . ' ' . TEXT_GV_REDEEM . ' is: %s ' . "\n\n" . 'You can enter the ' . TEXT_GV_REDEEM . ' during Checkout, after making your selections in the store. ');
define('EMAIL_GV_LINK', ' Or, you may redeem it now by following this link: ' . "\n");
// GV link will automatically be included before this line
define('EMAIL_GV_LINK_OTHER','Once you have added the ' . TEXT_GV_NAME . ' to your account, you may use the ' . TEXT_GV_NAME . ' for yourself, or send it to a friend!' . "\n\n");
define('EMAIL_TEXT', 'With your account, you can now take part in the <strong>various services</strong> we have to offer you. Some of these services include:' . "\n\n" . '<li><strong>Permanent Cart</strong> - Any products added to your online cart remain there until you remove them, or check them out.' . "\n\n" . '<li><strong>Address Book</strong> - We can now deliver your products to another address other than yours! This is perfect to send birthday <br>gifts direct to the birthday-person themselves.' . "\n\n" . '<li><strong>Order History</strong> - View your history of purchases that you have made with us.' . "\n\n" . '<li><strong>Products Reviews</strong> - Share your opinions on products with our other customers.' . "\n\n");
define('EMAIL_CONTACT', 'For help with any of our online services, please email me at: <a href="mailto:' . STORE_OWNER_EMAIL_ADDRESS . '">'. STORE_OWNER_EMAIL_ADDRESS ." </a>\n\n");
define('EMAIL_GV_CLOSURE','Sincerely,' . "\n\n" . STORE_OWNER . "\nSRS Custom Printing\n\n". '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'.HTTP_SERVER . DIR_WS_CATALOG ."</a>\n\n");
// email disclaimer - this disclaimer is separate from all other email disclaimers
define('EMAIL_DISCLAIMER_NEW_CUSTOMER', 'This email address was given to us by you or by one of our customers. If you did not signup for an account, or feel that you have received this email in error, please send an email to %s ');
//moved definitions to english.php
//define('TABLE_HEADING_PRIVACY_CONDITIONS', 'Privacy Statement');
//define('TEXT_PRIVACY_CONDITIONS_DESCRIPTION', 'Please acknowledge you agree with our privacy statement by ticking the following box. The privacy statement can be read <a href="' . zen_href_link(FILENAME_PRIVACY, '', 'SSL') . '"><span class="pseudolink">here</span></a>.');
//define('TEXT_PRIVACY_CONDITIONS_CONFIRM', 'I have read and agreed to your privacy statement.');
//define('TABLE_HEADING_ADDRESS_DETAILS', 'Address Details');
//define('TABLE_HEADING_PHONE_FAX_DETAILS', 'Additional Contact Details');
//define('TABLE_HEADING_DATE_OF_BIRTH', 'Verify Your Age');
//define('TABLE_HEADING_LOGIN_DETAILS', 'Login Details');
//define('TABLE_HEADING_REFERRAL_DETAILS', 'Were You Referred to Us?');
?>

Thank you for taking the time to look at this.

[DrByte]

You received the email, which you took a snapshot of.
That email was in HTML format.
Use your email program to look at the raw HTML in the *actual* email.
Then you'll be able to see exactly what part needs changing, with CSS, in the actual email template, which is in the /email/ folder.
https://www.zen-cart.com/tutorials/i...hp?article=113

[ssolis5788]

You received the email, which you took a snapshot of.
That email was in HTML format.
Use your email program to look at the raw HTML in the *actual* email.
Then you'll be able to see exactly what part needs changing, with CSS, in the actual email template, which is in the /email/ folder.
https://www.zen-cart.com/tutorials/i...hp?article=113

I did as instructed and viewed the source code of the email, and I believe I've added the .coupon-block command in the correct area (pasted below in red).

<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
<base href="$BASE_HREF" />
<style type="text/css">
body {background-color:#ffffff; color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:center;}
a:link {color:#0066cc;}
a:hover {background-color:#eeeecc; color:#0066cc;}
a:visited {color:#0066cc;}
.holder {background-color:#f9f9f9; border:1px solid #9a9a9a; font-size:9px; text-align:left; width:550px;}
.header {font-size:10px; padding:0px; width:550px;}
.content {font-size:12px; padding:5px; width:550px;}
.footer {border-top:1px solid #9a9a9a; font-size:9px; margin-top:10px; text-align:center; width:550px;}
.coupon-block { padding: 5px; border: 1px #cccccc solid; background-color: #FFFF99; width:500px; }
.coupon-code {font-weight:bold;}
.content-line {padding:5px; width:550px;}
.disclaimer {background-color:#f9f9f9; border:1px solid #cccccc; font-size:10px; margin-top:10px; padding:5px; width:550px;}
.disclaimer1 {color:#666666; padding:5px;}
.disclaimer1 a:link {color:#666666;}
.disclaimer1 a:visited {color:#666666;}
.disclaimer2 {color:#666666; padding:5px;}
.copyright {border-bottom:0px solid #9a9a9a; padding:5px;}</style>
</head>


What I'm having trouble with is how to incorporate it into the <div> section below (pasted below in red). I'm not sure what $EMAILxxx command to use, or if I'm even doing any of this correctly. Thanks much for your help as always.

<body><div class="holder"><!-- Header Section -->
<div class="header"><img alt="logo" src="email/header.jpg" /> </div><!-- Content Section -->
<div class="content">
<div class="content-line">Dear $EMAIL_FIRST_NAME $EMAIL_LAST_NAME,</div>
<div class="content-line">$EMAIL_MESSAGE_HTML</div>
<div class="coupon-block">
<div class="content-line">$COUPON_TEXT_TO_REDEEM</div>
<div class="content-line">$COUPON_TEXT_VOUCHER_IS <span class="coupon-code">$COUPON_CODE</span> - <span class="coupon-desc">$COUPON_DESCRIPTION</span> </div>
<div class="content-line">$COUPON_TEXT_REMEMBER</div>
<div class="content-line">$COUPON_REDEEM_STORENAME_URL</div></div><!-- Footer Section -->
<div class="footer">
<div class="copyright">$EMAIL_FOOTER_COPYRIGHT</div></div></div>
<div class="disclaimer">
<div class="disclaimer1">$EMAIL_DISCLAIMER</div>
<div class="disclaimer2">$EMAIL_SPAM_DISCLAIMER</div></div></div>
</body>

[DrByte]

Since email clients are notoriously bad for not honoring all CSS standards, you *might* need to change the <div class="holder"> into a table of a fixed width.
Or just don't stretch the email window so wide

[kuroi]

Styling emails is a disaster. It's like a return to the bad old days when you had to test your site in a dozen different browsers and then deal with how each displayed it wrong.

Except that there are more email clients now than there were significant browsers back in those pioneering days, and they do a worse job of rendering emails than the browsers ever did of displaying pages.

If you look at the source behind those snazzy HTML emails that you get each day, most, if not all, will be built using tables. While it chokes me up to have to say it, that's the only semi-reliable way of getting anything other than the most simple display past an email client looking like you designed it.

Your HTML and CSS look fine to me and they display much as you want in my browser. I suspect that the problem is simply that your email client isn't prepared to handle divs nested more than 3 layers deep (your changes take them to four).

Solutions: simplify your layout to reduce the level of nesting, or resort to tables to hold you content in place (I'm close to tears at having to write that twice )

[ssolis5788]

Styling emails is a disaster. It's like a return to the bad old days when you had to test your site in a dozen different browsers and then deal with how each displayed it wrong.

Except that there are more email clients now than there were significant browsers back in those pioneering days, and they do a worse job of rendering emails than the browsers ever did of displaying pages.

If you look at the source behind those snazzy HTML emails that you get each day, most, if not all, will be built using tables. While it chokes me up to have to say it, that's the only semi-reliable way of getting anything other than the most simple display past an email client looking like you designed it.

Your HTML and CSS look fine to me and they display much as you want in my browser. I suspect that the problem is simply that your email client isn't prepared to handle divs nested more than 3 layers deep (your changes take them to four).

Solutions: simplify your layout to reduce the level of nesting, or resort to tables to hold you content in place (I'm close to tears at having to write that twice )

Thanks to you both! It would be a shame to go back to html when there is css out there! . Can I just remove the yellow block? Would that simplify it enough? I've opened this page (email_template_coupon) in Dreamweaver and still cannot seem to get rid of the block. My goal is to have all the text fit within the width of my header. Here is the edited source code now:

<!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=us-ascii" />
<base href="$BASE_HREF" />
<style type="text/css">
body {background-color:#ffffff; color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:center;}
a:link {color:#0066cc;}
a:hover {background-color:#eeeecc; color:#0066cc;}
a:visited {color:#0066cc;}
.holder {background-color:#f9f9f9; border:1px solid #9a9a9a; font-size:9px; text-align:left; width:550px;}
.header {font-size:10px; padding:0px; width:550px;}
.content {font-size:12px; padding:5px; width:550px;}
.footer {border-top:1px solid #9a9a9a; font-size:9px; margin-top:10px; text-align:center; width:550px;}
.coupon-code {font-weight:bold;}
.content-line {padding:5px; width:550px;}
.disclaimer {background-color:#f9f9f9; border:1px solid #cccccc; font-size:10px; margin-top:10px; padding:5px; width:550px;}
.disclaimer1 {color:#666666; padding:5px;}
.disclaimer1 a:link {color:#666666;}
.disclaimer1 a:visited {color:#666666;}
.disclaimer2 {color:#666666; padding:5px;}
.copyright {border-bottom:0px solid #9a9a9a; padding:5px;}</style>
</head>
<body><div class="holder"><!-- Header Section -->
<div class="header"><img alt="logo" src="email/header.jpg" /> </div><!-- Content Section -->
<div class="content">
<div class="content-line">Dear $EMAIL_FIRST_NAME $EMAIL_LAST_NAME,</div>
<div class="content-line">$EMAIL_MESSAGE_HTML</div>
<div class="content-line">$COUPON_TEXT_TO_REDEEM</div>
<div class="content-line">$COUPON_TEXT_VOUCHER_IS <span class="coupon-code">$COUPON_CODE</span> - <span class="coupon-desc">$COUPON_DESCRIPTION</span> </div>
<div class="content-line">$COUPON_TEXT_REMEMBER</div>
<div class="content-line">$COUPON_REDEEM_STORENAME_URL</div></div><!-- Footer Section -->
<div class="footer">
<div class="copyright">$EMAIL_FOOTER_COPYRIGHT</div></div></div>
<div class="disclaimer">
<div class="disclaimer1">$EMAIL_DISCLAIMER</div>
<div class="disclaimer2">$EMAIL_SPAM_DISCLAIMER</div></div>
<div></div>
</body>
</html>

[ssolis5788]

Thanks to you both! It would be a shame to go back to html when there is css out there! . Can I just remove the yellow block? Would that simplify it enough? I've opened this page (email_template_coupon) in Dreamweaver and still cannot seem to get rid of the block. My goal is to have all the text fit within the width of my header. Here is the edited source code now:

<!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=us-ascii" />
<base href="$BASE_HREF" />
<style type="text/css">
body {background-color:#ffffff; color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:center;}
a:link {color:#0066cc;}
a:hover {background-color:#eeeecc; color:#0066cc;}
a:visited {color:#0066cc;}
.holder {background-color:#f9f9f9; border:1px solid #9a9a9a; font-size:9px; text-align:left; width:550px;}
.header {font-size:10px; padding:0px; width:550px;}
.content {font-size:12px; padding:5px; width:550px;}
.footer {border-top:1px solid #9a9a9a; font-size:9px; margin-top:10px; text-align:center; width:550px;}
.coupon-code {font-weight:bold;}
.content-line {padding:5px; width:550px;}
.disclaimer {background-color:#f9f9f9; border:1px solid #cccccc; font-size:10px; margin-top:10px; padding:5px; width:550px;}
.disclaimer1 {color:#666666; padding:5px;}
.disclaimer1 a:link {color:#666666;}
.disclaimer1 a:visited {color:#666666;}
.disclaimer2 {color:#666666; padding:5px;}
.copyright {border-bottom:0px solid #9a9a9a; padding:5px;}</style>
</head>
<body><div class="holder"><!-- Header Section -->
<div class="header"><img alt="logo" src="email/header.jpg" /> </div><!-- Content Section -->
<div class="content">
<div class="content-line">Dear $EMAIL_FIRST_NAME $EMAIL_LAST_NAME,</div>
<div class="content-line">$EMAIL_MESSAGE_HTML</div>
<div class="content-line">$COUPON_TEXT_TO_REDEEM</div>
<div class="content-line">$COUPON_TEXT_VOUCHER_IS <span class="coupon-code">$COUPON_CODE</span> - <span class="coupon-desc">$COUPON_DESCRIPTION</span> </div>
<div class="content-line">$COUPON_TEXT_REMEMBER</div>
<div class="content-line">$COUPON_REDEEM_STORENAME_URL</div></div><!-- Footer Section -->
<div class="footer">
<div class="copyright">$EMAIL_FOOTER_COPYRIGHT</div></div></div>
<div class="disclaimer">
<div class="disclaimer1">$EMAIL_DISCLAIMER</div>
<div class="disclaimer2">$EMAIL_SPAM_DISCLAIMER</div></div>
<div></div>
</body>
</html>

Well, I've spent the last 3 days looking for the code that controls the yellow box, but cannot find it. I've also tried inserting html code, but I guess I'm not integrating it with css properly because the form then does not work. Can someone please let me know where the fix is for this? Thanks!

[kuroi]

The code that you're posting doesn't have a yellow box. Your earlier version did, but you've removed the CSS that was colouring it yellow.

Are you saying that it is still showing as yellow in your emails. If so, I'd check that your changes are finding their way to the right place on your server.

If that's not the issue, then you're going to need to spell it out a bit more for those of us who haven't been living, breathing and sleeping with it for the past few days.