A great looking email can reinforce your brand and gives your store that big box look and feel! And who doesn’t want that?

As much of a Zen Cart lover I am I also know that out of the box, ZenCart is not very pretty – but with some simple steps it can be GORGEOUS !

Here is a screen shot of an email your customer receives once they create an account at your store. This is straight out of the box with no customizations to it. Not very pretty – but hey, at least you are branding the Zen Cart name right? Although I highly doubt that is the goal of your business – yes, we love and support Zen, but I would really rather brand my own company!

Here is a basic guide to setting up your Zen Cart store emails so that they can be sent in HTML format and where you can go to design them! (You will need to know HTML to make your emails really stand out though!)

Now remember, not everyone will see your email in HTML mode. Some people have their emails set to only receive text based emails – meaning all the pretty stuff will go away! So you want to make sure you have both your html and text based emails in tip top shape!

Once a customer creates an account they will have the option to view your emails in text or html format. (You can view what a customer has selected in their customer profile!).

Admin Email Settings To Allow HTML Emails:

• Go to CONFIGURATION > EMAIL OPTIONS
• Set the line that reads “Use MIME HTML when Sending Emails” to TRUE
• Set “Email Admin Format?” to HTML
• Go to CONFIGURATION > CUSTOMER DETAILS
• Set “Customer Default Email Preference” to 1 for HTML

How To Add Your Logo:

To add your logo to all of the outgoing emails to your customers simply create your logo (the existing file measures 550px wide x 110px high) and name your logo header.jpg. You will then need to go to your FTP and upload the new logo you created to your email folder which will reside at something that looks like this:

/public_html/email (or /public_html/mystore/email if you have your store in a sub directory and not the main root)

If you look in your email folder, you should see an existing header.jpg file – just upload yours to overwrite the existing logo.

Your new email should now look something like the image on the left – exactly the same as the top image, just a different logo.

If you do a test and you receive your email and it still has the Zen Cart header – do not stress, it is probably because your email program has a cache where it is storing the old image. If you are SURE you replaced the header.jog image – it will appear to others who receive the emails.

Now, what if you want to really have some fun you can edit all of the email files to create something really custom.

By editing the following files you can make every outgoing email a custom html masterpiece. (Once you design one email, the rest should be fairly easy since you can copy over the code for the graphics! For the below sample we created a header/footer/and main background image for the main area – and then then used a background image for the rest of the area.)

The files to edit are all located in your emails folder :

email/email_template_checkout.html
email/email_template_contact_us.html
email/email_template_coupon.html
email/email_template_default.html
email/email_template_direct_email.html
email/email_template_gv_mail.html
email/email_template_gv_queue.html
email/email_template_gv_send.html
email/email_template_low_stock.html
email/email_template_newsletters.html
email/email_template_order_status.html
email/email_template_password_forgotten.html
email/email_template_product_notification.html
email/email_template_product_notification.html

Editing these files can give you an HTML email that can look like this – a great way to reinforce the store brand and gives off a professional touch.

With the latest trend in using social marketing it is almost a must to make your site as socially enabled as possible! The LIKE button by Facebook is a must have if you want your products to get shared and noticed and is pretty easy to integrate into your Zen Cart product page.

Via FTP you will need to download your tpl_product_info_display file which should be in your \includes\templates\YOUR CUSTOM TEMPLATE\templates folder, where YOUR CUSTOM TEMPLATE is the name of your custom template folder. If you do not see it in there, then download the version at \includes\templates\template_default\templates.

Once you download the file open it with a text editor such as Wordpad or Notepad (do not use Word or any other word processing software!)….then insert the following code where you want the LIKE button to appear.

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(zen_href_link(zen_get_info_page((int)$_GET['products_id']),'cPath='.(int)$_GET['cPath'].'&products_id=' . (int)$_GET['products_id'])); ?>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:40px"></iframe>

Then save the file and re upload it to \includes\templates\YOUR CUSTOM TEMPLATE\templates folder, where YOUR CUSTOM TEMPLATE is the name of your custom template folder.

In the sample image shown below the above code was placed just above this piece of code in the tpl_product_info_display.php file so the LIKE button would appear above the product title:

<!--bof Product Name-->
<h1 id="productName"><?php echo $products_name; ?></h1>
<!--eof Product Name-->

You can change a couple of things if you need to!

1. show_faces=false — Change to true if you want the widget to display the thumbnail photos of those who have ‘liked’ your product.
2. colorscheme=light – Change to dark if your page is dark in color.
3. height:40px — This was arbitrarily chosen. If you choose to display ‘faces’, then you should increase to height of the widget (80px or more).

We have personally tested this on Zen Cart versions 1.3.8 and 1.3.9b and it works with both.