How To

Important installation note

Please note there is an important first step after installing the Caffeinated theme. You need to navigate to Settings > Permalinks and click on the “Save Changes” button, even if you haven’t made any changes. This is to register the custom post types used in the Caffeinated theme.

Home page overview

The homepage consists of an introduction, portfolio and recent blog posts section as well as a widgetized footer area.

An overview of the Caffeinated Home Page

Setting up the home page

Once you have installed the Caffeinated theme on your WordPress 3.+ website you’ll see a custom panel called “Caffeinated” in your WordPress backend menu, with the theme options, etc. within that panel. You’ll also see a custom post type panel that appear in the backend menu – “Portfolio”. This custom post types is used to display portfolio content on the home page and portfolio template.

Setting up the home page

Setup the Portfolio

This theme includes a portfolio template which can showcase your work or products. To add the portfolio you need to follow these steps:

Add the Portfolio link to navigation

  1. Add a new Page in WordPress (Page -> Add New)
  2. Add a title to the page e.g. “Portfolio”
  3. Select the Portfolio page template in the Attributes panel on the right
  4. Publish your page!
Adding the portfolio template

Adding portfolio items

The portfolio section also uses a custom post type called “Portfolio”.

  1. Add a new portfolio item in WordPress (Portfolio -> Add New)
  2. Add a title to the portfolio item
  3. Add some text in the content to describe the portfolio item
  4. Upload the Portfolio Thumbnail image in the Custom Settings area
  5. Upload a large image OR add an URL (to external image or video etc.) which your thumbnail will link to
  6. Add an optional Portfolio Link to to show a “Visit Site” button in your portfolio item
  7. Add an optional tag to categorize your portfolio item
  8. Publish the portfolio item and repeat for next portfolio item
Adding a portfolio item

NOTE: You must have uploaded a “Portfolio Large” image for image attachments to work.

Upload multiple images per portfolio item

When opening a portfolio image in the included lightbox, you can have multiple images there to look through. You can set this up very easily under the portfolio item. Here you enter the rest of the images by uploading image attachments to the Portfolio Item and click Save Changes (do NOT insert them into the post after upload).

Uploading multiple images to a portfolio item

Setup options

  1. Go to the theme Options Panel
  2. Setup portfolio category tags if you wish to categorize your posts
  3. Tick “use lightbox” if you wish the large images to display as an overlay when clicked on, not a link that takes you to a new window.
  4. Save settings and you’re done!
Portfolio Options

Widgets

Custom Optimize widgets

The theme includes 8 custom widgets that you can add to any one of your widgetized areas:

  • Woo – Flickr
  • Woo – Adspace
  • Woo – Search
  • Woo – Blog Author Info
  • Woo – Custom Nav Menu
  • Woo – Tabs
  • Woo – Embed/Video
  • Woo – Twitter Stream

Page Templates

Custom Page Templates

This theme comes bundled with unique page templates for some additional functionality to your WooThemes powered website.

Below is a list of some of the page templates available across our themes. Please note they are not all bundled with all our themes.

  • Archives (template-archives.php) – Displays all categories, monthly archives, popular tags and the 30 latest posts.
  • Sitemap (template-sitemap.php) – An alternative to some WordPress plugins out there, this page template will create a sitemap, which you can use for SEO & user-usability purposes.
  • Full Width (template-fullwidth.php) – A full width page template without the sidebar.
  • Redirect (template-redirect.php) – Is a nifty page template used to “fool” WordPress into creating a menu item in your page navigation, which is in fact a link to an external site. Follow the steps mentioned below under “Adding an external url to your page navigation menu”
  • Image Gallery (template-imagegallery.php) * – Displays the images you have associated with your posts in an image gallery, linking back to the original article
  • Contact Form (template-contact.php)* – A page with a contact form on it so that a web visitor can email you. Please note you will have to add your email address to the theme option’s panel of the theme to make sure it is set up correctly.
  • Blog (template-blog.php)* – A custom page to display posts in an alternate way to the archive.
  • Portfolio (template-portfolio.php)* – Pulls in all posts from the custom post type ‘Portfolio’.
  • Tags (template-tags.php) – Displays all tags used on your website on a dedicated tab page.
  • Timeline (template-timeline.php) – An alternate template to the Archives page template – displays posts in order of year.

Leave a Reply