Last month I offered some pointers on including pictures with your articles. Hopefully, with those tips, you’ve found new ways to enhance your written content with eye-catching and informative graphics. You may have noticed that I didn’t address the other important roles of images, such as when they are built into your templates to serve as banners, advertisements, and design elements. My original intention was to provide you with a complete guide to using images, both as a part of your articles and as design elements in your templates. But alas, I thought of so many helpful things to tell you about the content side of this topic that I was forced to leave you with a cliffhanger. No doubt this has created the biggest hullabaloo since J.R. was shot on Dallas. Well, perhaps not that big. In any event, you’ve waited long enough – and now, for the thrilling conclusion…
Having had the privilege of glancing through a number of our clients’ e-newsletters, I’ve noticed that there are three dominant ways in which images are used as a part of a template. They are used in banners and logos that brand your template and represent your company, as banners and logos that represent your partners and sponsors, and as design elements that spruce up your look and feel, helping you to combat the potentially fatal e-newsletter disease DDS (Dull Design Syndrome). I’ll walk you through a few tools and techniques to help you implement each of these three kinds of images. By the time you’ve read both of these articles, you should be a maverick at using images in your e-newsletter, and everyone in your marketing department will worship you. What could be better?
Adding your company’s banners and logos
Many of our clients use an image in their page header as their banner. Branding your e-newsletter using similar graphics as your web site creates consistency among your online marketing efforts. Usually, you will add your banner as part of the initial setup for your account, in the Title/Headings section. The image you upload here appears automatically in the “Page Heading” element in your layout.
If you are using multiple templates and wish to have separate banners for the different templates, you will need to use a “Custom HTML” element to display the heading in one of yourtemplates. Start by accessing the Layout editor (make sure you have first selected the issue for which you want to display a different heading) from the Main Menu and then click on the Edit button next to Page Heading. To prevent the image you uploaded in the “Title/Headings” area from displaying, select “No Logo or Title” under the display options and save. This will remove the main banner from this particular template.
Next, back on the Layout page, click on the “Add” button that sits just above the rest of your page heading. When the list of elements you can choose from appears, select the “Custom HTML (empty element)” option. This will essentially allow you to create your own HTML using the HTML Editor, so that whatever text or images you want will appear in the spot you have chosen. Click on either of the “Use Editor” buttons under the “Advanced” heading and the HTML Editor box will pop up. Use the image button in the editor to upload the banner for your second template and save. The banner will then appear above the rest of your page heading information. If you are unsure of how to use the editor to upload images, you can read a more detailed explanation in our last issue.
Adding Decorative Images and Design Elements
Many of our clients use graphics as design elements to spruce up their layout. These can be used as section headers and/or footers, backgrounds, or on their own.
Section Header Image Background Image Independent Image
- Section Headers and Footers
You can add section headers and footers to an element by editing that element. Towards the bottom of the Element Properties page, you will see a section called “Advanced.” In that section you will find “Before” and “After” fields and sometimes a “Between.” Each of these fields contains a “Use Editor” button, which will allow you to create your own HTML, including images. Images created in the “Before” 
and “After” fields will appear above and below the element, respectively. Whenever you see a “Between” field, it means the element has the ability to show several items (titles, articles, links…) and you can place graphics between these items. Therefore, if you wanted to create a section header or footer for your Multiple Article element, you would start by editing that element.
To add a graphic as your section heading, click on the “Use Editor” button just beneath the “Before” field. You can then use the HTML editor to upload an image which will display, once saved, just above the articles in the element. If you wanted to create a footer for a particular element, you will follow these same steps, using the “After” field.
You can also give a distinctive look to a template by using an image as your background. Background images can appear in individual columns, as well as in the header or footer. You can also set a background image for the entire page. To use an image as a background image, you must first upload that image into your File Manager. Select “File Manager” from the Content menu drop-down at the top of the page. Then Click on “Add New” and upload the file you wish to use as a background image.
Next, go into the Layout editor and select “Page Layout.” If you want to set the image as a background for a particular 
column, select “Column Properties” and then select your image in the “image” drop-down. To set the image as the background for the entire page, scroll down until you find the “Border and Colors” section. There, you will be able to select a background image. Keep in mind that these images will repeat in a tile pattern to fill the indicated area.
Also, if you want background images to show, you will need to remove any background colors that exist within the “Page Layout” area, as well as within the individual elements. To remove background colors (making the area transparent and allowing your image to show through), just delete the hex decimal number that represents each color. This means that the background and border settings for all your page areas should look like this… 
…rather than this
Adding logos, advertisements, and other independent image links
Many IMN users include images in their templates to represent links to sponsors’ and advertisers’ web sites or to represent links to events and other external pages. To create a linked image in your template, you will need to add a “Custom HTML” element. Just as you would have done with the alternate header, click on the 
button on the Layout editor page in the spot where you would like the image to appear. Then, use the HTML Editor for either the “Before” or “After” fields to upload you image.
Once the image is showing in the editor, you can then attach a hyperlink to the image. Start by clicking once on the image to select it. Then, click on the hyperlink button at the top of the editor. Make the selections and enter the appropriate information for your hyperlink and then click OK. Once saved, the image will appear in the template, and readers who click on it will be taken to the link you’ve set up.
Using images effectively can really make or break a good e-newsletter. Whether you are working them into your template or including them with articles, I think you’ll find that knowing how to use images effectively can be a big help. At this point, I’ve told you just about everything I know about the subject, so you should be well on your way to becoming a pro. And as always, if you have any questions, feel free to email me.
Want to learn more from Jessica? Here is a library of her most recent tips:
Creating Picture-Perfect E-Newsletters, Part 1
Is Your Subscribe Box Taking Up Too Much Room?
It's Spring! Wake Up Your Subscribers with a New Template
Giving Your Emails Personality: How to Get Recognized and Stand Out
Managing Your Subscribers: Five Tips to Get You Going
Getting Back to Basics: 3 Simple Steps for Creating a Customized Layout
Thinking Inside the Box: Layout for Beginners
Putting Your Reports to Work
