How To

Setting up the Homepage

Below is a screenshot of the Swatch home page with each of it’s modules explained. More detailed documentation below.

The Swatch homepage layout and modules explained.

The home page of Swatch is largely widget based, with 3 regions available for placement of custom woo widgets below the mini-features module, and 0-4 regions in the footer. Place widgets in these regions under “Appearance > Widgets”, follow the documentation on placing widgets below under the corresponding documentation.

The featured slider can easily be enabled/disabled under “Homepage Slider” theme options (more information in the next “How To” section) in the theme options.

The Swatch theme comes with support for 2 menus. The Primary Menu is located below your theme header. The Top Menu (not show in the demo) will appear in a strip across the top of the site. You can activate the top menu under “Appearance > Menus”. See documentation on “Menus” for more info.

Setting up the Featured Slider

The unique home page featured slider can be used to display noteworthy content and has it’s own custom post type called “Slides” designated to it. The slider uses custom post images for the background image, and then shows the the title and content in a caption.

The homepage slider theme options.

The Swatch homepage slider pulls the custom “slides” post type. The number of slides is set under the “Homepage Slider” theme option’s panel. You can set the animation speed, effect, auto start and slide interval under the theme options.

Adding a slide

To add a slide simply follow these steps:

  1. Go to Slides > Add New.
  2. Type a title for the slide and complete all of the post’s body content.
  3. Add an “Image” in the Custom Settings panel if you wish it to appear as the background image. Alternatively, add it in the content if you wish it to appear within text content.
  4. Publish the slide.
Adding a portfolio item.

Setting up the Portfolio

This theme includes a portfolio module which can showcase your work or products on both the home page and on a dedicated portfolio page of your site.

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!
Setup a portfolio page template

You can change the size of the portfolio images on the portfolio archive page under the “Portfolio Settings” theme option’s panel. You also have control over whether the portfolio items appear in search results.

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 a tag to the post if you wish to categorize your portfolio (e.g. “Web” or “Print”)
  4. Add some text in the content to describe the portfolio item
  5. Decide on whether you want your portfolio page to have the sidebar, or appear full-width, under the layout control.
  6. Upload the Portfolio image in the Custom Settings area
  7. Publish the portfolio item!
Adding a portfolio item.

Upload multiple images per portfolio item

To have multiple images under the portfolio item, enter the rest of the images by uploading image attachments to the Portfolio Item and click Save Changes.

Uploading multiple images to a portfolio item

Setting up the Blog

To create a dedicated blog page you need to create a new page, it doesn’t need any content in it, as you would the portfolio page documented above. Then assign the “Blog” page template to that page. Once you’ve done that you can navigate the “Appearance > Menus” page and add a menu item to your navigation so visitors can easily access the page.

Setting up the Mini-Features

Mini-features can be used to highlight your business, or website’s key features. These will then appear under your homepage slider as you can see on our demo.

To add Mini-Features just navigate to “Mini-Features > Add New”. Give your mini feature a title, some content, to be displayed if a user navigates directly to that mini-feature page itself, a mini-feature excerpt and icon (if you so desire).

Adding a mini-feature for the homepage.


Custom Swatch widgets

The theme includes 8 custom widgets that you can add to any of your widgetized regions. Go to Appearance > Widgets to add these to your theme.

The custom woo widgets included are:

[insert name=”adding-widgets”]

Page Templates

[insert name=”page-templates”]