Account Control Panel User Guide

Header Design

Your website header can significantly improve the appearance of your web pages. There are up to four different ways that you modify your website header. You can choose to use one of the pre-designed header images for your selected design theme, upload you own header image, use HTML code to build your header and/or enter text for the header area.

Whenever you make changes to the design theme for your website, we recommend that you also update your Website Header Design to ensure that the images and contents of your existing headers will match the new design theme. Since header sizes are different for all design themes, you may also have to re-upload your custom header images to auto-correct any size differences.

The "Website >> Design >> Header" page consist of 4 sub-tabs to help you build your website header:

  • Template Headers: Choose from one of the predesigned header images for your selected theme
  • Upload Header Images (recommended): Upload your own header image
  • HTML Headers (Advanced): Create header using custom HTML code
  • Header Text: Control text and font display

Note: Some of these options are deprecated for newer themes.

Template Headers:

Select the radio button against the image of your choice. The image is highlighted. Click Save and Continue. Your website is updated instantly and you will see the message in the subsequent page.

Upload your own header image (recommended):

Uploading your own header image is highly recommended because it is the most effective way to create an instant connection with your website visitors, set the tone for your website's message, and provide an engaging and memorable experience.

Where can I find a good quality image?

There are many inexpensive sources for finding a great image to represent your business.

  • iStockphoto - You can use this service to purchase high quality images taken by professional photographers for as low as $1.
  • Fotolia - Buy royalty free stock photos for as low as $1.
  • Use a digital camera to take a picture of a local landmark, panoramic landscape, or any other image that represents your local market.
  • Use an existing graphic from your prior direct mailers or any other marketing materials.
  • Hire a local graphic artist or use a freelance website like Guru.com, eLance, or oDesk to find a freelance graphic artist.

How do I resize my photo to the correct size?

Although our system is designed to take any header image that you upload and resize it to fit in the header area, for optimal results it is best that you upload an image in the correct size or at least in the correct proportion (most of our templates use panoramic header images). Resizing an image to the correct size and proportion without reducing the image quality is best accomplished in a professional photo editing software like Adobe Photoshop and will require some technical knowledge. If you are not familiar with Adobe Photoshop and want to resize your image yourself, you can try using a free photo editing software like picresize.com, Picasa or Microsoft Paint, which is pre-installed on all Windows computers.

 

Once your image is ready and saved in a folder in your local hard drive you must do the following:

  1. Locate an image that is saved on your computer by clicking the Choose File button. A dialog opens asking for the image. Select the image from your system and then click Open.
  2. Choose either "Header Background Image" or "Full Header Image" and check to make sure your image meets the size/pixel requirements for your selected theme.
  3. Choose an alignment from the drop down box (only affects Full Header Image).
  4. Click Upload to upload your header image to the Header Library.

The image is uploaded and is displayed in the Uploaded Header Library section. This does not automatically change the default header for your website. You can make it a default header by clicking on the link Make Default under the image in the header library.

  • Image files must be in a jpeg, gif, or png format. If the file is in a .tif format or some other format, you should open it in a photo editing program (i.e. Adobe Photoshop, Microsoft Photo Editor, Irfan View, etc.) and save it as a .jpg type.
  • Image files must be uploaded from your computer's hard drive, CD-ROM or floppy.
  • "File" size must be less than 16 MB (16​000KB).

HTML Header:

HTML Knowledge is required to use the options on this page. If you are not familiar with the HTML programming language please use another header option. You need to provide a header name and enter HTML code in the text box provided and click Save HTML Code. The header is modified according to the code. The HTML header library is stored and displayed. You can make an HTML the default header by clicking on the link Make Default next to the HTML header in the HTML header library.


Header Text:

By Default your website uses the Name and Company Name information from your Contact Card in the header area. However you should use the Header Text option to manipulate the text and style of your header text. Use this option to control the text and font display in your website's header. To add a new line of text click "add line". You can delete lines by clicking Delete under the line number.

Enter the text, select the font style and size from the respective drill-down list, select the checkbox for bold if you want the text to be bold, and select a color from the palette. Click Save Header Text. The Header Text preview is visible on the top of the section. You can also select the Horizontal Alignment from the drill-down list.

Since there are very little restrictions on the results of these options, it is up to you to use your best judgment regarding the result that this option produces. For example, it would not be wise to use a dark color for your text if the background color of your header area is dark. Or you should not make the text size so big that it causes the page design to move out of alignment. It may require that you preview your website and then tweak the Header Text until you accomplish the look that you desire.

The options on this page will not affect your web page if you're using an HTML Header or Full Image Header.