Setting up the theme (Videos)

Importing the Demo Data (xml)

After installing the theme and activating it, you will be redirected to the Theme’s One Click Installation page. You will get the choice if you want to import the demo data (with some restrictions), or skip this step and start with a blank theme.

With Demo Data

If you proceed importing the demo data, you will get all the content our demo page has. There are only a few restrictions: You will not get the images you see there. The reason is simple: We use Stock Photos on the Demo we mostly bought on Photodune. As we do not have the distributional rights for these images, we can not give you access to those. Another restriction are the sidebar widgets. WordPress has no sidebar export feature, that is why you are required to install these on your own.
Once you imported the content, you are almost done. Read on for more information on the theme’s features and how to create new content.

Without Demo Data

If you do not want to import any demo data (only recommended for pro users), you will have to create every content on your own. Please read the following documentation carefully.

However, if at a later point you begin to think it would have been better to import the Demo Data, you can do that at any point, by accessing the Flix -> Installation / Reset menu point in your wordpress navigation.


Setting up the mainpage


Overview of the Admin Panel Features

Bebel Powered Themes have an amazingly easy to use Admin Panel. There are three different sections we introduce features into the WordPress Admin Panel.

1. The Theme Panel

The Flix Theme Panel consists of 7 Pages. It groups every general functionality of the theme. In this section, we will explain what the different pages are used for and how you can manage them the best.


1. The Theme Configuration Panel

The Theme Configuration Panel will be probably the section you will use the most – at first. It is the place where you can configure any part of the theme. If you want to change your logo, configure the blog page, set up the default page layout, set up the portfolios or galleries, configure mailchimp or the main page slider. All can be done in one place, in a very comprehensive Theme Configuration Panel.


The Panel is divided in a top tab bar and a left tab bar. While the top tabs consist of the modules of the Theme, the side tabs contain sub-categories of these modules. Apart from the Theme’s “Basic” tab, you will find links, such as Slider, Portfolio, Mailchimp and more. Read more about each section in the related section.

2. The Styles Panel

In the Theme Configuration Panel, you can change almost every setting. In the Styles Panel, you get an introduction of how to change the styles of the theme. And not only that. You can change the base layout (color style) of the theme and you can directly change the colors of some selected texts, headers, links and backgrounds in a easy-as-hell colorpicker style panel. Also, you can use the pre defined CSS text box to input your custom css.


We have a 5 way system with the theme to give you the utmost flexibility. You are not require to follow all of them, you can just choose the one that gives you the most satisfaction. Here is a list of the possibilities:

  1. Layouts
    Choose between a few predefined layout files. Each layout has a different color set predefined. They are also based on css files, and can be found in the css folder with the “layout-” prefix. This system makes it even possible for you to create your own layout css files. Copy one of the existing files and name it layout-yourname.css, upload it, and it will appear magically in your layouts section of the Style Panel.
  2. custom.css
    The very traditional way. You put your custom styling in a css file we prepared for you. You upload it through your ftp folder and your changes override the default css files.The changes to the custom.css will override the layout settings.
  3. Color Pickers
    We have prepared a bunch of color pickers for you lazy people out there. If you do not want to go into the css just to change a font color or a background color, just head over to the color picker department.
    Changes here will override the custom.css changes.
  4. CSS Box
    Another great entry point for quick prototyping and try’n error development. We have placed a css box in the Style Panel as well. It gets loaded after the color pickers, in case you want to override a background with a pattern or similar.
    We do not recommend to use this box for large chunks of css, as the browser will not cache it. If you put the css code after testing in the custom.css or in your layout css file, it will be cached and your website will speed up.
  5. Post / Page
    The last step is custom css for each Post or Page you create. Even galleries and more can have a custom css. The input location is the Post Options beneith the text area on the edit pages of a Post or Page.
    This CSS will override every change you made before, as it comes last. However, if you use custom colors in (some) short codes, it might require the !important attribute.

3. Sidebar Generator

The Sidebar Generator does exactly as the name says. You can generate new sidebars here, which you can use through out the whole theme. Once you created a sidebar, it will appear in the Appearance -> Widgets page and you can populate it with your favorite widgets.

You also can define a set of default sidebars for posts / pages / categories / buddypress / misc (search, tags..) and more. You can override these defaults in each blog / post manually through the Post Options beneith the text field.


4. Help & Support

This section contains a useful collection of links to get help. For once, there is this very documentation linked to as pdf. Furthermore you will find quick links to the support forums, the theme’s page on themeforest and to our profile, if you ever need to get in touch with us privately.


Rate This Article

(40 out of 140 people found this article helpful)