Welcome, we are very pleased that you've purchased Empic Theme.
With this document you will get general information about Empic theme, hope that will be helpful for you.

Before you start customizing

If you plan to make some modifications to the code of the theme, will be better to make them via the child theme. If you make modifications directly to the parent theme, you will lose them when the theme is updated. When you make modifications inside of the child theme instead, you can update the parent theme without losing any change you have made.

Child Theme you'll find in a "empic-child.zip", which is included in a main downloaded package.

More information about child themes you can find in WordPress Codex.

Getting Started

Installation

To install this theme, you must have a working version of WordPress already installed. For information regarding installing the WordPress platform, please see the WordPress Codex - https://codex.wordpress.org/Installing_WordPress.

Installing Theme Using the WordPress Admin

To add a new theme to your WordPress installation, follow these basic steps:

  1. Download a package from ThemeForest in a "Downloads" section
  2. Log in to the WordPress Administration
  3. Go to "AppearanceThemes › Add New › Upload Theme"
  4. Browse and select theme zip folder called "empic-*.zip" (is located inside of downloaded zip package)
  5. Press Install Now button
  6. Activate theme with Activate link

Installing theme manually via FTP

Use your FTP Client to upload non-zipped folder called "empic" (Unzip the empic-*.zip file) and "empic-child" (optional child theme) into the "/wp-content/themes/" folder on your server.

More information about using themes on https://codex.wordpress.org/Using_Themes

Update

To update the theme please follow these basic steps:

  1. Download an updated package from ThemeForest in a "Downloads" section
  2. Log in to the WordPress Administration
  3. Go to "AppearanceThemes
  4. Activate other theme than Empic
  5. Click on outdated theme and remove it (all content, widgets and theme options will be preserved)
  6. Go to "AppearanceThemes › Add New › Upload Theme"
  7. Browse and select theme zip folder called "empic-*.zip" (is located inside of downloaded zip package)
  8. Press Install Now button
  9. Activate theme with Activate link

Required Plugins

To add the needed functionality to the theme is necessary to activate the required plugins.

  1. Go to "Appearance › Install Plugins"
  2. Install and activate plugins you want to use with a theme.

The functionality is added to the WordPress, and you can use the theme in a standard way. You can continue to import demo content.

Important!

Install only plugins you want to use with the theme. Some plugins can cause the slower loading of the website.

Import Demo

To automatically import the demo data into your WordPress, follow these basic steps:

  1. Go to "Appearance › Install Plugins"
  2. Install and activate plugin One Click Demo Import, if not installed yet
  3. Go to "Appearance › Import Demo"
  4. Press Import
  5. Let the importer work until it displays information about successful (or unsuccessful) importing (it may take several minutes).

The demo content, widgets and theme options should be imported and you can check your site.

The default structure of a permalink uses the post ID as a unique identifier in the url: https://example.com/?p=23. For the SEO of your website is always better to use much friendly pemalinks as: https://example.com/2017/01/01/sample-post. Follow these basic steps to set permalinks:

  1. Go to "SettingsPermalinks"
  2. Select your option of permalink structure in "Common Settings"
  3. Also you can change the category base and tag base (optional)
  4. Press Save Changes

More about Permalinks - https://codex.wordpress.org/Using_Permalinks

Image Sizes

The Empic theme defines new image sizes, but the problem is that these new image sizes are only applied on the images you upload after activating the theme.
To solve this problem you need to generate new sizes for all previously uploaded images. You can use the Regenerate Thumbnails plugin.

Defined image sizes:

  1. "empic-medium" - width: 420px; height: unlimited
  2. "empic-full" - width: 1220px; height: unlimited
  3. "empic-large" - width: 680px; height: unlimited

Content

Homepage

To set up the homepage, follow these steps:

  1. Create a new page by going to "Pages › Add New"
  2. Fill in the "Title" of the page (for example: "Homepage").
  3. Press Publish and page will be saved
  4. Go to "SettingsReading"
  5. Check the radio button "A static page (select below)"
  6. Select "Front page:" called as created page (for example: "Homepage")
  7. Press Save Changes

Homepage is now set correctly. Don't be alarmed that the page is blank for now, now you need to create a layout by following the instructions below.

Home Page Layout

To create layout for the homepage, follow these steps:

  1. Go to "Appearance › Widgets"
  2. Add Widgets to the "Home Page Content" widget area.

    Drag one of the widgets from the left side, then drop it into the "Home Page Content" widget area.

  3. Empic Theme makes it really easy to arrange your widgets in rows of columns. It works by adding a new ‘Column width’ and ‘Column offset’ select options at the bottom of your widget’s form that allows you to set a width value for each widget.

View the widgets from our demo

Blog

To set up the blog page, follow these steps:

  1. Create a new page by going to "Pages  ›  Add New"
  2. Fill in the "Title" of the page (for example: "Blog") and don't add content, leave it blank. Any content here will be ignored.
  3. Press Publish and page will be saved
  4. Go to "Settings  ›  Reading"
  5. Check the radio button "A static page (select below)" (if isn't already checked)
  6. Select "Posts page:" called as created page (for example: "Blog")
  7. Press Save Changes

Blog page is now set correctly.

Creating Posts

To create post, follow these steps:

  1. Create a new post by going to "Posts  ›  Add New"
  2. Fill in the "Title" of the post
  3. Fill in the "Content" of the post
  4. Select "Categories" of the post (optional)
  5. Fill in the "Tags" of the post (optional)
  6. Set featured image in "Featured Image" metabox in the right column
  7. Press Publish

The first post is now created.

More about Post Formats - https://codex.wordpress.org/Post_Formats

To set up the menu, follow these steps:

  1. Go to "Appearance › Menus".
  2. If you have imported the demo content you should already have the demo menu here, if not then you can create a new one.
  3. Select Create a new menu at the top of the page
  4. Enter a name for your new menu in the Menu Name box
  5. Click the Create Menu button

Adding Items to a Menu

  1. Locate the pane entitled Pages.
  2. Within this pane, select the View All link to bring up a list of all the currently published Pages on your site.
  3. Select the Pages that you want to add by clicking the checkbox next to each Page's title.
  4. Click the Add to Menu button located at the bottom of this pane to add your selection(s) to the menu that you created in the previous step.
  5. You can add an image (hover effect) to each of your menu items.
  6. Click the Save Menu button once you've added all the menu items you want.
  1. Go to "Appearance › Widgets"
  2. Add Widgets to the "Main Menu" widget area.

To create layout for the Sidebar, follow these steps:

  1. Go to "Appearance › Widgets"
  2. Add Widgets to the "Sidebar" widget area.

To create layout for the Footer, follow these steps:

  1. Go to "Appearance › Widgets"
  2. Add Widgets to the "Site Footer" widget area.
  3. Empic Theme makes it really easy to arrange your widgets in rows of columns. It works by adding a new ‘Column width’ and ‘Column offset’ select options at the bottom of your widget’s form that allows you to set a width value for each widget.

WooCommerce Filters

To create layout for the WooCommerce filters, follow these steps:

  1. Go to "Appearance › Widgets"
  2. Add Widgets to the "Shop Filters " widget area.
  3. We strongly recommend that you use widgets with "Empic" prefix here.

Contact Us Page

To set up the contact page with a contact form, follow these steps:

  1. Go to "Appearance › Install Plugins"
  2. Install and activate plugin Contact Form 7, if not installed yet
  3. Open the "Contact › Contact Forms" menu on your WordPress administration panel. You can manage multiple contact forms there.
  4. Just after installing the Contact Form 7 plugin, you’ll see a default form named "Contact form 1", and a shortcode like this:

    [contact-form-7 id="1234" title="Contact form 1"]

    Delete this form and add a new one.
  5. Create a new page by going to "Pages › Add New"
  6. Fill in the "Title" of the page (for example: "Contact Us")
  7. Set featured image in "Featured Image" metabox in the right column
  8. Paste the code you copied into the contents of the page.
  9. Press Publish and page will be saved

Now your contact form setup is complete. Visitors to your site can now find the form and start submitting messages to you.

Contact Us Page

To set up the contact page with a contact form, follow these steps:

  1. Go to "Appearance › Install Plugins"
  2. Install and activate plugins Empic Plugin and Kirki, if not installed yet
  3. Go to "Appearance › Customize › Empic Plugin options › Social"
  4. Setup your links and buttons

Features

Customization

One of the great new features from WordPress 3.4+ is the Theme Customizer which allows you to modify options for a theme and instantly preview them on the site.

  1. Go to "Appearance  ›  Customize" and Theme Customizer will appear
  2. Select desired section
  3. Make your changes which then you can see in live preview on the right
  4. Press Publish and settings will be saved

More about Theme Customizer - https://codex.wordpress.org/Theme_Customization_API

Plugins

Below you can find a list of the recommended plugins with the theme, which are well tested with the theme. Recommended plugins you can easily install with plugin installer in Appearance › Install Plugins.

Free Plugins
  • Empic Plugin
    This plugin provides a simple image map.

    Empic Plugin provides a some features for WooCommerce. Therefore it is necessary if you use WooCoomerce.


    How to install and use Empic Plugin

    • Go to "Appearance › Install Plugins"
    • Install and activate Empic Plugin plugin.


    How to add new Image Point

    • Go to "Image Points › Add Image Point"
    • Fill in the "Title" of the page (for example: "By The Look")
    • Add image you want to create map for it
    • Click on image to add image point
    • Public post and copy shortcode
    • Now you can put it anywhere (Posts, Pages, Text Widgets...)


    How to add Image Point to the single product

    • Go to product Image Point tab
    • Select image point from the list and save product
  • WooCommerce
    A fully customizable, open source eCommerce platform built for WordPress.


    How to install WooCommerce and setup the default shop pages

    • Go to "Appearance › Install Plugins"
    • Install and activate WooCommerce plugin.
    • Once WooCommerce is activated you will see this notice:
    • Click on Run the Setup Wizard button to begin the WooCommerce install. That will start the setup wizard, where you can set things like shop pages, store locale, shipping & tax and payments.
    • If you want to change some settings, you can change them in WooCommerce » Settings. There are many tabs at the top, you can configure to fit your needs.
  • One Click Demo Import
    Import your demo content, widgets and theme settings with one click.


    How to install and use One Click Demo Import plugin

  • Contact Form 7
    Just another contact form plugin for WordPress. Simple but flexible.


    How to install and use Contact Form 7 plugin

  • YITH WooCommerce Wishlist Plugin
    Wishlist functionality for your WooCommerce store.


    How to install YITH WooCommerce Wishlist and default settings

    • Go to "Appearance › Install Plugins"
    • Install and activate YITH WooCommerce Wishlist plugin.
  • Perfect WooCommerce Brands
    With this extension you can add product brands to your WooCommerce site.


    How to install Perfect WooCommerce Brands

    • Go to "Appearance › Install Plugins"
    • Install and activate Perfect WooCommerce Brands plugin.
  • WooCommerce Variation Swatches
    WooCommerce Product Variation Swatches


    How to install WooCommerce Variation Swatches and default settings

    • Go to "Appearance › Install Plugins"
    • Install and activate WooCommerce Variation Swatches plugin.


    Even this plugin has been installed and activated on your site, variable products will still show dropdowns if you’ve not configured product attributes.

    1. Log in to your WordPress dashboard, navigate to the Products menu and click Attributes.
    2. Click to attribute name to edit an exists attribute or in the Add New Attribute form you will see the default Type selector.
    3. Click to that Type selector to change attribute’s type. Besides default options Select and Text, there are more 3 options Color, Image, Button/Label to choose.
    4. Select the suitable type for your attribute and click Save Change/Add attribute
    5. Go back to manage attributes screen. Click the cog icon on the right side of attribute to start editing terms.
    6. Start adding new terms or editing exists terms. There is will be a new option at the end of form that let you choose the color, upload image or choose as a button for those terms.

  • Email Subscribers & Newsletters
    Email Subscribers is a complete newsletter plugin which lets you collect leads, send automated new blog post notification emails, create & send newsletters and also manage them all in one single place.


    How to install Email Subscribers & Newsletters

    • Go to "Appearance › Install Plugins"
    • Install and activate Email Subscribers & Newsletters plugin.
  • WP Smush.it
    Reduce image file sizes and improve performance using the Smush.it API within WordPress.
  • Loco Translate
    Loco Translate provides in-browser editing of WordPress translation files.
  • Regenerate Thumbnails
    Allows you to regenerate your thumbnails after changing the thumbnail sizes.
  • Kirki Toolkit
    The ultimate WordPress Customizer Toolkit

Settings

Translations

Translations of the theme

To manage translation files, you can use the Loco Translate plugin or follow the steps below.

Main language file "empic.pot" is located in a "languages" folder in the main theme folder. To translate the theme, follow these basic steps:

Set the language through the WordPress admin:
  1. In WordPress admin navigate to Settings  ›  General
  2. Choose you language in Site language field

Now will be the theme translated to your language.

Customizer Screenshots

Home Page Widgets Screenshot