From your dashboard go to “Site Design Center” » “Header Editor”.

What is the Header Image Editor?

The header can be one of the most important aspects of your site. Whether you want to include a great header image, or simple add something extra, Quan$ite™ makes this a fairly simple process.

How to use the Quan$ite™ Header Image Editor

If you’re including a Header Image, use the File Manager to upload the image you’d like to use.

The settings on the right-hand side will determine if you’re using the “Default” header or a “Custom” header; and whether you’d like to create your header in “Visual Editor” (aka WYSIWYG) or “Text Editor”.

Modifying the existing custom header

We highly recommend when you first start creating your custom header, you select the “Text Editor” and remove all the code that is in the current “custom” header.

The custom header provided is simply a green box with text in it. If you’d like to keep the box, but change the background color, place your cursor within the “Custom Header” box, right-click and select “Table Properties”.

In the new window that opens, select the “Advanced” tab. Toward the bottom you’ll notice the “Border Color” and “Background Color”. Either paste the HTML color code within the box, or click the color swatch to open a “color-chooser” to change the color. NOTE: your pop-up blocker MUST be turned off for this to work. Click on “Update” and your header box should have the color you selected.

Inserting a custom image header

If you’re inserting an *image header in the Visual Editor, place your cursor within the editor box, then click the “Tree icon” which you will use to insert images. A small window will open.

* Note: If you’d like to add a custom image header, we offer Quan$ite members this design service service. If you don’t have a graphic designer on your team and are interested in a custom image header, please submit a request for more information on this customization service via the Quan$ite support desk.

Under the General tab, enter the complete image URL of your image (which you can get from the “File Information” area within your “File Manger”, a good keyword-rich description of your image, and a strong keyword-rich Title.

Under the Appearance tab you can set the alignment. You’ll see a little “display” sample of what the alignment is like. If you want text to “wrap around” your image, this is where you would set that. (For your header image, don’t use this option unless your image is just a small portion of your new header.) You’ll also set the size of your image here. Keep the “Constrain proportions” checked in order to keep your image proportioned correctly.

In the Advanced tab you’ll be able to create a “mouse-over” effect if you’d like by selecting the “Alternative image” checkbox and adding the alternate image URL in the appropriate box.

HELPFUL HINT: If you notice that your new custom header is pushing itself far to the right, enter a line break just above your new header code. < br > (take out the spaces)

The following video tutorial will guide you step-by-step through the process outlined above.