Customizing the Theme

Fancy Lab is highly customisable. Among the items that can be customised, you have:

  • Two menus (main 3 level top menu and footer 1 level menu)

  • Site logo

  • Slider

  • Popular Product List (Home Page)

  • New Arrivals Product List (Home Page)

  • Deal of the Week optional item (Home Page)

  • Section home page titles

  • 5 widget areas (main archive sidebar, shop sidebar and 3 footer areas)

  • Copyright information

If you want to customize those options, go to Appearance -> Customize

Site Identity

Here you can upload your site logo and set the site title and tagline.

The suggested image dimensions for the logo are 160x85 pixels. You may upload images with different dimensions, but we can't guarantee they will have a perfect look.

Fancy Lab has two menu locations (Main Menu and Footer Menu) and a stand-alone menu (Widget Menu).

You can build menus with up to 3 levels using the "Main Menu" location and 1 level menus with the "Footer Menu" location.

The Main Menu is responsive and will be replaced with a "hamburger menu" in small resolutions.

Widgets

Fancy Lab has 5 widget areas (also called sidebars in WordPress). Throughout the page you'll see three of them being displayed on footer (Sidebar Footer 1, 2 and 3).

Another sidebar is displayed only on the Shop page (Sidebar Shop). The demo data includes two of them (WooCommerce Filter Products by Price and WooCommerce Product Categories). You can use this sidebar to display widgets related to the shop (WooCommerce widgets), any WordPress native widget or any downloaded plugin/widget.

Fancy Lab also brings a sidebar that will be displayed on every archive page (blog list, category, author, tag or date page), and on single post pages.

WordPress native widgets and WooCommerce widgets will display nicely within the theme. But the same won't happen with plugins you download. You may need some further CSS styling for them to look good.

Homepage Settings

This theme works best if homepage is displayed as a static page. If you have installed the theme's demo data, everything is already setup for you. If that is not the case, you can do the following:

  • Create an empty page with the name "Home" and slug "home".

  • Under "Page Attributes", assign the Home page to a template called "Home Page".

  • Create an empty page with the name "Blog" and slug "blog".

  • Go to Settings -> Reading. Under "Your homepage displays", choose "A static page".

  • Select the "Home" page as your homepage and the "Blog" page as your posts page.

You can simply set your copyright information, that will display on footer.

Slider Settings

The Fancy Lab slider is based on static pages. To create a slide, follow these two steps:

1 Create a page

Go to Pages -> Add New.

The page title will act as the main slide title. Meanwhile, the editor content will act as the subtitle. We recommend you only write text in those areas.

To upload an image to the slide, you can use the featured image field. Larger images will work best. So, avoid uploading small images, because they won't display correctly in the slider.

2 Assign your page to the slider

Go to Appearance -> Customize -> Slider Settings.

Choose the page you have just created. In fact, any page can be chosen.

Set a text and a URL for the CTA button. You can use any URL. For example, you can copy and paste a product category page link, or a link for a specific product.

Repeat the steps if you want more slides inside the main sliders. The maximum number of slides is 3.

Home Page Products and Blog Settings

Here you can choose titles for the homepage sections, as well as define values for the products display on each section.

The "Deal of the Week" section is optional. It will only display if the checkbox "Show Deal of the Week" is checked and if some product ID is set under "Product ID to display".

You can choose between any WooCommerce product. To find the product ID, open up the Products menu and hover over any product in the table (see image below).

The tag with the discount percentage will only display on frontend if the product chosen has a sale price.

Last updated