Import demo content & Setup

After installing Electro theme and Electro Child theme, you can setup the theme with demo content. Once completed, your website will look exactly like this website : Electro Demo Website

Demo Content

The demo content is provided from Electro Demo Website. The dummy data file for the demo content is available inside dummy-data folder within the unzipped download package. You can either use dummy-data.xml or dummy-data.tar.gz, both of which are valid demo content files.

Importing demo content

  • Please navigate to Tools > Import inside the WP admin dashboard.
  • At the bottom of  table, there is WordPress Importer. Please click on Install Now, if WordPress Importer is not already installed or Run Importer if it has already been installed.
  • In the Import WordPress page, click on the file upload button and upload dummy-data.xml file or dummy-data.tar.gz and click on Upload file and import
  • In the next page, you will be asked to Assign authors. You can create a new user or assign all the newly about to be imported posts to an existing user.
  • In the Import Attachments section please check the Download and import file attachments option. This options means that you are asking WordPress to download all images and other media files from the demo.
  • Click on Submit

Importing Home page sliders

Sliders are not imported with WordPress Importer. The sliders are available inside the dummy-data folder within the download package. They need to be imported separately.

  • Please navigate to Slider Revolution in your WordPress admin menu.
  • In the Slider Revolution page, click on Import Slider icon.
  • In the modal box that pops up, click on the upload file select button and choose home-v1-slider.zip file to import the slider for Home v1.
  • Please check Append option for Custom Animations and Custom Navigations settings.
  • Click on Import Slider.
  • Repeat the above steps to import home-v2-slider.zip, home-v2-boxed-slider.zip and home-v3-slider.zip sliders.

Importing Widgets

On clicking Submit, the WordPress Importer will start by importing all the file attachments. If your web server has low PHP memory ( recommended 256M ) or lower PHP version ( recommend 7+) or low execution timeout ( 30s for fast bandwidth servers and 60s for slow bandwidth servers ), the WordPress Importer will throw fatal 500 Internal Server Error or 502 Gateway time out error. If you have good server settings, the importer will display All Done message. This means all the demo files and posts have been imported. Wordpress Importer on completing import would have imported all pages, comments, products, posts, static blocks and other custom post types.

Setup Pages

Visual Composer Setup

Visual Composer is a premium drag drop plugin that comes bundled with the theme. It provides 40+ elements that can be easily added to your page. In addition to extending functionalities of existing elements, Electro theme has added 12 additional elements. With this set of elements, you will be able to create unlimited varities of pages.

Pages and Static Content of Electro is built using Visual Composer. Before creating Static Blocks, make sure static_block is enabled in WPBakery Page Builder > Role manager.

Assign Home & Blog Page

Electro comes with 3 different types of Home Pages. By default the home pages are built using Page templates. However it is also possible to build the home pages entirely with King Composer or Visual Composer. Please follow the steps below to assign one of the 3 home pages as your website’s home page.

  • Navigate to Pages in your WordPress admin menu to make sure all pages have been imported.
  • Navigate to Settings > Reading.
  • For the Front page displays setting, choose A static page ( select below ) option.
  • For Front Page, choose any one of the 3 home pages that was imported.
  • For Posts Page, choose Blog page as your posts page.

Navigation

Assign Menus to Locations

Theme locations allow the definition of the placement of menu. Electro theme supports 8 menus and 8 theme locations. Assign each menu to a specific theme location. Navigate to Appearance > Menus > Manage Locations here choose correct menu location for every menu.

Menus and their Locations

  • Top Bar Left Location – Top Bar Left Menu
  • Top Bar Right Location – Top Bar Right Menu
  • Primary Nav Location – Main Menu
  • Navbar Primary Location – Navbar Primary Menu
  • Secondary Nav Location – Secondary Nav
  • Departments Menu Location – Vertical Menu
  • All Departments Menu Location – All Departments Menu
  • Blog Menu Location – Blog Menu

Add Icons to Menu items

  1. Navigate to Appearance > Menus.
  2. Click on the caret on the top-right of menu item that contains the megamenu subitem to expand it.
  3. In the Icon Class text box, enter the icon name as you wish.for ex: ec ec-map-pointer.
  4. Click on Save Menu.

Megamenu Setup

A megamenu item in Electro theme is a Static Block. This Static Block is available on activating Electro Extensions Plugin. Before creating Static Block make sure it is enable in King Composer > General Settings. After that follow the below steps.

  • Navigate to Static Content > Static Blocks > Pages Megamenu Item.
  • Our Complex Megamenu item will now have 4 columns of WP Custom Menu.
  • Click on edit and choose the menus for all the 4 columns.
    • Column 1 : Select Pages Menu #1 as Menu.
    • Column 2 : Select Pages Menu #2 as Menu.
    • Column 3 : Select Pages Menu #3 as Menu.
    • Column 4 : Select Pages Menu #4 as Menu.
  • Click on Save Changes

Setup WooCommerce

Assign WooCommerce Pages

WooCommerce Pages are Shop, Cart, Checkout, Terms & Conditions and My Account pages. These pages are imported through the import process. Now we need to assign them to let WooCommerce plugin know about them. To do that :

  • Shop : Navigate to WooCommerce > Settings > Products > Display > Shop Page and choose Shop page from the dropdown.

  • Cart, Checkout and Terms & Conditions : Navigate to WooCommerce > Settings > Checkout and choose Cart, Checkout and Terms & Conditions pages from the dropdown.

  • My Account : Navigate to WooCommerce > Settings > Account > My Account Page and choose My Account page from the dropdown

Setup Brand Attribute

Setting up attributes themselves uses an interface you will be familiar with. It’s recommended that you set up any Attribute you will be using over and over in this way. Navigate to Products > Attributes and you will be presented with the following screen:

null

Here you can quickly and easily add attributes. After adding, the attribute may display without ‘Attribute Name‘. Then edit the attribute to enter the ‘Attribute Name‘ and click ‘save‘ to update.

Here it is an example of adding Brand Attribute, likewise you can add Color and Size Attributes.

How to add/edit Brand Attributes

  • Add a Name.
  • Add a Slug; (optional); this is the URL-friendly version of the name.
  • Enable Archives if desired. If enabled, you can view a page with all products having this attribute. For example, if you have this enabled, and “galaxy” is one of the options under “brand”, you can add http://yourstore.com/brand/galaxy/ to your menu to only display galaxy brand items.
  • Choose the Type. There are two types of options available. If you want to have the same attribute values for your whole store, choose “Select.” On the individual product, you can then select attributes. If you choose “Text”, you can type new values to the attributes.
  • Select a Default sort order. Choose any one of the option: Name, Name (Numeric), Term ID or Custom ordering.

Adding Brands Logo

Once you create Brand Attribute, assign this attribute as a brand attribute in Electro > Shop > Brand Attribute.After that add logos to the attribute that you’ve chosen as brand.Once you’ve added your brand logos you can enable brands slider from Electro > Footer > Enable Brands Slider.

Setup Contact Page

Navigate to Pages > Contact-v1 here select the contact form under Contact Form 7 block to display the form in the Contact-v1 Page. Likewise follow the same method to display the form in Contact-v2 Page.

Setup Accessories

Apart from default WooCoommerce Tabs, we add an extra tab called Accessories which create for the benefit of the user to show more information about their products. Electro theme allows you to add accessories just like you add cross sells and up-sells.

You can only add Simple product to accessories. The reasoning is Variable product do not allow to be added in archive view and only allows to be added in single product view after selecting the options.

Alternatively you can create simple products from your variations. Like for ex. 16 GB Black iPhone can be a simple product instead of adding storage and colour as separate variations.

Not quite what you are looking for ? Get Help