UA WordPress Themes (Previous Versions)

NOTE: For the most up-to-date theme options, please refer to the UA WordPress Theme page. If you would like to download the older versions, please contact Matthew Muro at 348-0304.

UA WordPress themes allow you to edit and update your website with a simple CMS (Content Management System) interface while taking advantage of the clean, professional look and feel of the UA Web Templates. The instructions on this page will help you get started with setting up a UA theme in WordPress.

This guide includes some references to Adobe Dreamweaver. Please consider Dreamweaver to be interchangeable with any HTML editing software you are using.

Setting up the UA Theme

When you install WordPress, keep in mind that whatever you enter for "Blog Title" in WordPress will be used in the page title of your website.

Choosing a Theme/Template
Once you have installed WordPress, you can choose a WordPress theme.

The UA WordPress themes have the same look as their template counterparts. In order to choose the theme that best suits your needs, visit the Web Templates page for examples. In each download package, there will be four folders with the following variants on your chosen navigational scheme:

  • Normal
  • Functional footer
  • Search box in header
  • Search box in header and functional footer

UA WordPress Themes

Implementing a Theme in WordPress
When you download and unzip the file, there will be 4 folders – each with a variant on your chosen navigational theme enclosed. These folders need to be placed under wp-content\themes\ and uploaded to your server.

After logging in to your WordPress account with admin privileges, click the 'Appearance' tab on the sidebar. The first page to appear will be the themes page. Activate the theme you wish to use and you'll find that you now have the UA look on your website.

Site Styles

There are 3 kinds of website homepages available for you to select: Blog Style, Static Homepage, or a combination of the two.

Blog Style
By default, WordPress will display the homepage of your website as a blog. For many themes, including the UA themes, the default will be to use a blog-style homepage.

Static Homepage
If you would like to use a static homepage to give your website a traditional website feel, there are several steps you must take:

  1. Login to your WordPress account and create a new Page called 'statichome'. Only fill in the title box. Leave the rest of the page blank.
  2. To the right is a section called 'Attributes'. Under 'Template' select 'Static Home Page' and publish the page.
  3. Make a new Page called 'blog' and publish. (Once again, only fill in the title box, and this time do not make any changes in the 'Attributes' section.)
  4. Under 'Settings' on the main left toolbar, select 'Reading'.
  5. Select 'static page' and set the front page as 'statichome' and the posts page as 'blog'. Then save the changes.

    Reading Settings

Now when you visit your website, your static homepage will show up as the index instead of the blog page. To learn how to customize the static homepage, please view the 'Static Homepage' section under Customizing your Site below.

Static Homepage with Blog Page
If you decide to use a static homepage, but you still want to have a blog on your site elsewhere, all you need to do is include an absolute link to your blog within your main or side navigation. You can find this link by going to the 'blog' page that you created above.

Customizing your Site

We have done our best to make the UA WordPress themes fully-functional right out of the box, but in most themes you will at least need to customize the header and menu for your organization. For additional functions and capabilities not covered in this tutorial, please refer to the WordPress Codex.

CSS
See Templates Guide – Customizing for information on manipulating the CSS for the UA themes.

Links
Use absolute links in WordPress rather than relative, especially in the main navigation areas. Blog links will generate themselves, but when placing them on the static homepage, use an absolute link.

Pretty Permalinks
In WordPress, the default link structure uses post IDs. However, it is recommended that you use some form of what are called pretty permalinks. For details on how to set this up, please read the WordPress Codex.

Header
Remember that the title of your website will be the same name as your 'Blog Title' when you first install and set up your WordPress site.

The image banner in your header can be edited according to the Templates Guide – Elements page.

Navigation
Main navigation can be found in either header.php or sidebar.php depending upon the theme you choose. All horizontal navigation will be found in header.php while vertical navigation will be in sidebar.php. Functional footers also contain links that may be used for navigation. Page links must be manually changed within the code. After a page is created in WordPress copy the full address of the page for your link.

Content
There are two different types of content in WordPress: Posts and Pages. Posts are your blog entries and can be edited within WordPress. Pages are static and most can be edited within WordPress. The static home page must be edited using Dreamweaver.

Static Homepage
To edit the content of your static home open up 'statichome.php' in Dreamweaver. This will give you access to the main area of the home page. The header and footer are separate from the statichome.php and must be edited in their own php files.

To place an image within your static home:
<img src="<?php bloginfo("template_url"); ?>/images/imagename.jpg" />

Links Box
To place a links box within a post or page, select the 'HTML' tab on the main content box and paste in the HTML for the style box you would like to use. When you go back to the 'Visual' tab the box's formatting will not display, but it is actually correct and will be displayed properly on the live web post or page.

Footer
To edit your footer, open the 'footer.php' in Dreamweaver.

Recommended Plug-ins

Below are several plug-ins that you may find useful as well as links for learning more and downloading each one. For other plugins, visit the WordPress site.

Akismet
Akismet blocks spam from posting on your blog pages.

WP-Pagenavi
WP-Pagenavi adds a more detailed page navigation to your site and has already been formatted in the UA style within each template.

  • NOTE: To use the UA CSS formatting for this plug-in, you must uncheck the “Use pagenavi-css.css” option within the PageNavi options page. Please refer to the documentation on how to do this if you have trouble.

Google XML Sitemaps
This plug-in can automatically generate a sitemap that helps search engines better index your blog.

Filled In
A form processing plug-in that makes it easy to validate and process your forms.

Let Us Know!

Are you using these templates for your site? If so, we'd like to hear from you! Please send a link to your site to us at webmaster@ur.ua.edu so we can see the creative ways in which you have implemented the UA WordPress Themes.

NEXT: UA HTML E-mail Templates