[ skip to content ]

More Information about this image

Green abstract field with angled address bar from a browser

1.5 Setting Up a Page

Editing a page must involve not only adding components and populating those components, but addressing all page settings, including the page properties and the sidebar. Failure to fully complete a page with these items will impair its connectivity to the rest of the website.

Page Properties

You can enter the page properties by right clicking the page in the files pane of the directory view or by choosing "Page Properties" from the Page tab of the sidekick. It is recommended that you set your page properties first.

Basic Tab

Titles

Each page has four titles that can be set. It is important to understand where these titles are used and the styling standards for each title type.

Title

This is the actual title of the page. This will appear in the page's header as well as in any directory listings. The full title of the page should be used here unless it is longer than the space available in the header. In those cases, shorten the main title and use a first-level heading (h1) at the top of your content section as a subtitle.

Page Title

This title will appear as the page's title whenever it appears within a list pages component. If the main title is long, this should be a significantly abbreviated title, as it will need to fit in a 3-column list pages (see illustration). The page title will default to the title if left blank.

Navigation Title

The navigation title is what appears in the breadcrumb in the header of each page, directly under the page's main title. This title should be concise and, when appropriate, play off the wording of the parent page. For example, in a section about on-campus housing, the navigation title should simply be "On-Campus," as "On-Campus Housing" would be redundant:

Correct
University Life > Housing > On-Campus

Incorrect
University Life > Housing > On-Campus Housing

The navigation title will default to the page title if left blank.

Call to Action

The call to action is the final word or words for an entry in list pages. This is the text that encourages the user to "take action" or click the link to visit the page that is being "advertised." Many times, the title of the page repeated here is appropriate. Other times, you may wish to take a more active command: Get Involved! The call to action will default to the navigation title if left blank. Do not use "Click Here" as your call to action. That is considered tired web practice.

Description

The description is a brief teaser or preview of what users will find if they click the page title or the call to action. These are often the first paragraph of the page's content, but can also be custom-written to be engaging and entice users to learn more.

Tags

The tags allow the page to be categorized. Additionally, tagging a page provides a way to surface the page in lists of like items. Tagging is explained in greater detail in Module 2: Tags.

Advanced

Administrators only: The advanced tab settings should only be altered by an administrator.

Image

The Image tab allows you to set the image that will appear in a list pages view that utilizes images. The majority of pages in the site should have an image set for them, particularly if they will be used as part of List Pages.

To set the image, simply use the finder to locate the desired image and then drag the image from the finder into the dropzone on the Image tab. All page images (images placed in this tab in the page properties) must be cropped to Landscape. After droppping your image into the tab, you must select the Crop tool. The Image Crop Tools will appear. Click the dropdown for the aspect ration and choose "Landscape (6x4)." A crop box will appear over your image. You can drag the cropbox around your image or drag the corners to enlarge or shrink the cropbox to fit the part of the image that you desire.

When you have auccessfully identified your crop, you must click OK to save and exit the page properties before going to other tabs. Once you have done that, ou may choose Page Properties again to continue setting other properties.

Header Image

The header image is the wide image that appears at the top of the page. Not every page needs to have its own unique header image. If no header image is set, the page will inherit the header image from its parent page. Keeping the header image consistent is particularly useful for demarcating distinct sections of the site.

You can set the header image in the same manner as the page image above. All header images must be cropped to the Wide aspect ratio. Using the free crop or Wide Tall will yield unexpected (and undesired) results. Additionally, you must use a landscape-oriented (wider than it is tall) photo to set the header image. Using a portrait-oriented image will result in the header image being tiled.

Site Navigation

Experience Guaranteed

Enhance your college career by gaining relevant experience with the skills and knowledge needed for your future career. Discover our experiential learning opportunities.

Academic Days

Picture yourself in the classroom, speak with professors in your major, and meet current students.

Upcoming Events

From sports games to concerts and lectures, join the ODU community at a variety of campus events.