How To

Important installation note

After installing and activating the 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 theme.

You also need to navigate to Settings > Reading and set front page to display “Your latest posts” if you have previously had a static page as your front page.

Navigate to Settings > Permalinks. Click on "Save Changes" to register the custom post types.

Home page overview

The homepage consists of a featured area, mini-features area, home sidebar and a widgetized footer.

An overview of home page modules of Sealight

Setting up the home page

Once you have installed the Sealight theme on your WordPress 3.+ website you’ll see a custom panel called “Sealight” in your WordPress backend menu, with the theme options, etc. within that panel. You’ll also see 3 custom post type panels that appear in the backend menu – “Slides”, “Info Boxes” and “Testimonials”. These three custom post types are used to display content on the home page.

The custom panels that appear after installing Sealight

Setting up the featured slider

The Sealight home page featured slider pulls the custom “slides” post type. The number of slides depends on how many slides you have published. You can set the animation speed, auto start and slide interval under the theme options, the rest of the slide functionality is added via the slides panel documented below.

The featured slider 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 a “Slider Image” in the Custom Settings panel if you want to display an image in the slide.
  4. Publish the slide.
Adding a slide to your home page slider, more slide options below.

Add buttons to the featured slides

To add a button to a slide in the featured slider simply add a button text and button link out, as can be seen below, in the “Sealight Custom Settings” panel when adding/editing a slide.

Adding a button to a slide

Add video to featured page

Adding video is just as simple as adding an image to the page. Simply use the Embed field in the Custom Settings panel, and add your embed code.

Adding a video to a slide

Setting up the information boxes

The Sealight home page information boxes also uses custom post types and pulls in the  the custom “Info Boxes”. The number of info boxes depends on how many “Info Boxes” you have published. You can enable the info boxes area on the home page under the “Homepage” theme options. You can also add two pieces of content from WordPress pages to the home page if you specify the page IDs of the pages you wish to display.

Enabling the home page info boxes.

Adding an info box

To add an info box simply follow these steps:

  1. Go to Info Boxes > Add New.
  2. Type a title for the Info Box and complete all of the post’s body content.
  3. Add a “Info Box Icon” in the Custom Settings panel if you want to display an icon next to the slide.
  4. Publish the info box.
Adding an info box

“Read More” Links

Info Boxes are publicly query-able and will produce a inner single pages, unlike slider and testimonial posts. When you publish an info box, the ‘Read More’ link will point to it’s permalink, taking you to the single.php template showing the corresponding data. This ‘Read More’ link can either be removed or substituted with a custom URL link.

Info Boxes on the Homepage – Visibility and Order

By default all info boxes are set to appear on the Homepage. To hide certain info boxes from the homepage, you need to check the “Hide on Homepage” box. This will hide boxes from the homepage.

All info boxes are ordered by date ascending. If you want to change order, update the info box publish dates to the order you want them to appear.

Custom Permalinks

When you publish an info box the resulting page created acts like a post page. There is a single.php template available for it and will also come with it’s own unique URL. If you choose to use this page in your theme. Eg. “http://mysite.com/infobox/waterproof” you might want to make it more tailored to your needs. Eg: “http://mysite.com/features/waterproof”. This can easily be achieved with the custom URL / Permalink option.

Create a unique URL structure

Adding the Info Boxes page template

There is a button on the Sealight home page below the info boxes called “View all features” (see demo). When you click on that button it takes you to a page dedicated to all the info boxes you have added.

To add the dedicated info box page simply follow these steps:

  1. Go to Pages > Add New.
  2. Type a title for the Info Box page, leave the post’s body content empty.
  3. Set the template to “Info box template”.
  4. Publish the page.
Adding the info box page template

Setting up the testimonials

The Sealight home page testimonials also uses custom post types and pulls in the the custom “Testimonials”. The number of testimonials depends on how many “Testimonials” you have published.

Enabling the home page info boxes.

Adding a testimonial

To add an info box simply follow these steps:

  1. Go to Testimonials > Add New.
  2. Type a title for the Info Box and complete all of the post’s body content.
  3. No need to add any “Sealight Custom Settings” options.
  4. Publish the testimonial.
Adding a testimonial to the home page of Sealight

Widgets

Custom Optimize widgets

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

[insert name=”adding-widgets”]

Supported Plugins

Yoast Breadcrumbs

Easily add breadcrumbs to your WooThemes template to show your site visitors exactly where they are on your site. If you’re using one of the supported WordPress frameworks, it’s as easy as installing and enabling the plugin and checking the “Try to add automatically” box.

After the Breadcrumbs installation, you'll enable this functionality on all pages

You can download the plugin from the WordPress plugin directory here.

Page Navi

Page Navi adds a more advanced paging navigation to your WooThemes site. By default you’ll see the “Previous” and “Next” buttons to navigate to older/newer blog posts in the archives. With Page Navi you can navigate via the number of archived blog post pages there are.

How the Page Navi pagination results look.

You can download the plugin from the WordPress plugin directory here.”>WordPress plugin directory here.

Page Templates

[insert name=”page-templates”]