Middle Section:

Now we come to a powerful part of the system.  First take a look at the SiteRightNow.com header. You will see a YouTube video on the right side of the header. This is where it could get confusing to some, since this code actually resides in the middle section box. In my case, I wanted to make the SiteRightNow logo larger on my header. The size I chose pushed my middle section further over to the right of the header. This is by design.  In my case I just didn't use the right section box at all. Technically I could have used the right section box instead of the middle, but I had my reasons.  The middle box has some special powers. You have the option to display something different in the middle box on every page. The other parts of the header stay the same on every page.

In many cases you may want to use the middle box to paste code such as Google Adsense code. Google offers a way to make money from your website by displaying Google ads.  You can paste this special code in the middle section box, which will display the Google ads in your header. The middle section of your header can be used for just about any other purpose you can think of. The text enhancer is available to use for creating formatted text.  You can also upload an image. 

A handy feature is that you can extend the middle section further over to the right and use up more of the right space. See below for more details on the options:

Hide Middle Section:

Check this box if you want to temporarily hide the contents of your middle 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 center your logo. The logo will still turn off the middle section, since it needs to display centered on the header.

The Middle 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.  

Extend text and graphics further right:

This is a powerful feature. In many cases the basic 33.33% size of the middle header section isn't big enough. You can take space from the right side of your header by extending it. If you extend it, then your horizontal alignment choices will work with the larger space (for example, if you choose CENTERED, it will center it within the full amount of space including the extended area)

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 middle section including any extended area you selected above.

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.

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.

Optional Middle Section THIS PAGE ONLY:

You will find a special blue box on your header control panel. This box has the special powers I spoke about earlier.  In the green middle section box, you put in the elements you want to appear on most pages. In this special blue box, you can put elements you wish to appear only on the current page you are working on. Theoretically, you could have something different in the middle section of your header on every page. But in my case, take a look up at the SiteRightNow header. You will see on this page, I am displaying a Game of Thrones YouTube video!   That's not something I really wanted to appear on my main home page. I have a picture trails slide show on my main home page, but on this page, I wanted to show the Game of Thrones video.

All of the other features are identical to the main green middle section box.

You can also check the box to hide this section, and it will go back to displaying the main middle section box without you needing to delete anything, in case you want to reactivate it later.

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