Elektron WordPress Documentation

Add Header To Page

There are two ways which you can use to add header style to page:

• 1 - If you want to add a header style to all pages of your website: Please go to Theme Options > Header > Header Layout > Select a header style layout from all header styles. After that, navigate to Theme Options > Header > Header Customize that you selected to configure the elements of Header. This header style will be displayed on all pages.

• 2- If you want to add a header style to a separate page on your website: Please go to your page > Open page > Scroll down you will see Page Options > Page Header > Header On/Off?: On >Set Header for Page: ON > Header Layout > Select a header style layout from all header styles

Header Styles

Elektron supports 4 header style layouts. Follow these images below learn more about them:

• Header 1 Options:

• Header 2 Options:

• Header 3 Options:

• Header Sidebar:

Header Style of Each Homepage

In this section, we will guide you how to build Header Style for each Homepage of Elektron. Follow these steps below learn more for details:

Minimal Home

• Step 1: Navigate to Page > Create a new page > Scroll dow you will see Page Options > Page Header > Choose page header style as this image:

• Step 2: Go to Theme Option > Header > Header 2 options > Setup their configure.

  Setup Customize left: Enable Seach Box

  

  Setup Customize Right: Enbale Wishlist and Shopping Cart

  

Collection Home

• Step 1: Navigate to Page > Create a new page > Scroll dow you will see Page Options > Page Header > Choose page header style as this image:

• Step 2: Go to Theme Option > Header > Header 3 options > Setup their configure.

  Setup Customize Navigation: Enable Search Button and Shopping Cart

  

Portfolio Home

• Step 1: Navigate to Page > Create a new page > Scroll dow you will see Page Options > Page Header > Choose page header style as this image:

• Step 2: Go to Theme Option > Header > Header sidebar > Setup their configure.

  Setup Customize Navigation: Enable Social Profile

  

Follow this video tutorial learn more about how to configure Header Style layout of Elektron

Menu Location

Elektron supports 4 menu location:

• Primary Menu: This is main navigation located in the header.
• Split Left: This is main navigation located in the left header.
• Split Right: This is main navigation located in the right header.
• Mobile Menu: This is main navigation displayed on mobile device.

Create A New Menu

This theme has built-in multi-column menu system.  Menus are created by using the core WordPress menu manager. Follow the guide below to learn how to create a new menu on Bestruct theme.

• Step 1: Navigate to Appearance > Menus from Admin panel.
• Step 2: Click the Create A New Menu link to make a new menu. Enter the name, then click Create Menu button.
• Step 3: To add menu item, select pages and posts on the left-hand side and click Add to Menu button. You also can add custom links or post categories into the menu.
• Step 4: To create a dropdown menu, simply drag a menu item below of another menu item and slide to the right, and it will lock into place and create a dropdown section.

• Step 6: After your menu is set up, scroll down to the bottom of the page to assign the menu on the Theme Location box.

• Step 7: Once it’s all are done, make sure you click the Save Menu button.

Megamenu

Elektron supports creating Megamenu for your website. Megamenu contains 2 sub-menu styles: Column and Tab. To easily enable megamenu, you only open Menu Item level 0 > Check Enable megamenu to activate mengamenu.

Column Style

Column Style is a multi-column style menu to display menu items (such as shop, Portfolio).

• Column Style requires your menu which must have Level 0, Level 1 and Level 2 menu item.
 

 
• Click a Level 0 menu item and select Megamenu style: Column and select Megamenu columns for your website.
 

 
• In addition, you can select Background Image for your menu or check Sub menu fullwidth to turn on sub menu fullwidth. Check Hide Mega menu heading to hide megamenu heading

Tab Style

Tab Style allows adding many different content types on your menu.

• On Tab Style, menu only has 2 levels (Level 0, Level 1). On menu level 0, select Megamenu style: Tab and select Megamenu Columns for your menu.
 

 
• On menu level 1, you need to select Mega Menu widget area (Mega Menu widget area will be defined on Appearance > Widgets). In addition, remember to select Tab Columns from drop down list columns.
 

 
• In addition, you can select Background Image for your menu, check on Hide Mega menu heading to hide megamenu heading

Bestruct supports 3 sidebar positions to add widgets of Mega Menu: Tabs menu. That includes Mega Menu Tab 1, Mega Menu Tab 2 and Mega Menu Tab 3.

Follow these steps to add widget to each sidebar positions:

• Mega Menu Tab 1: Navigate toAppearance > Widgets > Drag and Drop Post Thumbnail widget from left sidebar to Mega Menu Tab 1 sidebar. Remeber to select Categories for each widget

• Mega Menu Tab 2: Navigate to Appearance > Widgets > Drag and Drop Class Yoga Menu widget from left sidebar to Mega Menu Tab 2 sidebar. Remeber to select Categories for each widget

• Mega Menu Tab 3: Navigate to Appearance > Widgets > Drag and Drop Upcomming Events Feature widget from left sidebar to Mega Menu Tab 3 sidebar. Remeber to select Categories for each widget

Create New Page

• Step 1:From Admin Panel, navigate to Pages > Add New to create a new page.
• Step 2: Enter the title, slug and content for your page.You can choose to add your content using Visual Composer shortcode or Text editor.
• Step 3: After your content is added successfully, scroll down your mouse, you will see Page Options. You can configure each tab on Page Options making your page nicer and more eye-catching.
• Step 4: All are done, click Publish to save your configuration.

Page Options

We have created some specific Elektron page settings which will help you to build splendid pages for your website. Follow the list of options below to see how they work:

Page Layout

• Layout Style: Choose layout style for your page including Default, Boxed, Wide and Float. If choose Default, your page will get the configuration on Theme Options.
• Page Layout: Choose page layout (this section doesn't include header) including Default, Full Width, Container and Container Fluid.
• Page background color: Set background color for your page from color table.
• Page Sidebar: Choose sidebar position for page.
• Left Sidebar:Choose left sidebar for page. This option will appear if you select Page Sidebar: Left Sidebar or Page Sidebar: Left & Right Sidebar.
• Right Sidebar: Choose right sidebar for page. This option will appear if you select Page Sidebar: Right Sidebar or Page Sidebar: Left & Right Sidebar.
• Sidebar Width: Choose the width of sidebar.
• Page Class Extra: Enter page class here.

Page Top Bar

• Show/Hide Top Bar: Turn On/Off top bar for you page. If choose Default, the configuration of top bar will be inherited on Theme Options.
• Top bar layout width: Choose the width for your top bar including Default, Container and Full width. If choose Default, the configuration of top bar layout width will be inherited on Theme Options.
• Top Bar Layout: Choose top bar layout for your page.

Top Bar Scheme

• Customize Top Bar Color?: On/Off Customize Top Bar color.
• Top bar text color: Select color for top bar text.
• Top bar background color: Select color for top bar background.

Page Header

• Header On/Off? : Switch header ON or OFF?
• Set Header for Page : On/Off Set Header for Page
• Header Layout : Select the Header layout

Logo

• Custom Logo: Upload your custom logo on header of your page.
• Sticky Logo: Upload an image for sticky logo.
• Customize Logo Position: On/Off the custom Logo position.
• Logo padding top(bottom, right, left):Logo padding top(bottom, right, left). Insert number only (empty to set default value).

Menu

Menu section will help you to choose separated menu for page. You can select Page Menu and Page menu mobile.

Page Title

On this section, you can customize your page title with many options such as turn on/off page title, select color for page title or sub title from table color.

Page Footer

Page Footer allows you to select footer to override footer selected on Theme Options

Create New Post

• Step 1: In your Admin Panel, go to Post and navigate to Add New.
• Step 2: Enter your title and choose Post Format from Format box on the right side which shows different post format options: Standard, Image, Gallery and Video.
• Step 3: Add your post content in editing field. You can use our shortcodes to build your content where needed. .
• Step 4: Add Categories for the post from the Categories box on the right side. You can add new category or choose from existing categories. Check the box to select Categories for your post. Add relevant Tags for your post in the Tags box, set Featured image on the right side and other settings from the sections below Editing field. If you need more detailed guides about post settings in WordPress, please find in WordPress Codex.
• Step 5: After your content is added, scroll down your mouse, you will see Page Options section allowing you to have more configurations for your post.
• Step 6: All are done, click Publish to publish your post.

Post Format

Bestruct supports 7 post formats. Follow these steps below to see the description of Post Formats and Global setting of Post.

• Standard Settings: This is the standard post, on this post format, you can choose Featured Image and set the content for it.
• Gallery Settings: When selecting Gallery Format, you will have Gallery Setting meta-box to add as many images as you want to your gallery and manage your preview content as Featured Image, First Image on Gallery or Image Slideshow.
• Image Settings: When you selecting Image Format for you post, you will have Image Settings a meta-box to choose a main image of the post. Set Feature Image as the main image for preview content or Choose Your Image if you want to set another image as the main image for preview content.
• Video Settings: When selecting Video Format, you will have Video Setting meta-box where you can add video URL, and embedded video code, aspect ratio, and preview content as Featured Image, Video or Featured Image as Video Thumbnail.
• Audio Settings: When selecting Audio Format, you will have Audio Setting meta-box where you can add embedded audio code, aspect ratio and preview content as Featured Image, Video or Featured Image as Video Thumbnail.
• Quote Settings: When selecting Quote Format, you will have Quote Setting meta-box where you can add the quote and citation and manage your preview content as Featured Image.
• Link Settings: When selecting Link Format, you will have Link Setting meta-box where you can add the URL, Text and manage your preview content as Featured Image.

Page Options

Like Page Options section of Page, you absolutely configure more options on Page Options of Post. To learn more about descriptions of each option, please visit Page section.

ELEKTRON CUSTOM POST TYPE

Team members

• Step 1: From Admin Panel, navigate to Team Member > Add New
• Step 2: In the right side, select Team Categories and Featured Image for team member.
• Step 3: Fill out all information of Team Member Information, Social Profiles, Specialty and Certificates for your Team Member.
• Step 4: All done, click “Publish” to save the configuration.

Team Member Settings

• Team Member Information: Enter all information of Team Member as Image, name, position, phone, email and experience.
• Social Profiles:Enter your link social here. Leave blank if you don’t show Social for your Team Member.
• Specialty:Enter the description for your Team member specialty.
• Certificates:Enter the description for your Team member certificates.

Testimonials

Create New Testimonial

• Step 1: From Admin Panel, navigate to Testimonials > Add New
• Step 2: Enter testimonial title and description.
• Step 3: Select testimonial categories and add Featured Image on the right side.
• Step 4: Scroll down, you will see Testimonial Information section. Enter testimonial information here.
• Step 5: All are done, click Publish to save your configuration.

Testimonial Settings

• Email Enter testimonial email
• Position: Enter testimonial position.
• URL:Enter testimonial URL here.
• Special: Enter testimonial special here.
• Rating: Choose rating for testimonial.
• Rating: Choose rating for testimonial.
• Background Image: Choose background image for testimonial.

Portfolio

Create New Portfolio

• Step 1: From Admin Panel, navigate to Portfolio > Add New
• Step 2: Enter portfolio title and description.
• Step 3: Select Media Type, Portfolio Categories, Portfolio Tags and Featured Image on the right side.
• Step 4: Scroll down, you will see Excerpt and Custom Field section. Enter excerpt and custom field here.
• Step 5: All are done, click Publish to save your configuration.

Portfolio Page

To set up a page as Portfolio page on our demo website to show all portfolios such as 2 columns, 3 columns, you can create a new page. Then, use Yolo Portfolio shortcode and configure option in this shortcode. This shortcode will help you to create Product list page.

Footer Blocks

Footer Blocks custom post type will help you create particular footer style by using Visual Composer shortcode. You can install our sample data learn more about this.

Create New Footer Blocks

• Step 1:From Admin Panel, navigate to Elektron > Footer Blocks > Add New
• Step 2:Adding the content by using Visual Composer shortcode.
• Step 3:All done, click Publish to save your configuration.

When WooCommerce plugin is installed in your WordPress website successfully, you are able to create online shop or product list page. Below is the guide to create Product or shop page using WooCommerce.

Create New Product

To create a new product, please follow these steps:

• Step 1: Navigate to Products in your WordPress admin sidebar.
• Step 2: Click Add New to make a new product. Create a title, and insert your product content in the editing field. You can use any of our shortcode builder elements inside the product.
• Step 3: Add Categories from the right side. To assign it to the product, check the box next to the category name.
• Step 4: Add Tags from the right side. Type the name of the tag in the field
• Step 5: Select featured image for product by hitting button “Set featured images”. You can then select product images to add into Product Gallery
• Step 6: Scroll down your mouse, you will see Product Data option. Remember to choose Product Data: Simple product.
• Step 7: Once you have finished, click “Publish” to save your product.

Shop Page

To set up a page as Shop page to show all products, create a new page. From admin panel, navigate to Woo Commerce > Settings

In Products tab, navigate to Display sub-tab on the top, here you can find your page from dropdown list to set as Shop page.

Product List Page

To set up a page as Product List page to show all products such as product list 2 columns, 3 columns, you can create a new page. Then, use Yolo Product shortcode and configure options on this shortcode. This shortcode will help you to create Product list page.

Instead of writing lines of code to build elements, we built Elektron with number of premade shortcodes that enable you to create many elements you see in our demo in fingertips.

By installing Visual Composer (the page builder plugin is integrated in the theme package), you will have the Visual Backend Editor where every shortcodes are displayed visually and easily generated with several clicks.

In addition to Default Visual Composer shortcodes, Elektron comes with 20 specific shortcodes. To generate these shortcodes, go to Backend Editor, click the “+” icon to add shortcode.

Navigate to Elektron Shortcodes to find a shortcode you want to use. You can add those shortcodes to any pages or posts for your own use.

Below are a list of 20 shortcodes and their artributes:

Yolo Blog

Use this shorcode will help you to build a blog paga such as Blog List, Blog Grid on our demo.

Detailed option:

• Layout Style: Select layout style from drop down list styles for blog page including: List(larger Image), List(Medium Image), Grid, Masonry.
• Narrow Category: - Select categories of post items displayed on blog page.
• Total items: Enter number of post which will be displayed on blog page.
• Display Type: Select display type from dropdown list types .
• Items per page :Number of items to show per page.
• Navigation Alignment:Select the position: Center, Left or Right.
• Extra class name: Enter class name if you want to customize this shortcode.
• Order By:- select - You can arrange your posts following to different order criteria.
• Sort Order:- select - Arrange your posts in ascending or descending order regarding to order criteria you set above.
• CSS Animation:- select - Select types of animation if you want to be animated when it enters into the browsers viewport.

Yolo Portfolio

Yolo Portfolio shortcode will help you to build Portfolio page.

• Thumbnail type: Select type of thumbnail from drop down list.
• Portfolio Title: Select portfolio title style from drop down list to display portfolio title.
• Overlay Style: Select overlay style for portfolio.
• Overlay Effect: Select overlay effect for portfolio
• Hover Dir Effect: Turn On/Off hover effect for portfolio.
• Columns: Select columns to display portfolio item on portfolio page.
• Source: Choose portfolio source including Portfolio Category or Portfolio Item.
• Show Filter: Choose portfolio filter.
• Filter By: Choose filter by tags,categoy for portfolio.
• Show Paging: Choose paging.
• Number of item:The number of portfolio items will be displayed on portfolio page.
• Order Post Date By: Choose ordering.
• Padding: Select padding from drop down list.
• Extra class name: Enter class name if you want to customize this shortcode.
• CSS Animation:Select types of animation if you want to be animated when it enters into the browsers viewport.

Yolo Testimonial

Use this shortcode to build testimonial on front page.

Detail option:

• Layout Style: -select- Select layout style for testimonial including Style 1, Style 2, Style 3
• Source: - select - Choose source from testimonial categories or testimonial IDs.
• Order Post Date By: - select - Choose the sorting order including Descending or Ascending.
• Excerpt Length: - number - Enter excerpt length.
• Auto Play: - Yes/No - Turn On/Off auto play testimonial.
• Slide Durations: - number - Enter slide durations.
• Extra class name: - string - Enter class name to customize this shortcode.
• CSS Animation: - Yes/No - Select types of animation if you want this element to be animated when it enters into the browsers viewport.

Yolo Recent News

Use this shortcode to display recent posts on your page.

Detailed option:

• Choose Layout: - select - Select layout style for Yolo Recent News shortcode including: Recent New 1, Revent New 2, Recent New 3

Minimal Home - Recent New 1



Classic-Recent New 2


• Featured Image Size :- Select the type image size
• Select Categories: - select - Select categories to display posts on your page.
• Number of Columns: - select - The column attribute controlling the width of columns should be displayed.
• AutoPlay: - select - Turn On/Off auto play.
• Slide Durations: - number - Enter slide durations.
• Posts Per Page: - number - Choose the number of posts that will be displayed per page.
• Extra class name: - string - Enter extra class to customize this shortcode.
• CSS Animation: - select - Select types of animation if you want this element to be animated.

Yolo Countdown

• Choose layout: - select - Select style layout for countdown shortcode.

Use this shortcode to display countdown on Classic Home - Number style.



Circle


• Extra Class name: - string - Enter class name to customize this shortcode.

Yolo Banner

Use this shortcode to display banner on front page.

Detail option:

• Layout Style: - select - Select layout style for banner shortcode. There are 9 layout styles you can choose.
• Title :- Enter the Title.
• Link: - select - URL is redirected when visitors click the banner.
• Banner's Images: - select - Select banner's image for banner shortcode.
• Extra Class Name: - string - Enter extra class to customize this shortcode.
• CSS Animation: - select - Select types of animation for this shortcode.

Yolo Icon Box

This shortcode will help you to show icon box on front page.

Detailed option:

• Layout Style - select - Select layout style for Yolo Icon Box from drop down list.
• Icon Library: - select - Choose icon library from Font Awesome, Open Iconic, Typicons, Entypo, Linecons and custom image
• Icon: - select - Choose the icon from drop down list icons.
• Title: - string - Enter title here.
• Link: - URL - Choose URL when visitors click icon.
• Description: - string - Enter description here.
• Extra Class Name: - string - Enter extra class to customize this shortcode.
• CSS Animation: - select - Select type of animation if you want this element to be animated when it enters into the browsers viewport.

Yolo Team Member

Use this shortcode to display Team Member on front page.

Detailed option:

• Source: - choose - Choose from category or From member IDs.
• Select Teammember: - select - Select members that will display.
• Layout Style - select- Select layout style for Team Member include Style 1, Style 2.
• Choose Style: - choose - Choose the Slider or the Grid style.
• Members per slide: - number - Choose the number of Members that will be displayed per page.
• Order Post Date By:- choose- Choose order post date by Descending or Ascending
• AutoPlay: - choose- Turn On/Off auto play..
• Slide Duration(ms):-number- Enter slide durations.
• Extra class name: - string - Enter extra class to customize this shortcode.
• CSS Animation: - select - Select types of animation if you want this element to be animated.

Yolo Google Maps

Use this shortcode to display google maps on front page.

Detailed option:

• Choose style layout: - select - Select style layout for map.
• Choose style map: - select - Select map style for map.
• Infor window title: - string - Enter the information in this option.
• Map height: - number - Enter the height of map.
• Latitude: - number - Get latitude from here: https://www.google.com/maps
• Longitude: -number- Get longtitude from here: https://www.google.com/maps
• Zoom: - number - Enter zoom here..
• Image to replace marker: - image - Select the image to replace the original map marker (optional)..
• Extra class name: - select - Select font family.
• CSS Animation: - select - Select types of animation if you want this element to be animated when it enters into the browsers viewport.

Yolo Widget

Use this shortcode that get your widget

Detailed option:

• Sidebar: - select - Select widget area to display.
• Extra class name: - select - Select font family.
• CSS Animation: - select - Select type of animation if you want this element to be animated when it enters into the browsers viewport.

Yolo Counter

Use this shortcode to show counter on your page.

• Style: Select style for display statistical.
• Title: - string - Enter text for counter title.
• Number: - number - Enter number of statistical. Example 1466.
• Extra Class name: - string - Enter the class name to custom this shortcode.

Yolo Icon Footer

Use this shortcode displays on your site.

Detailed option:

• Choose layout: - select - Select layout style for shortcode including Style 1, Style 2, Style 3 and Style 4.
• Icon color: - select - Select color for icon.
• Border Icon: - On/Off The borer.
• Icon size: - number - Enter icon size ( Example:18px).
• Title color: - select - Select color for the title.
• Icon Footer: - create - Please create Icons that will display on your site.
• Extra class name: - string - Enter the class name to custom this shortcode.

Yolo Recent News Footer

Use this shortcode to show recent product on front-page.

• Choose layout: - choose- Choose layout Footer V1 or Footer V2.
• Background layout: - choose- Choose background layout for this shortcode including White or Dark.
• Select Category: - select - Select categories that will display on your site.
• Show Author(Date, Comment, Excerpt): - On/Off - Tick the box some informations that will show/hide them on the post.
• Posts per page: - number - Choose the number of posts that will be displayed per page..
• Extra Class Name: - string - Enter class name if you want to custom this shortcode.

Yolo Video Player

Detailed option:

• Style: - select - Select the style for shortcode including Style 1, Style 2 and Style 3.
• Heading: - text - Enter text for heading line.
• Heading Color: - select - Select the color forthe heading.
• Subheading: - text - Enter text for subheading line.
• Icon Color :- Select color video icon
• Video URL :-Enter Video or Youtube link. Example https://vimeo.com/15801179 or https://www.youtube.com/watch?v=n3MMERy4nWY
• Height : -Enter video height(px). Example: 700
• Width : - Display video fullscreen or fit-screen
• Background image : -Select image from media library.
• Subheading Color: - select- Select color for subheading
• Extra Class Name: - string - Enter class name if you want to custom this shortcode.

Yolo Product Gallery

Detailed option:

• Layout Style : -Select the layout style.
• Title : - Enter the title.
• Sub Title : - Enter the sub title.
• Description :- Enter the description.
• Images And Icon Hover :- Enter values for Images and Icon hover - position, name and price....
• Extra class name :- Enter class name if you want to custom this shortcode.

Yolo Instagram

Detailed option:

• Instagram Username :- Enter your instagram
• Layout Style :- Select layout style including: Grid, List.
• Image Size :- Setup image size.
• Total Images Display :- Enter Total images that will display.
• Number of Column Images :- Setup the column image.
• Check for new images on every (hours) : - Setup the number that Check for new images on every (hours)

Yolo History Slider

Detailed option:

• Layout Style : - Select the layout style including: Style 1, Style 2
• AutoPlay : - On/Off Autoplay
• Slide Duration (ms) :- Enter Slide Duration (ms)
• Images And Icon Hover : Enter values for Images and Icon hover - position, name and price...
• Extra class name :- Enter class name if you want to custom this shortcode.

Yolo Pricing

Detailed option:

• Style : - Select the style including: Style 1, Style 2
• Show Recommend : - On/Off Recommend
• Title :- Enter text used as title of plan (or pricing).
• Price : Enter values for pricing - price
• Sub Title : Enter sub title text used as title of plan (or pricing).
• Values: Enter values for pricing - price, title and etc...
• Button: Text on the button.
• Button link: Enter URL if you want this button to have a link.
• Extra class name :- Enter class name if you want to custom this shortcode.

Elektron allows you to create an unlimited number of sidebars. Each page or post can come with an unique sidebar. It is really easy to choose a sidebar for page/ post, you can go to Page Options section > Page Layout > Left Sidebar/ Right Sidebar to select a Sidebar from dropdown list on sidebar. You may need to create some separate sidebars to use for different pages and posts. Follow these steps to generate a sidebar and add widgets to it.

Create A Sidebar

Follow these steps to create a sidebar

Add Widgets to Sidebar

You can add any widgets and any number of widgets to your sidebar. All widgets are accessible from Appearance> Widgets and easily dragged and dropped to your sidebar.

• Step 1: Navigate to Appearance > Widgets to get access to the list of widgets and widget section that they can be added. All widgets you can use will be displayed in the left hand side. All different sections you can add widgets to will be displayed in the right hand side.
• Step 2: Simply drag and drop the widget you want into the widget sections in the right hand side.
• Step 3: Do not forget to click save changes after you customize any widgets in sidebar.

Yolo Widgets

Besides default widgets of WordPress, Elektron created a lot of widgets which will help you to easily customize your page. Follow these descriptions to learn more about each widget.

Instagram

Use this widget to display instagram on Footer position.

Upcoming Events

Use this widget to display events on Single Event sidebar.

Class Yoga Widget

Use this widget to display classes on Class List sidebar..

Create Newsletter Form

Please make sure that you have installed Contact Form 7 before, then follow these steps to create newsletter page.

• Step 1: Go to Contact > Add New to create a contact form with fields having these names:

Here is an example of Newsletter Form:

<div class="newsletter-4">[email* your-email placeholder "Your email address... "]<div class="ctf7_submit"> [submit "Sign up"]</div></div>
• Step 2: Go to Pages > Add New > Add Contact Form shortcode to your page > Select contact form option. You can choose previously created contact form from the drop down list.

• Step 3: Publish page and you will have the Newsletter form as below:

Newsletter Form Style

Elektron supports 4 Newsletter Form Styles for your website. With each Newsletter Form Style, we declare a class. Each class has separate CSS style, you can easily to use one of classes to your website.

Follow lists below learn more about Newsletter Form Styles:

• News letter 1

Form:

<div class="newsletter-1">[email* your-email placeholder "Type your email... "]<div class="ctf7_submit"> [submit "sign up"]</div></div>
• News letter 2.

Form:

<div class="newsletter-2">[email* your-email placeholder "Type your Email here... "]<div class="ctf7_submit"> [submit ""]</div></div>
• News letter 3

Form:

<div class="newsletter-3">[email* your-email placeholder "Subcribie our newsletter... "]<div class="ctf7_submit"> [submit "Submit"]</</div></div>
• News letter 4

Form:

<div class="newsletter-4">[email* your-email placeholder "Your email address... "]<div class="ctf7_submit"> [submit "Sign up"]</div></div>

FOOTER

How to add a footer block to page

Please follow these steps to how to add a footer block to page

• Step 1: From Admin Panel, navigate to Footer Blocks > Add New to create a new footer block.
• Step 2: Add content to footer block. You can use shortcodes of Visual Composer to add your content as you want.
• Step 3: Click Publish to save configuration.
• Step 4: Assign Footer Block to page.
  There are 2 ways which you can use to assign a footer block to your page:
  • 1 - If you want all pages of your website will be received a footer block only: Please go to Theme Options > Footer> Select Footer Block > Choose a footer block from drop down list.
  
  • 2 - If you want each page of your website will be received a different footer block: Please open your page > Scroll down you will see Page Option section > Page Footer > Select Footer > Choose a footer block from drop down list. If you choose Default style, footer will be overridden on Theme Option.
  

Edit Footer Block

If you have imported our sample demo data, a lot of Footer blocks are available, you can go to Footer Blocks to see all Footer Blocks or edit them.

In addition, we used Visual Composer shortcodes to build Footer Blocks. To turn on Visual Composer shortcodes on Footer Blocks, navigate to Visual Composer > Role Manager > Posts type : Custom > Check yolo_footer checkbox.

Elektron is a WMPL – compatible and multi- language ready theme. To translate this theme, follow these steps below

• Step 1: Download and install PoEdittool.
• Step 2: Open PoEdit and open the .po file of your preferred language in PoEdit and search your line you want to change. To do this, select the Edit button > Find option.
• Step 3: In the Search Window, type the text string you are looking for. Once it is selected, replace the text in the Translation text area in the lower part of the window with your preferred translation.
• Step 4: If you’d like to edit another text string, just repeat Steps 1 to 2.
• Step 5: Click “Save” to save configuration. The .mofile will be auto created.
• Step 6: Finally, you need to rename of .mo file with Code Name of your language. Please see the language code list HERE

For example de_DE.mo for German – Deutsche

• Step 7: Navigate to Settings > General > Site Language to select your language.

When you come to this section, we hope that you found all the information provided in this documentation helpful and you have finished installing and polishing your site as what you have imagined of. After reading carefully this guide, if you still need any helps, don’t hesitate to contact us at Yolo Support Center. You will be asked to create an account if you are new to us and enter purchase code to post a topic for support. To get your purchase code, please login to your ThemeForest account, navigate to “Downloads”, click the “Download” button on the left side of our theme, choose “License Certificate” to download the license file where you can find the purchase code.

Please be noted to post a topic with your issues be clearly clarified. It is recommended you send us together with link of your site and your admin account. These will help to save time for both of us. Finally, please be patient. It will take us some time to check all the topics and we will solve topics from older to newest.

Hopefully, you will enjoy using Bestruct! Thank you for choosing our theme.