Fixed WordPress Theme

Created: 11/4/2012
By: Mike McAlister

Thank you for purchasing Fixed! If you have any questions that are beyond the scope of this help file, please feel free to check out the Support Forum.


Recommended Plugins

Fixed uses a few plugins to provide functionality to the theme.

  • Contact Form 7 - This plugin creates a fully functional contact form for your site. You can install it directly from your dashboard in the Plugins menu, or grab it from the WordPress.org plugin repository.

    1. Log in and navigate to Plugins → Add New.
    2. Type "Contact Form 7" into the Search input and click the "Search Widgets" button.
    3. Locate Contact Form 7 in the list of search results and click "Install Now".
    4. Click the "Activate Plugin" link at the bottom of the install screen.
    5. There will now be a Contact menu item on the WordPress admin menu. See below for more instructions on using this plugin with the theme.
  • Okay Toolkit - This plugin provides several social media widgets including Twitter, Dribbble, Flickr and social media icons. Once installed and enabled, you can find the social media widgets in your Widgets section. You can install it directly from your dashboard in the Plugins menu, or grab it from the WordPress.org plugin repository.

    1. Log in and navigate to Plugins → Add New.
    2. Type "Okay Toolkit" into the Search input and click the "Search Widgets" button.
    3. Locate the Okay Toolkit in the list of search results and click "Install Now".
    4. Click the "Activate Plugin" link at the bottom of the install screen.
    5. Navigate to Settings → Okay Toolkit to modify the plugin's settings. The widgets will be available in Appearance → Widgets.

Menu Setup

WordPress menus can be found under Appearence -> Menus.

  • You'll need to create at least one new menu for the header. Fixed also supports a custom menu, which you could use in the widget area. Click the + to add a new menu.

  • 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.

  • Create a drop menu by dragging menu items under and to the right of another menu item.

  • Save the menu when finished.

  • Now that you have the menu created, you need to assign it in the Theme Locations window located on the left. From the drop down menu, select the appropriate menu for the header and save.

Contact Page

The Contact Page uses the Contact Form 7 plugin, which can grab for free on the WordPress plugin repository. Once installed, you'll see there is a Contact link in the left hand sidebar of your WordPress admin.

  • If you haven't already, create a new page called Contact.

  • Go to the Contact menu on the left admin menu to configure your contact form. By default they give you a simple form with Name, Email, Subject and Message. To keep things simple, I suggest using the default form. Otherwise, to customize this form even further, check out the Contact Form 7 docs page here.

  • After you've configured and saved your contact form in the Contact menu, you will be given a small shortcode like this: [contact-form 1 "Contact form 1"]. Copy this shortcode. We'll use this to add the form to our Contact page.

  • Now head back to your Contact page. Paste the Contact 7 shortcode that you copied into the body of the post. Update the post. You should now see the form on the contact page.

Archive Page

Fixed comes with an Archive page template which displays all of your latest posts, pages and categories.

  • Create a page called Archives (or whatever title you'd like).

  • On the right hand side of the page, in the Page Attributes pane, select Custom Archive from the Template menu.

  • Once finished, publish your page and check out the archive.

Using the Theme Customizer

Fixed is customizable via the WordPress customizer. Here, you can set a custom background image, upload a logo and set your link/accent color.

  • To access the theme customizer, click Appearance -> Customize in the WordPress admin menu.
  • You should now be in a live preview of Fixed, with the customizer on the left.
  • Use the various menus to set the site title and description, background, logo, accent/link color and more. Specific Fixed settings can be found under Fixed Options.
  • Fixed also gives you the option to use a Retina sized logo. The benefit of this is sharper images on high definition devices. To upload a Retina logo, you need to upload your logo at two times the resolution you normally would. So if your logo is 150px x 150px, you would need to resize your logo to 300px x 300px. The larger image will be served to high definition screens, and will be scaled down accordingly for regular screens. No need for multiple images, Fixed does this on the fly!
  • Add custom CSS to your theme by adding it to the Custom CSS text box.
  • When you're finished making changes, click Save & Publish to save the settings.
  • Check out your site to confirm your changes.

Infinite Scrolling

Fixed utilizes a script called Infinite Scroll to auto load posts as users scroll down the page. This essentially means there is no footer or end of page until the user runs out of posts. You can disable or enable infinite scrolling in the Customizer. Just visit Appearance -> Customize -> Fixed Options to toggle this on or off.

Hidden Drawer Widgets

This widget section is in the header area, available via the asterisk toggle. Add widgets to the Drawer pane to see them in the hidden header of the theme. You can add text widgets, the Twitter widget, custom menus, etc. here just like I did on the demo. Or don't, whatever. If you don't add any widgets to this area, the drawer toggle will not be shown. Clever, huh?

If you would like to add Twitter, Flickr or Dribbble to this section, be sure you have the Okay Toolkit plugin installed.

Sidebar Widgets

Fixed also supports limited widgets in the left hand sidebar. Because of it's fixed position, if you add too many widgets to the sidebar, they will run off the page. I would suggest using one widget in the sidebar, and putting the rest in the hidden drawer (see above).

If you would like to add Twitter, Flickr or Dribbble to this section, be sure you have the Okay Toolkit plugin installed.

Creating Mixed Media Posts

Fixed makes it easy to share your images and videos. Follow the instructions below to add a variety of media posts.

Featured Image Posts

  • 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 and click Use as featured image. Once set, you can close the image upload window.

  • Once you've added the featured image and content you can publish and preview your post.

To use the gallery feature, you must have the latest version of the Okay Toolkit plugin and WordPress 3.5 or newer. Be sure to read the Toolkit setup above and also check out this quick video I made showing how it works.

  • To use the awesome new WordPress galleries, you first need to be running WordPress 3.5. Secondly you need to install the Okay Toolkit. See instructions above.

  • Once you have the Okay Toolkit installed, go to Settings -> Okay Toolkit. Enable the Enable Gallery Feature towards the bottom of the page and Save your settings.

  • Create a new post and add a title and description.

  • On the right hand side of your page, you'll see the Format pane. Click Gallery to set the post format and activate the gallery options.

  • Under your post editor, you'll see the Okay Gallery pane. Click the Edit Gallery button. Once the Edit Featured Gallery dialog opens, upload the images you'd like in your gallery, or select them from images you've already uploaded with the Add to Gallery link. Once your images are selected, click Add to Gallery. When finished, you can arrange your images by selecting and dragging them into position. If the theme supports image captions, you can add one in the Edit Featured Gallery page.

  • Once you've added your images and content you can publish and preview your post.

Video Posts

  • Create a new post and add a title and post content.

  • 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 video and the value will be your embed code. See this image for reference: Video Custom Field. The embed code should look something like the code below. Click Add Custom Field.

Sample embed code:
<iframe src="http://player.vimeo.com/video/4143170?title=0&amp;byline=0&amp;portrait=0" frameborder="0" width="1200" height="600"></iframe>

  • Once you've added the custom field and content you can publish and preview your post.

Quote Post

  • Create a new post and add a title and description.

  • To add the large quote, simply write or paste the quote in the editor window. The text will auto format to large block letters with a dark background.

  • To add a cite name, write the name below your text and set the font in bold. This will tell the theme that it's the cite and will size and style it smaller. See this image for a sample of how to add a quote properly. Adding A Quote

  • On the right hand side of your page, you'll see the Format pane. Click Quote to set the post format.

  • Once you've added your quote and selected the Quote format you can publish and preview your post.

Status Post

  • Create a new post and add a title and description.

  • On the right hand side of your page, you'll see the Format pane. Click Status to set the post format. This will format the post with the note card background.

  • Once you've added your quote and selected the Status format you can publish and preview your post.

Post Styles

Fixed comes with a few custom element styles, which are used to easily add extra styling to your WordPress posts.

To use the post styles, simply select your text and then select from the drop down which style you would like to apply. You'll be able to see the changes live, in your editor.

  • Intro Title - As seen on the demo, this is a nicely styled block of text to introduce your page. Similar to blockquote styling.

  • Highlight Text - As seen on the demo, this styles your text with a highlighted yellow background.