RIGHT SIDE OF HEADER:

When you see the light purple box, you will know you are working on the right side of your header section. You can paste special code, type text and/or upload a picture to go on the right side of your header.

Note that this content may be pushed over if your logo or middle section content was wide. Back on the menu selection screen, you had a choice of CENTERED CROPPED WIDTH or ALL THE WAY ACROSS. The ALL THE WAY ACROSS choice tells the header to use the entire width of your browser window. This option will give you more room on your header, which may be needed to display the elements you enter in the right side section.

SWAP TO LEFT SIDE:

The very last option on the bottom of the light purple box is "Swap to Left side if Logo alignment is set to RIGHT".  This is the only option that is different than what you have available in the middle section. When you are working on your logo, you can choose to align the logo on the right side of your header. This would normally turn off the right section content.  If you check this special box, you can display the content you enter in the right section over on the left instead of the logo, since the logo is going to be displayed on the right.

Below is an explanation of the other parts of the right header section:

Hide Right Section:

Check this box if you want to temporarily hide the contents of your right section. It's good while experimenting with your design so you don't have to delete everything just to hide it.

Override Auto Turn Off:

As you have read in other parts of this tutorial, the system automatically shuts off parts of the header when other elements would cover it up.  This checkbox overrides many of the auto turn offs. One exception is if you logo is aligned to the right of your header. You may want to try the SWAP option if this is the case.

The Right Text Box:

You can paste code or type text in the box. The Text Enhancer is available to fully format text. If you are pasting HTML code, such as Google Adsense code, just paste it directly in the white box without using the text enhancer.

Horizontal and Vertical Alignment Choices:

You will see two alignment choice selection menus. Under default alignment, you control the horizontal alignment of elements in your middle section of the header. Choose from LEFT, CENTERED, and RIGHT. For vertical alignment, you control how high or low on the header the content will display. Choose MIDDLE, TOP, or BOTTOM.  

Upload a Graphic:

Click the CHOOSE FILE button to upload a graphic to display in your middle section. Resize the graphic with Height and Width choices. By default, the system will resize the graphic at the same height as your header height setting (100%).   If you don't want to distort your image, choose "don't change width (keeps proportional).  But keep in mind that you won't have much control over the width of your image if you choose this selection.  You can choose to adjust the width 10% - 100% of the total width of the right section.  If you extended the size of the middle section of your header, this will affect the width available on the right side of your header, and the picture may shrink smaller than expected. TIP: If you end up with a small right section because of extending the middle section, try just adjusting the height of the image and do not adjust the width. This will keep the image proportional and it will extend further over. Note that you may need to choose All the way across on your menu selection screen so that the header extends the full width of your browser. Otherwise, the header may push outside of its borders.

Spacing around the image can also be set (padding). You can nudge your image over to get your desired result. LEFT will nudge the image further away from the left edge of the header, TOP will nudge the image further from the TOP edge of the header, RIGHT will nudge the image further away from the RIGHT edge of the header, and BOTTOM will nudge the image further away from the BOTTOM edge of the header. Note that adding too much padding on the left or right sides may cause the header to overflow the page width. To fix this, either reduce your padding, reduce the size of your header elements, or change it from "CENTERED CROPPED WIDTH" to "All the Way Across" back on your TOP menu selection screen.

Alt Tag:

This box is handy to use for SEO purposes (Search Engine Optimization). The Alt Tag won't show on the page, but it adds to the source code of your page. You can type a brief description of the picture and use search phrases important for the search engines. It also helps visually impaired users, since many screen readers will pick up the alt tag text.

Link Box:

Paste a URL into this box and when the visitor clicks on the picture, they will be taken to the link. You can use the Link Helper button to aid you in creating your link, including linking to other pages on your website.

Graphic Location:

Choose where you want your image to display. Choosing ABOVE or BELOW will also center the image. If you want text to display as a caption under the image, choose to display the graphic ABOVE the text. You can also choose to display the image on the LEFT or on the RIGHT. Note that the system automatically will choose "ABOVE" for you when you select CENTERED as the alignment choice higher up on the screen if it was set on LEFT or RIGHT. This is to make sure the image will be centered. You aren't imagining things if you noticed the control panel changed a setting by itself! You can change it yourself later to BELOW and the image will still be centered, if you want the image to appear below the text.

Delete:

Check the Delete box to clear the picture. Note that the system does not save old pictures, so if you need to get it back, simply re-upload it again using the Choose File button.

Go Back to the TOP and select another left side menu to continue with more of Mitch's Tips