Created: 7/25/2011
By: Mike McAlister
Version 1.0
Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to check out the support forum.
I have provided several installation screencasts to get you started with the Dispatch theme. Be sure to pay attention, as this will help you get the theme installed with ease!
Theme Setup:
First of all, you should have WordPress installed and ready to roll. It's always recommended that you start with a fresh install of WordPress to prevent a conflict of settings from old themes, etc. Make sure you backup your old theme and your posts, pages, etc. in case of a catastrophe!
Unzip the theme package. In the folder you'll find the Dispatch docs and a zip titled UploadToWP.zip. This is the theme zip that you need to upload into WordPress.
In the WordPress admin, go to Appearance -> Themes. Click on the big Install Themes tab at the top of the page. Next, click the Upload link and navigate to the UploadToWP.zip file. Install and activate the theme.
Dispatch needs the Options Framework plugin to add the theme options. You can either click the install prompt at the top of the screen, or go to Plugins -> Add New and search for Options Framework. Install and activate the plugin.
Next you need to grab the Contact Form 7 plugin. Once again, go to Plugins -> Add new. Search for "Contact Form 7". Install this plugin. To use this plugin, you'll need to go to the Contact menu (now on the left menu) and create a form. Once you're done, it will give you a shortcode you can use in your contact page. If you've used the dummy data, this should already be in there for you.
Theme options are crucial to the Dispatch theme. If you didn't watch the screencasts, you can read the directions below. You must go through the theme options setup before the theme will work properly.
You'll notice under the Appearence menu, there is a Theme Options menu. Click this link.
Under Basic Settings you can upload your logo, set the link color, page alignment, select a background, set the sticky sidebar title (optional) and Google Analytics code. Save Changes
Under the Social Media Links tab, you just need to enter your social media links for the icons you want to show up on the right side of the header. Save Changes.
I've included a few custom widgets and styled several other widgets to help sexify your theme.
Sidebar - You can put whatever you want in the sidebar. I have provided custom Twitter and Flickr widgets for your use. Just drag any widget to the Sidebar pane and be sure to fill out any required fields for them to work.
Sticky Sidebar - This is the small sidebar that sticks on the page as users scroll. On the demo site I used the Twitter widget and the search widget. You can put whatever you want here as well, but be warned that if you put too many items in the sticky footer the screen will cut off the sidebar. Since it's position is fixed, it will not scroll to show many widgets.
You'll notice in the demo, there are different kinds of posts, such as photos, videos, articles, etc. Below you'll find tips on how to create posts like you see in the demo site!
Photos
Create a new post and add a title and description.
Next, look for the Featured Image box on the right hand side of the page. Click Set Featured Image.
Upload your image from the web or from your computer and when it finished uploading scroll down a bit and click Use as Featured Image and Save Changes.
Finally, make sure to mark the post in the proper category (Images or Photos) and some descriptive tags if you want.
Publish the post when you're finished.
Videos
Create a new post and add a title and description.
Next, scroll down the page a bit and look for the Custom Fields box. If you don't see the Custom Fields box, look up towards the top of your screen and click the Screen Options drop down. Make sure Custom Fields is checked..
Now you can add the Custom Field. The Name is going to be okvideo and the value will be your embed code. The embed code should look something like the code below. Be sure to keep your video width around 540px to fit nicely in the theme. Click Add Custom Field.
<iframe
src="http://player.vimeo.com/video/4143170?title=0&byline=0&portrait=0"
frameborder="0" width="539"
height="229"></iframe>
Once you've added the custom field, you need to be sure to apply the category (Video), and any descriptive tags if you want.
Publish the post when you're finished.
Text Posts
Create a new post and add a title and description.
Write your content and add whatever styling you want. If you want to have a nice big quote like on the demo site, just use the Blockquote button on the WordPress post editor.
When you're finished, be sure to put it in an Articles category and add some descriptive tags if you want.
Publish the post when you're finished.
Dispatch comes with several custom element styles, which are used to easily add extra styling to your WordPress posts. Add buttons, columns, and asides all from within your post editor. See what each one does below.
To use the post styles, simply select your text, links or images, and select from the Styles drop down which style you would like to apply. You'll be able to see the changes live, in your editor. If you're having a bit of
Half Column - This will do exactly what it says, create a half column! Select your text and apply this style to create a 1/2 column on your post.
Highlight - This will highlight the f**k out of some text.
Quote Aside - This style is an alternative to the blockquote. It grabs the text, and throws it to the right of the post, and gives it a nice light background. Nice for highlight important bits of information or quotes.
Buttons - There are several sizes and colors of buttons to choose from. Just select your text or link and choose what size and color you want!
Dispatch takes advantage of the new Wordpress 3.0 menu manager. Menus can be found under Appearence -> Menus. For more detailed usage of the menu manager, see this tutorial here.
You'll need to create two different menus; one for the header, one for the footer. Start with the header menu. Create a menu and name it whatever you want.
Now, on the left hand side, select the pages you would like to have added to the menu. You can then click "Add to Menu" and they will show up on the right side of the page. You can drag the pages around to arrange them the way you'd like.
Save the menu.
Now let's create the footer menu. At the top of the page you'll see a new menu button (has a + on it). Create a new menu and call it Footer. Add pages and arrange them the same way you did before. When you're finished, save the menu.
Now that you have both menus created, you need to assign them in the Theme Locations window located on the left. From the drop down menu, select the appropriate menu for the header and footer.
This theme is setup to automatically use the lightbox gallery
feature on certain portfolio images. If you would like to use it on
your own images, simply follow the example below. You're basically
linking a thumbnail photo to a larger photo and adding
class="lightbox" to the link.
<a href="large-image.jpg" class="lightbox"><img
src="thumb-image.jpg" alt="lightbox image"
/></a>
To create a gallery of images to open in your lightbox, you need
to instead use class="lightbox[gallerytitle]".
<a href="large-image.jpg"
class="lightbox[gallerytitle]"><img src="thumb-image.jpg"
alt="lightbox image" /></a>