How To

Setting up the home page

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

The Editorial homepage explained.

The home page of Editorial is modular with each module enabled or disabled in the theme options with the sidebars being widget based, with 4 regions available for placement of custom woo widgets in the footer and 1 sidebar region. Place widgets in these regions under “Appearance > Widgets”, follow the documentation on placing widgets below under the corresponding documentation.

If you don’t want the primary sidebar to appear on the home page simply don’t place any widgets in it (the same applies to the footer region) and your two column post layout below the featured slider will become a 3 column post layout spanning the full width of the website wrapper. You can also use the Sidebar Manager documented below to add unique sidebars to specific pages of the site.

Setting up the featured slider

You must have more than one post tagged with your slider tag for this to work.

The unique home page featured slider can be used to display noteworthy blog posts – this is because it is tag based. Once you have specified the tag it must loop through to display posts, make sure you add that tag to the blog posts you want to feature. It will display the title of the post, the excerpt, and the optional, but important, custom image which is the focal point of the panel. You can also have a slide dedicated to a video.

The homepage slider theme options.

Adding the tag to the post is important, as is specifying the image to use in the “Editorial Custom Settings” panel below the WYSIWYG editor on the Add/Edit post form.

Adding a post to the slider. You can control exactly what appears, it's position, and the slider transition in the Editorial Custom Settings panel.

If you see the custom settings panel, below the WYSIWYG editor in the screenshot above, you’ll see the control you have over how the slide will look under “Slide Options”. Each slide can have a specific slide effect, and the slide excerpt can be positioned very specifically.

To specify the image to use in the slide use the “General Options” tab of the Editorial Custom Settings Panel.Simply browse for the image on your computer, upload it, and then “Insert into post”, which will insert it into the custom field to display in the correct place at the correct size.

If you’ve specified a video in the post, also under the “General Options” in the Editorial Custom Settings panel, by placing the embed code in it’s corresponding field you can choose whether to display the video in the slide, or an image that clicks through to the single post page where the video can also be played from.

Setting up the recent news module

On the Editorial home page you can display posts from specific categories below the optional featured slider. These posts appear in a 2 or 3 column layout, depending on whether you use the primary sidebar widgetized region on the home page.

This module by default displays latest blog posts, but you can also specify specific category’s blog posts to also appear in the tabber. The tabber is AJAX powered so it will not load all the posts on the initial page load, instead it will load them when that tab is clicked on. This will save on initial load time of your homepage.

The options for this module appear under “Homepage Options” in the theme option’s panel.

Note: You must specify the categories to appear in the tabber by adding their category IDs in the “Recent News Categories” field. You can place them in any order and separate them with a comma. This gives you complete control over what appears.

The Recent News theme options. We've specified 3 categories to pull through as tabs, as well as the default latest news tab.
The recent news module on the Editorial home page, with the settings used above.

Setting up the more news module

Below the “Recent News” module you can display even more blog posts on your home page. Enable/Disable this module under “Homepage Options” and specify the amount of blog posts to display. You can then also specify whether to display a thumbnail with the little posts and the position of that thumbnail.

The More News module enabled on the demo. No tag has been specified meaning it is displaying more latest posts that do not already appear above in the featured slider and recent news module.

Blog posts that appear in the “Recent News” module and the featured slider will be excluded from appearing here.

Customizing the unique layouts of your blog posts

Editorial’s unique selling point is the ability to completely customize the look of your blog posts when viewed individually.

Setting up a blog post's styling options and layout in the WordPress post editor.
The end result of the post above - the single post view with the 2 column post content enabled.

When adding/editing a blog post make sure you’ve set all the Editorial Custom Settings panel options for your custom layout to apply to the post. If you ignore the options and publish the post it will display using the default post layout – a singular content column with a widgetized sidebar.

A step-by-step guide below:

  1. Give your post a title and add your content using the post editor, as you would usually in WordPress.
  2. Add an excerpt for your blog post if you don’t want one automatically generated as the first “x” characters of your blog post.
  3. Under the “Editorial Custom Settings” add an optional featured image under “General Options”, as well as an optional video embed code if your post has a video in it.
  4. If you wish to feature this post in the homepage featured slider follow the above “Setting up the featured slider” documentation, and specify your slider effect and excerpt position under “Slide Options”.
  5. Under “Gallery Options” you can specify whether to show the image gallery in your blog post, or prefer to place your images in the columns individually.
  6. The all important “Column Options” allows you to specify how many columns to split your post content into. In the above example we specified a 2 column with a narrow left column and wider right column. You can then specify how many columns the post title, image gallery/slider, and except should span.
  7. Seeing we specified the 2 column layout for the post content we need to place only one column divider in our post. Place it like you would a “Read More” break anywhere in your content. Look for the “Add Column Break” button next to the WooThemes shortcode button in the WYSIWYG editor.If you were to choose a 3 column layout for your post content you’d need two column breaks in your post content.
Adding a column break with the Editorial "Add a column break" button in the WYSIWYG editor.

Widgets

Custom Editorial widgets

The theme includes 8 custom widgets that you can add to any of your 5 widgetized regions – 1 sidebar and 4 footer widgetized regions.

The custom woo widgets included are:

[insert name=”adding-widgets”]

Page Templates

[insert name=”page-templates”]

Use of your personal data
We and our partners process your personal data (such as browsing data, IP Addresses, cookie information, and other unique identifiers) based on your consent and/or our legitimate interest to optimize our website, marketing activities, and your user experience.