How To

Setting Up Scrollider

Scrollider is a fun and flexible business theme ready to take your site to the next level. It’s packed to the brim with WooThemes features. Let’s go over how to setup the theme.

Scrollider’s homepage contains a unique 1 to 3 column design. This is controlled by adding widgets to the “Homepage Left”, “Homepage Centre” and “Homepage Right” widgetized areas. If you add widgets only to “Homepage Left”, those widgets will take up the full width of the homepage content area. If you add widgets to two of the areas, each column will take up half of the homepage content area. If you add widgets to all three of these columns, you will receive a 3 column layout.

There is also a “Homepage Full” widget area, for displaying custom content in a full-width area below the columns section.

By default, this content is displayed as “News from the Blog”. This can be overridden by any one or more widgets, which will all display in full-width.

The “features” section can be enabled/disabled under “Theme Options” as well, and is fully optional.

Setting Up The Slider

First up is the Slider. Scrollider has a unique slider in it. You’ll first want to head into Scrollider > Featured Slider to setup any and all options you’d like here. Most importantly is to enable or disable it based on your site preferences.

After you’ve got it setup, we’ll need to create some slides for it. It’s important to note that you need to create at minimum the number of slides you set in the theme options. If you’ve set it to show 3 slides then we need to create 3 slides. You can do so by going to Slides>Add New. Be sure to title your slide and write a short description/excerpt. Then you can either upload an image using the Featured Image or TimThumb options, or you can paste a video embed code. The slider will handle either type of media just fine.

If using an image, note how Scrollider uses slide images here. The image is designed to fill the entire width of the slide, and should be a relatively large image in dimension (3000 pixels wide is a good starting point).

To Recap

To add a slide 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. If you want an image to appear as the background to the entire slide than add a “Featured Image” in the provided “Featured Image” box.
4. If you want to use a video simply past the embed code in the proper box under the Custom Settings
5. Publish the slide.

Features Area

Next is the Features Area. You can enable this under PixelPress>Homepage Setup>Features Area. Then under PixelPress>Homepage Setup>Mini-Features you’ll find more options.

Once you’ve setup your options you will need to create at minimum the number of features you specified in the theme options. If you set it to show 3 Features then be sure to create at least 3 features. You can do so by navigating to Features>Add New. Here you simply need to fill out the title, excerpt, and then upload an image if you’d like.

To Recap

To add a feature follow these steps:

1. Go to Features>Add New.
2. Type a title for the feature and complete all of the post’s body content.
3. If you want an icon to appear beside the feature than add a “Features Icon” in the Custom Settings panel.
4. Add an excerpt for the feature in the “Features Excerpt” field in the Custom Settings panel.
5. Publish the Feature.

Featured Area – Social Links

The social links next to the features on the homepage are controlled under the “Subscribe & Connect” settings under “Theme Options”.

Setup The Portfolio

The portfolio area below the Features is a great spot to show off the work you’ve done and is pretty simple to setup.

First we’ll need to be sure that your portfolio page is setup correctly. Create a page and title it however you’d like, we’d recommend calling it Portfolio. Then be sure to assign the Portfolio page template to it.

From here we need to add items to the portfolio. Go to Portfolio>Add New. Title your portfolio item and write a short description of it if you’d like. You can also add it to a portfolio gallery of your choice to organize it. Now you can add your images or paste a video embed code in the custom settings box. Finally, click publish.

To add multiple images to a portfolio post simply upload all of them when setting a featured image. Once you’ve set your featured image the rest of the images will be pulled into the post.

To Recap

To add a portfolio post follow these steps:

1. Go to Portfolio > Add New.
2. Type a title for the post and complete all of the post’s body content.
3. If you are posting an image(s) upload them via the appropriate image options you’ve chosen.
4. If you want to use a video simply past the embed code in the proper box under the Custom Settings
5. Publish the portfolio post.

Single Posts Widget Area

On each single posts screen is a “Single Full” widget area. This can contain any widget. We recommend using the “Woo – Related Posts” widget in this area, which will automatically detected related posts based on the terms assigned to that post. This applies across any post type (for example, products that share a common category, or blog posts that share a common tag).

You could also customise this per-blog post using our WooSidebars plugin.

Portfolio Area

You can setup a page with the “Portfolio” page template to display your portfolio items in a comprehensive grid.

Widgets

Custom Scrollider Widgets

The theme includes 10 custom widgets that you can add to any of your 10 widgetized regions – 1 sidebar, 4 footer widgetized regions, a full-width homepage region, 3 homepage columns and a full-width widgetized region on single post screens. Scrollider also includes styling for many of our WooDojo widgets.

The custom woo widgets included are:

• Woo – Adspace
• Woo – Search
• Woo – Flickr
• Woo – Blog Author Info
• Woo – Embed/Video
• Woo – Subscribe/Connect
• Woo – News From The Blog
• Woo – Post Type Slider
• Woo – Related Posts
• Woo – Feedback

By default, in the “Homepage Full” widget area, if no widgets are added, the default content is the “News from the Blog” widget. This can be overridden by any one or more widgets to the “Homepage Full” widget area, which will all display in full-width.

[insert name=”adding-widgets”]

Page Templates

[insert name=”page-templates”]