How To

Welcome to FlipFlop, an awesome, clean, and responsive theme with a design focused on getting your visitors reading your articles. Let’s walk through the theme’s features here and how to setup each one.

Setting Up The Homepage

Outside of the usual custom logo upload, background, or typography in the theme options there are a few important options to note when setting up the homepage.

First take a look under FlipFlop>Theme Options>Layout Options.

You’ll find a few options to help you tweak the layout such as putting the sidebar on the right or left hand side of your content. Also, you’ll see options to exclude categories from the homepage and on your blog. Finally a few other options to enable the search field and navigation in the header, as well as an option to change how the meta data is displayed.

Next up is the real meat of the homepage, the module setup and options as well as how to use widgets on the homepage. You’ll find these options under FlipFlop>Theme Options>Homepage.

You’ll first see a note explaining how to use the homepage as a widgetized page. To do so, all you need to do is start putting widgets in the Homepage widget area under Appearance>Widgets. We’ve included our Woo – Component widget that holds the default modules. That means the Featured Slider, Recent Entries, Specific Entries, and Categories Grid sections are easily re-arranges as any widget via a quick drag and drop into your preferred order.

If you prefer to use the standard layout and skip the widgets that is perfectly fine to. You can simply enable or disable those sections as you wish.

The following options apply to both the widgetized homepage and the standard homepage. While still under the homepage options you’ll see the following three sections to navigate to and finish setting them up. Featured Slider, Recent Entries, and Specific Entries.

Setting Up The Featured Slider

Under FlipFlop>Theme Options>Homepage>Featured Slider is where you’ll find these settings. The Featured Slider has a slew of options to control how the slider works and functions. The two to make note of are how the slider filters your content. It offers the choice to either use categories or tags to pull in content from your site. You can of course use both if you’d like. For example you could have a category where you only put your posts you want in the slider, and the same goes for tags. You can select a tag like featured to use in the slider. You then tag the posts you want to be in the slider with featured.

Setting Up The Recent Entries

Under FlipFlop>Theme Options>Homepage>Recent Entries is where you’ll find these settings. The Recent Entries area is as it’s name say where theme will pull in your latest posts. There are a slew of standard options here for you to tweak to your liking, such as number of entries, image size and alignment, plus more!

Setting Up The Specific Entries

Under FlipFlop>Theme Options>Homepage>Specific Entries is where you’ll find these settings. Again, there are plenty of options for you to have complete control over this section of FlipFlop. We’ve used it to setup a “News in Pictures” section, using the thumbnails from certain posts on our site. Using the Specific Entries section, it’s worth noting that you can filter posts here by either category or tag. This works just as it does in the Featured Slider. If you only want a certain category or tag to show up in your Specific Entries you can easily do so here.

Using The Column Generator

Here is a quick walk through on how to setup columns using our column generator. Note that this tool isn’t included in all of our themes, only themes that require such a tool like certain magazine and news themes.

When editing a page or post, first scroll down to the theme’s custom settings box. There you will find the Column Layout Style and a note on column layout selection.

We’d first suggest to read over the note on column layout selection. It says,

“When selecting a column layout option, please be sure to add only the appropriate number of column breaks into the content editor above. For example, if you have selected a two-column layout, only a single column break is required to produce two columns. If you have chosen a three-column layout, two column breaks are required.”

With that in mind for your post or page you should be able to use the Column Layout Style options next. You’ll want to pic the appropriate layout you are going for with your post or page here. For this example, we’re going to setup three equal columns.

Once you have that selected, you’ll know how many column breaks to enter into your page or post. Scrolling up to the content, let’s see how that works. You’ll notice under the visual editor the column break icon. You simply click this to insert your breaks.

Just find areas in your post where you’d like the breaks to be at and click the icon. That will insert one break for you. Since we’re wanting a three column layout, we need to enter one more for a total of two breaks for three columns. We’ll scroll here and insert one to finish it up.

Let’s now publish this post and view it on the front end. You’ll see your three beautiful columns now, setup just as you wished.

As noted, this works very similarly for whichever column layout you’ve chosen. Just be sure to use the appropriate amount of breaks for the columns you’ve selected. Thanks for watching!

Widgets

[insert name=”adding-widgets”]

Page Templates

[insert name=”page-templates”]