Have you tried already making ADs using personalized email template? This may sounds easy and familiar to some, but for me it was only recently since i first discovered on how to make one. We, scrapbookers are used to send ads, right and I am a huge fan of those who made their ADs in yahoo groups or newsletters with personalized looks. I found out that this kind of template is comes in table using HTML code. I am not technically knowledgeable in HTML but still I tried so hard to find a way until i finally got it. And now, it's time for me to share on how i figured it out.

Of course it was not easy for me at first. The HTML code for this is not ready-made. I mean, what i only got from googling is the source of idea only. I did several trials-and-error things until i came up with the one I want. Before i post the code, let me first remind you of some:

* Be ready of your banner image, note of its exact dimension (width and height). Upload it any image hosting site like photobucket or imageshack to get the image URL.

* Be familiar with the colorvalues of your theme.

* And of course, your text and links.

I will give you my secret HTML source companion from the very first time i build this site, the w3schools. This site is really helpful especially to those beginners in HTML or CSS. I used its HTML editor to do all the trials and errors in making this template. You can also check in this site the corresponding HTML colorvalues.

Here is what I have made for the sake of this simple tutorial:



I will let you download this sample code for your convenience, don't worry. So, what's next now? I will remind you that you cannot copy the code directly to your gmail or yahoomail or incredimail because no matter how hard i tried to find out about the HTML source for this email, unluckily it's not possible. Hope somebody help me on this. But, i have some alternative way on how to use this template on gmail or yahoomail or incredimail. I will tell you later.

If you are a member of any yahoogroups, you can copy this code directly on the Post message. Follow these steps:

1. From the text file of this sample code, select all and copy.
2. Target your yahoogroup. After you have opened your selected yahoogroup, in the left side menu click Post.



3. On the Post message screen, click the Rich-Text Editor (on the upper part).




4. On the bottom part of the screen you can see small box beside "View HTML Source". Check that box and then paste the code in the body of the message. Remember, you have to check first the box to view the HTML source before pasting the code.



5. To view the template, after pasting the code, uncheck the box "View HTML Source" and the template is now displayed.



6. Now, you can add your text and image on the body of the template. It will automatically scroll down when you text or load your images without breaks. If you cannot see the cursor, just click on the right side of the banner image and the cursor will appear. Just press Enter. You can now start making your text. You can edit the code by checking and unchecking the box for the HTML Source.



Using this template is also possible in gmail, yahoomail, and incredimail but this time no use of HTML source code. Here are the steps to follow if you want to do the ads in gmail or yahoomail or incredimail:

1. To make this possible, you still need any HTML editor like from the w3schools or from the yahoogroups. After you have pasted the code in the yahoogroup and viewed, on the body of the message (showing the template), right-click and Select All then right-click again and Copy.

2. Go to gmail or yahoomail Compose Message. On the body, right-click, then Paste and the template will appear. So, you can make your text now, adding your images, your links, or anything you want.

3. Reminder: In yahomail, when you paste the template and do the text, it is perfectly fine but when you actually send it, the one who receives it in yahoomail, the background will not appear. In some reasons, I exactly don't know. But in gmail, everything is perfect. In gmail if you cannot see the template, just click the "Display Image below" on the upper part of the message.




So, here is the code now. Download this sample code for free. Just replace all the necessary information to make your own template.




TIPS:

1. Making text and posting images are also possible in table using HTML code, but it is much easy and convenient if we do it on the template directly using the text editor and image handle of gmail, yahoomail, yahoogroups, or even incredimail.

2. If your gmail or yahoomail has no Image handler, I will tell you in my upcoming posts on how to have this add-on, for you can add image directly on the body of the message. Just keep coming back to this page for updates.



3. In this example tutorial, I used solid color for background. You can also make image as your background. In the code, just replace the background with the one highlighted:



For the last view, here is now an example of this email ad using this template:



Using links are possible using this template. And by the way, the banner I used in this sample template tutorial is one of the 300 Professional Header Templates which you can have all for less. These templates are fully customizable because these are saved in jpeg and psd.

Also, I did not include this tutorial in my tutorial page since this has nothing to do with photoshop aside from the banner is made using photoshop.

Hope you learn something from this post. Thanks for reading. Have a great week ahead!