How to Use the Header and Footer Settings

Latest revision as of 21:12, 18 January 2012

The Header & Footer section settings provide flexibility and ease in setting up important site content such as Dropdown Navigation, Search capability, Social links, and Copyright statements.

[edit] Drop Down Navigation

You can give your menus a different look by enabling Drop Down Navigation. When you hover over a menu, additional menu items appear underneath.

Enable Drop Down Navigation

Menu Offset

Drop Down Menu

[edit] Enable Drop Down Navigation

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Check "Enable Drop Down Navigation?"
   • You can also choose to disable the Text Shadows & Arrows
4. Click "Save Options"

[edit] Offset(Nest) Menu Items

Now you will need to configure on which pages the Drop Down Menus will appear. Simply go into your custom menu and offset (indent) those pages to the right.





Now you will see that any menus you offset will be nested underneath their parent menu item.

If you are having problems with the Drop Down menus falling behind Flash elements, such as an embedded YouTube video on your Feature Slider, click here for more information.

[edit] Hide Search Field

Search Field

Hide Search Field

The Search Field is displayed by default on the right side of the PageLines Navigation Section.






To hide the Search Field, from your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Click "Hide search field?"
4. Click "Save Options"

[edit] Social Icon Position

Social Icon Position

Adjust Social Icon Position

By default the Social Icon bar is placed within the "Branding" section to the right of the header logo.

Positioning can be adjusted using the Social Icon Position settings.

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Set desired values under "Social Icon Position"
4. Click "Save Options"

The icons bar moves relative to the bottom right corner of the Branding section. For example, increasing the "Distance from Bottom" value will move the bar up from the bottom of the Branding section.

Negative values are allowed which is especially useful for moving the icons down.

Social Icon Position Examples

View examples in the image to the right. The white box shows the generated html & css code:

1. Default settings: "Distance from Bottom" = 12 and "Distance from Right" = 1
2. Place the Icon Bar to the left of the Search Bar using "Distance from Bottom" = -55 and "Distance from Right" = 220

For advanced users, div.icons has default CSS values: div.icons {position: absolute; bottom: 12px; right: 1px;}

When setting the Social Icon Position in this PageLines panel, you are changing the css values for bottom: and right:

For more information on testing css settings using Firefox & Firebug, click here.

[edit] Hide News/Blog RSS Icon

News/Blog RSS Icon

Hide News/Blog RSS Icon

The News/Blog RSS Icon is displayed by default on the right side in your header. In the PageLines Templates, this icon, along the Social Icons, is placed within the "Branding" Section.






To hide the News/Blog RSS Icon, from your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Unclick "Display the Blog RSS icon and link?"
4. Click "Save Options"

[edit] Social Icons

Social Icons

The "Social Icons" settings allow you to easily add social media links. Google+, Facebook, Twitter, LinkedIn, and YouTube are included in the default PageLines installation and once activated will appear in the header next to the RSS Icon.

Add Social Icons

Activating these icons is as simple as entering URLs in the "Social Icons" settings.

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Enter URLs under "Social Icons"
4. Click "Save Options"

The activated icons will now appear in the header.

For advanced users, you can use hooks to add additional icons to the Social Icon bar.

[edit] Secondary Navigation

Secondary Navigation allows you to place unique menus on individual pages.

This is especially helpful when:

• you need different menus on each page
• or, instead of using Drop Down Menus, you want your "nested" or "secondary" menu items visible at all times

[edit] Setting Secondary Nav using WordPress menus

There are two options for displaying the Secondary Nav Menu. The default option is to use a WordPress menu. Once you create the menu, you must assign it to a page through the page's Meta Settings.

Use Child Pages

[edit] Setting Secondary Nav using Child Pages

Secondary Nav

The second option is to use Child Pages as your Secondary Nav menu instead of a WordPress Menu.

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Check "Use Child Pages for Secondary Nav?"
4. Click "Save Options"

Once you setup the Secondary Nav menu, by default it will be displayed underneath your Primary Website Navigation. However, you can move it around inside any of the Template Areas.

[edit] Number of Footer Columns

Footer Columns

Use the "Number of Footer Columns" setting to change the number of columns displayed in the "Footer Columns Sidebar" section.

• For this section to be visible on your site, it must be activated in Pagelines / Templates in the "Footer" Template Area.

By default, there are 5 Footer Columns:

• Logo
• Site Pages
• Latest Post
• More Statement
• Site Terms Statement

You can change either (or both) the content of the columns or the number of columns.

[edit] Change the number of columns

Change # of Footer Columns

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Set the "Number of Footer Columns"
4. Click "Save Options"

If you decrease the number of columns, the default content will automatically wrap to the next line.

As an example, in the default installation, changing the number of columns from 5 to 3 will wrap "More Statement" and "Site Terms Statement" to a second line.

[edit] Change the Footer Columns content

Change Footer Columns Content

The "Footer Columns Sidebar" is fully widgetized. If you do not wish to use the default content, drag widgets into this sidebar.

From your WordPress Administration Panel:

1. Select the "Appearance" panel, then "Widgets"
2. Click the arrow to open the "Footer Columns Sidebar"
3. Drag desired widgets to the sidebar

Note that once you drag a widget into this sidebar, the default content is overridden and will not display. For example, if you still want a "Site Terms Statement", drag a text widget into the Footer Columns Sidebar and write the "Site Terms Statement" there instead of in the "PageLines / Settings / Header And Footer" panel.

[edit] Footer Logo

Footer Log

Use this setting to show a "Footer Logo" in the left column of your footer.

Add Footer Log

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Add a "Footer Logo"
4. Click "Save Options"

The "Footer Logo" will appear on your site only when both of the following are true:

• The "Footer Columns Sidebar" is activated in the PageLines / Templates / "Footer" Template Area
• You are using the default content for the "Footer Columns Sidebar". In other words, you have not drag-and-dropped any other widget into the "Footer Columns Sidebar" in the WordPress Widgets editor.

If you do not want to use the default "Footer Columns Sidebar" content but still want a "Footer Logo": in the WordPress Widgets editor, drag a text widget into the "Footer Columns Sidebar" and paste: <img src="theFooterLogoURL"> into the widget content area.

[edit] More Statement

More Statement

Use this setting to display a note, statement or any html formatted text & images in the footer.

Add More Statement

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Add a "More Statement"
4. Click "Save Options"

The "More Statement" will appear on your site only when both of the following are true:

• The "Footer Columns Sidebar" is activated in the PageLines / Templates / "Footer" Template Area
• You are using the default content for the "Footer Columns Sidebar". In other words, you have not drag-and-dropped any other widget into the "Footer Columns Sidebar" in the WordPress Widgets editor.

If you do not want to use the default "Footer Columns Sidebar" content but still want a "More Statement": in the WordPress Widgets editor, drag a text widget into the "Footer Columns Sidebar" and write your "More Statement" in the widget content area. (See image above under "Change the Footer Columns content.")

[edit] Site Terms Statement

Site Terms Statement

Use this setting to display a copyright notice or site terms (or any html formatted text & images) in the footer.

Add Site Terms Statement

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Settings"
2. Select the "Header And Footer" tab
3. Add a "Site Terms Statement"
4. Click "Save Options"

The "Site Terms Statement" will appear on your site only when both of the following are true:

• The "Footer Columns Sidebar" is activated in the PageLines / Templates / "Footer" Template Area
• You are using the default content for the "Footer Columns Sidebar". In other words, you have not drag-and-dropped any other widget into the "Footer Columns Sidebar" in the WordPress Widgets editor.

If you do not want to use the default "Footer Columns Sidebar" content but still want a "Site Terms Statement": in the WordPress Widgets editor, drag a text widget into the "Footer Columns Sidebar" and write your "Site Terms Statement" in the widget content area. (See image above under "Change the Footer Columns content.")