WordPress HUD - v2.1

Theme designed and developed by THE MOLITOR.

If you have any questions that are beyond the scope of this help file, please visit the support forums at http://www.themolitor.com/forums

NOTE: The most up-to-date version of this help file is available at http://themolitor.com/help/hud

Updates

Resources

Installation

  1. Download and unzip the folder from ThemeForest.
  2. Upload the "wphud" folder (with the files left inside) to the themes directory of your blog, which is located within the wp-content directory.
  3. Activate the theme from your admin panel by navigating to "appearance" > "themes".
    • NOTE: If you get a message like “stylesheet missing” (it isn’t) or “broken theme” (it’s not), please read this post: http://tinyurl.com/2aymgju

General Info

NOTE: Most of the theme options are controlled from the options panel. Be sure to review the options available by navigating to “theme options” at the bottom of the dashboard menu.

Featured Post Images

To feature images, use the “Featured Image” section on the lower right side of the post edit page (see screenshot below). After uploading the image, select "Use as featured image". When uploading an image, it automatically creates all the different sizes for you.


Custom Slider Links

To customize the link of the featured posts on the home page, add the URL to the "Featured Item Link" custom field below the post.

Portfolio/Gallery

To create a portfolio/gallery, simply create a "Portfolio" or "Gallery" category and assign posts to that category.

Navigation Menu

To create a menu, navigate to “Appearance” > “Menus” and create a new menu named “Main”. Assign this menu to the “Main Navigation Menu” in the drop down (see image below). Repeat this step for each menu section available in the "theme locations" box. For more information and instruction, watch the “Using WordPress 3.0 Menu System” video here: http://tinyurl.com/48dozan

Widgets

The widgets section is controlled from the "widgets" page (under "appearance").

Comments

Image Lightbox

This theme uses PrettyPhoto as a lightbox system for images. You can make images show up with the light box by adding rel=”prettyPhoto” to the links. For more info, check out the PrettyPhoto website: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

HTML

All of the information within the main content area is nested within a div with an ID of "content". The post content is nested inside the div with class name "post". The sidebar/widget content is within a div with an id of "sidebar". The menu content is within a div with an id of "menu".

If you would like to edit the color, font, or style of any elements in one of these columns, you would do the following:

.post a { color: #someColor; }

If you find that your new style is not overriding, it is most likely because of a specificity problem. Scroll down in your CSS file and make sure that there isn't a similar style that has more weight.

#content .post a { color: #someColor; }

So, to ensure that your new styles are applied, make sure that they carry enough "weight" and that there isn't a style lower in the CSS file that is being applied after yours.

CSS

There is one CSS file called "Style.css" and is separated into sections using:

/* -----HEADER STUFF----- */
some code

/* -----FOOTER STUFF----- */
some code

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

JavaScript

This theme imports the following JavaScript files:

  1. jQuery: jQuery is a JavaScript library that greatly reduces the amount of code that you must write.
  2. Custom Scripts: The custom.js file provides some custom scripts for jQuery.
  3. IE7: This is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6. For more info, visit http://code.google.com/p/ie7-js/

PSD Files

I've included one PSD ("WordPress HUD") with this theme. You don't really need this PSD, however, since 99.9% of the design is achieved via CSS.