Created: 12/8/2020
By: Mike McAlister
Version 1.0
I have provided several installation screencasts to get you started with the Mission Control 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 Mission Control docs and a few zips titled MissionControl-UploadToWP.zip and MissionControl-Dark-UploadToWP. These are the theme zips 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.
Recommended - Install the dummy data which is included. (You can also get it here: MissionControlData.xml ) This will ensure the posts/pages get laid out properly with the correct page templates. Go to Tools -> Import -> Wordpress. Browse to the Mission Control download folder and locate the Dummy Data folder. Select the XML file and upload it. Be sure to click "download and import all attachments".
Mission Control 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.
AJAX Handler - This should have been setup with the dummy data, but if you didn't use the data, you'll have to create this page. Create a page called Ajax Handler. On the right side of the edit page, you need to set the Template setting to Ajax Handler. This page does not need any content. Publish the page.
About Page - Create a page, add an H3 title and a small paragraph blurb about yourself. Publish the page.
Contact Page - Make sure you have Contact Form
7 installed. Click on the Contact menu on the left side of your
admin. Here you can create and customize a form. You can probably
get away with the default form. Copy the shortcode at the top of
the page: [contact-form 1 "Contact form 1"]
Now you can create the Contact page. Add an H3 title and your
contact information in a paragraph below the title. If you'd like
to have the columns like on the demo site, you'll need to switch to
the HTML view and wrap your text in a few classes. The left column
should be wrapped like <div class="col">Your text
here</div> and the right column should be wrapped like
<div class="col2">Your text
here</div>.
Now you need to add the shortcode you copied from Contact Form 7. Scroll down and look for the Custom Fields window. 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.. Add a custom field with the name of contactform and in the value field you need to paste the shortcode. Add the field and publish the page.
Theme options are crucial to the Mission Control 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 Appearance menu, there is a Theme Options menu. Click this link.
Basic Settings - Upload your logo and insert your Google Analytics code.
About Settings - Select the page that will occupy your About section. You'll have to create a page if you haven't already.
Portfolio Settings - Enter your portfolio section title and select the post category that contains your portfolio posts.
Blog Settings - Enter your blog section title and select the post category that contains your blog posts.
Contact Settings - Enter your contact section title and select the page that will occupy your Contact section.
Links Settings - Enter your social media links for the icons you want to show up on the right side of the header. Use the full URL to your profiles.
Save Changes
By default, Mission Control will create a functioning menu as seen on the demo. But maybe you want to change them. Here's how you can do that.
Go to Appearance -> Menu. Create a new menu.
On the left side of the page, you'll see the Custom Links pane.
The menu works by adding ID's as the URL to the different sections of the site. For example, the About section has an ID of #about.
Add a custom link with the URL as #about and the label as About (or whatever you want). Be sure to remove the http:// from the URL field.
Once it's been created and added to the menu, save the menu. If you refresh your homepage, you should see that your link is now in the header. When clicked, it should drop down to the first section on the page, the About section.
There are five sections on the site in this order: About, Portfolio, Blog, Social, and Contact. All of these sections have ID's associated with them: #about, #portfolio, #blog, #social, #contact. Use these ID's as the URL of your custom links to determine where the link should bounce to.
Save the menu.
I have included custom twitter and flickr widgets for the Social section.
Social Left - Drag the Okay Twitter Widget onto the Social Left window. Enter the title and your Twitter username. Save widget.
Social Right - Drag the Okay Flickr Widget onto the Social Right window. Enter the title, Flickr ID, and number of photos you'd like to show. Save widget.
Featured Image / Portfolio Post
Create a new post and add a title and description.
Write your content and add whatever styling you want.
On the right hand side of your page, you'll see the Featured Image Pane. Click Set Featured Image and upload your image. Once uploaded, scroll down a bit and click "Use as featured image". Once set, you can close the image upload window.
If you want this post to appear in your portfolio, just make sure you mark it in the Portfolio category.
Publish the post when you're finished.
Video Post
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 600px 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="600"
height="229"></iframe>
Once you've added the custom field, you need to be sure to add a category or 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 add a category or any descriptive tags if you want.
Publish the post when you're finished.