Installation

Installation

Our theme is easy to install. First download the theme from ThemeForest. It will be packed as a zipped file. You can choose to either import this into your server or control panel, or you can choose to extract the contents of the zipped file and upload the ‘kallyas.zip’ file to WordPress. Both are completely explained below.
Please note that installation steps or options may differ on your server depending on the WordPress version that you use. The installation steps explained below have been tested on WordPress 4.1.

Back To Top

Installation overview

Here is a quick overview of the installation steps that you have to follow. Please follow these steps in order to minimize the probability of something going wrong:

  1. Install our theme
  2. Install the plugins recommended by the theme
  3. Install WooCommerce plugin if needed
  4. Install dummy data
  5. Import Revolution Slider slides

Back To Top

Installing by importing using ftp or a control panel

This method will work for any server that has either an FTP account set up or another method of copying files to server. For example, if you have SSH (Secure Shell) access, you can choose to use FTP, SFTP, SSL-FTP, or SCP (among other options) to transfer your files from your personal computer to your web server. If you are using a control panel, such as cPanel or DirectAdmin, you can use it to conveniently upload the file to server.

You must upload the kallyas.zip file (after extracting the content from the zipped file to your Desktop) into wp-content/themes location. Once you have done so, you will need to extract the contents of the zip file into wp-content/themes. Assuming you have done this correctly, a new directory will be made in this parent directory named kallyas. You can now delete the zip file if you think it necessary to save space.

Now, go to your WordPress administration panel (http://yoursite.com/wp-admin) and go to WordPress Menu > Appearance > Themes. You will need to be logged in as the administrator to see this menu. In default installations, the administrator username is “admin”. You may have modified this during the WordPress installation. If you do not know your administrator password, you may need to check your MySQL database or (in some cases) with your web hosting provider.

You should see Kallyas Theme in your non-active theme list. If you do not, you may have uploaded and extracted the contents of the zip file incorrectly. You will then need to go back and retake the steps.

kallyas install themes

To activate the theme, simply click Activate at the bottom of the theme description. Now the theme becomes active and you can start using our magnificent theme.

kallyas activate

Back To Top

Installing with wordpress administration panel

This method of installation may seem easier to most people. It can all be done from the WordPress administration panel, without manually uploading the file to your server. You must be logged in as the administrator to use this method. In default installations, the administrator username is “admin”. You may have modified this during the WordPress installation. If you do not know your administrator password, you may need to check your MySQL database or (in some cases) with your web hosting provider.

Go to WordPress Menu > Appearance > Themes and click on Add New button located on top of the screen.

add new

Click on Upload Theme button, located on top of the screen.

upload

You should now see a standard upload form. Use it to upload the kallyas.zip file that you extracted from the ThemeForest download package. Wait for the file to upload and then go back to WordPress Menu > Appearance > Themes. You should see Kallyas Theme in your non-active theme list. If you do not, the upload may not have worked successfully. Try refreshing or uploading again the file to solve the problem.

upload_theme

If all went well, you can now activate the theme by clicking Activate button located at the bottom of the theme description. Now the theme becomes active and you can start using our magnificent theme. kallyas activate

Back To Top

Installing recommended plugins

After installing our theme, you are required to install additional plugins: Revolution Slider and Cute slider. The plugins are already included in the theme so you can easily install them. Revolution Slider plugin is one of the most popular sliders on the web; it has unlimited effects and is fully customizable. You can use it to create sliders that you can incorporate later into your pages.

You are also presented with an option to install the Woocommerce Plugin. This is required if you intend to use the shop features of our theme. This plugin will be installed from the WordPress repository.

Go to WordPress Menu.  On top of the screen of any admin page you will find instructions for installing or updating the plugins.

Install plugins

If you do not see any notice at the top of the screen, then you can access the Install Plugins option at WordPress Menu > Addons.

addons

Here you will find a list of plugins and you will be presented with the options for installing the plugins or updating them in case there is an update available.

Please choose Install or Update as required by the plugin and then follow the on screen instructions.

Back To Top

Installing the dummy data on your server

After installing the theme, you can immediately start building your site. However, it would be a lot easier if you do not start working from scratch, but from our example pages. If you wish to use our example pages, you’ll have to install the dummy data that this theme provides.

WARNING! DO NOT INSTALL the dummy data on your live website. It may be possible that your current data get corrupted. We strongly recommend installing the dummy data on a clean WordPress install.

Installing the dummy data is extremely easy. After you install the theme and additional plugins, go to WordPress Menu > Kallyas Options > Advanced and press the Install dummy data button. Wait for the process to complete. Please be aware that it can take up to 5 minutes to install the dummy data.

Back To Top

Installing the child theme

This theme comes with a preinstalled child theme. Why use a child theme? If you modify our theme files and it is updated, your changes made to the theme files will be lost. With a child theme, you can update the parent theme (which might be important for security or functionality) and still keep your changes. Therefore, if you are a WordPress savvy and wish to modify stuff to our theme, please use the child theme to do so.

To install the child theme, repeat the steps you made with the main theme, but this time using the kallyas-child folder from the download package. It is important to leave this name unchanged. After installing the child theme, activate it instead of the main theme.

For further reference about the child themes, please read the WordPress documentation located at http://codex.wordpress.org/Child_Themes

Please note that some things may “disappear” after installing the child theme. For example, the main menu. There is nothing to be worry about this. In order to resolve this, just go to Appearance > Menus menu and re-asign your menus.

Back To Top

Updating the theme

Warning: Please make sure you backup your existing theme folder before updating. Additionally we recommend performing the update on a development site before making it on your live site.

We may periodically release new updates to this theme in order to add new features or fix bugs.

This theme comes with a built-in update system. You will be notified in the standard WordPress way of any theme update (In Dashboard > Updates). In order to do this, some info must be added in the theme’s optiosn panel. You can find more info about this in the Theme options documentation. Please follow the instructions to update the theme. We are careful to make the updates with backward compatibility and thus no content or options will be lost after performing a theme update.

Of course, you can perform a manual update of the theme if you wish so. Download the package from Themeforest and follow the steps from the installation. As an extra step, we recommend deleting the old theme files before placing the new ones.

Back To Top

PageBuilder

Introduction

Since version 4.0, Kallyas has been equiped with a brand new Visual Page Builder:

pb

Because the new Page Builder is completely different than the one used in the previous versions, it is not enabled by default when you create a new page or post:

np

which means that you will have to click the “Enable page builder” button  in order to be able to use it.

Once you have set the post to use the new Page Builder, you can go ahead and use it:

pt

Elements are grouped by category as you can see in the above screenshot, on the lower left hand side. For easiness we’ve added a search box you can use to search for an element:

s

 

You have also the possibility of turning off the Page Builder at any time, by clicking the “Disable page builder” button:

 

d

 

 

To add elements to the page, all you have to do is drag and drop them on the page as in example below:

scr-2-elem-drop

Back To Top

Section and Columns

The section element is a full width element that an be used as a container for column elements.

section

 

 

A Column element is added by default, and you can see it when you hover the section element:

sc

At this point you can configure the number of columns for the “Column” element. The default value is 12, which means full width.

 

Section options

As you can see in the image below, Sections are very configurable:

so

 

Column options

As sections, Columns are customizable too:

co

Back To Top

Templates

Templates are another new feature of the new Page Builder. You can use it to save a fully customized page as a template and use it as a template for other pages that share the same layout or elements.

t

Once you have set the template, every time you add a new page you can use this template and avoid recreating it from scratch to match the other page.

Back To Top

Save elements

Another feature of the new Page Builder is the possibility of saving elements altogether.  To save the element you need to click the “Save” icon as shown below:

ab2

 

ab1

 

 

Once you configured the element you can choose to save it so you can use it later on on other pages:

sb2

 

 

Back To Top

Elements options

Live Options

 

Most of the elements will have certain options that will feature a “live” icon:

live

 

The “Live” icon means that the element will react immediately to the change of that option.

Another common option that implements the “live” functionality is the style option, that can be used to dynamically set the style of an element:

live2

Back To Top

Column

Options

Option name Description
Column offset Here you can define an offset for this column
Control Size on Large screens Select a size for this column on large devices (Desktops)(>= 1200px). By default the md/sm column sizes are applied to large screens too, this option only forces another column width on large screens.
Size on small screens Select a size for this column on small devices (Tablets)(>= 768px)
Size on extra small screens Select a size for this column on extra small devices (Phones)(<768px)

Back To Top

3D Cute Slider

Create and display a 3D Cute Slider element

Options

Option nameDescription

Background Style Select the background style you want to use. Please note that styles can be created
from the unlimited headers options in the theme admin’s page.
Select slider Select the desired slider you want to use. Please note that the slider can be created
from inside the Cute Slider option.
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.
Bottom masks override The new masks are svg based, vectorial and color adapted.

Example

slider

Back To Top

Accordion

Create and display an Accordion element

Options

Option name Description
Title Enter a title for your Accordion element
Accordion Style Please select the style you want to use.
Accordions Here you can create your desired accordions.

Example

element

Back To Top

Action Box

Create and display an Action Box element

Options

Option name Description
ID: eluid8248b4ad In case you need some custom styling use as a css selector .eluid8248b4ad .
Element Style Please select the style you want to use.
Action Box Title Enter a title for your action box
Action Box Subtitle Enter a subtitle for the action box
Action Box Button Text Please enter a text that will appear inside your action box button.
Action Box link Please choose the link you want to use for your action box button.
Action Box Secondary Button Text Please enter a text that will appear inside your action box secondary button.
Action Box Secondary link Please choose the link you want to use for your action box secondary button.

Example

element

Back To Top

Big Social Blocks

Create and display a list of blocks containing social icons icons and links.

Options

Option name Description
Select style Select a style for the blocks
Background Type Select the background type.
Background Color Select the default background color of the blocks.
Elements color theme In case you have a dark backgound you might surely want a light themed color.
Icon Blocks Add Icon Block.

Example

element

Back To Top

Blog Archive

Create and display the current post content

Options

Option name Description
Blog columns Select the number of columns to use
Categories Select your desired categories for post items to be displayed.
Number of items per page Please choose the desired number of items that will be shown on a page

Example

element

Back To Top

Buttons

Create and display as many buttons as you want

Options

Option name Description
Element Alignment Please select the alignment of the buttons.
Button Add Button.

Example

element

Back To Top

Call Out Banner

Create and display a Call Out Banner element

Options

Option name Description
Style Please select the style you want to use.
Main Title Enter a title for your Call Out Banner element
Secondary Title Enter a secondary title for your Call Out Banner element
Button Text Please enter a text that will appear on the right button.
Button Hover Image Please select an image that will appear when hovering the mouse over the button. If no image is chosen the default OK image will be used
Button link Please choose the link you want to use for your button.

Example

element

Back To Top

Circle Title Text Box

Create and display a Circle Title Text Box element

Options

Option name Description
Style Please select the style you want to use.
Circle Text Title Please enter a SMALL word that will appear on the left circle beside the main title.
Main Title Please enter a main title for this box.
Content Please enter a content for this box.
Circle Background Color Select the background color for the circle.
Circle Text Color Select the text color for the circle.

Example

element

Back To Top

Circular Catalogue Carousel

Create and display a Circular Catalogue Carousel element

Options

Option name Description
Autoplay carousel? Does the carousel autoplay itself?
Timout duration The amount of milliseconds the carousel will pause
Slides Here you can create your Circular Content Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Circular Content Style 1

Create and display a Circular Content Style 1 element

Options

Option name Description
Slide height Please enter a height number in pixels ( for example : 450 )
Autoplay carousel? Does the carousel autoplay itself?
Timout duration The amount of milliseconds the carousel will pause
Slides Here you can create your Circular Content Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Circular Content Style 2

Create and display a Circular Content Style 2 element

Options

Option name Description
Autoplay carousel? Does the carousel autoplay itself?
Timout duration The amount of milliseconds the carousel will pause
Slides Here you can create your Circular Content Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Contact form

This element will generate a contact form

Options

Option name Description
Description Please enter a description for this element
Email address Please enter the email adress where you want the form submissions to be sent.
Submit button label Enter a text for the submit button label.
Email subject text Please enter your desired text that will appear as the subject of the received email
Mail sent message Please enter your desired text that will appear after the form is successfully sent
Show captcha Select yes if you want to add a captcha field.
Labels or Placeholders? Choose what to display,
Here you can create your contact form fields

Example

element

Back To Top

CSS3 Panels

Create and display a CSS3 Panels element

Options

Option name Description
Slider Height Please enter a numerical value in pixels for your slider height.
Image Effect Select an effect for normal and hover states.
Caption Effect Specify the caption effect.
Panel Resize on hover Resize the panel on hover?
CSS Panels Here you can create your CSS3 Panels.

Example

element

Back To Top

Custom container

This element will generate a custom container in which you can add elements

Options

Option name Description
Background color Here you can choose a custom background color for this container.
Background image Please choose a background image for this section.
Equaliser padding Equalizer padding should only be used inside a full-width container and will help to display a proper alignment of the element’s left or right edge in context to the site’s container left and/or right boundries.
Make sure you select ‘First’ only if the column is the first in the row. Select ‘Last’ if the element is on the last column from the row.
Top padding Select the top padding (in percent) for this container.
Right padding Select the right padding (in percent) for this container.
Bottom padding Select the bottom padding (in percent) for this container.
Left padding Select the left padding (in percent) for this container.
Border style Select a border style you wish to use for this container.
Border width Select the border width you wish to use for this container.
Border color Here you can override the background color for this section.
Corner radius Select a corner radius (in pixels) for this container.
Gutter Size Select the gutter distance between columns

Back To Top

Custom Header Layout

Create and display a Custom Header Layout element

Options

Option name Description
Show Page Title Select if you want to show the page title or not.
Override Title Override the default page title.
Show Page Subtitle Select if you want to show the page subtitle or not.
Override SubTitle Override the default page subtitle.
Show Breadcrumbs Select if you want to show the breadcrumbs or not.
Show Date Select if you want to show the current date under breadcrumbs or not.
Header Height Please enter your desired height in pixels for this header.
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.
Header Style Select the header style you want to use for this page. Please note that header styles can be created from the theme’s admin page .
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.

Example

element

Back To Top

Devices Images

Create and display a Devices Images element

Options

Option name Description
Main image type Select the main image type
Image for Laptop Add an image to display inside the laptop
Image for App Frame Add an image to display inside the App frame
Image for Iphone Add an image to display inside the smartphone
Direction Select the direction of the images.
Max. Height Maximum height (px)
Width Frame width
Height Frame height
Devices Type Select the type of devices images. The vector types looks more cartoonish.
Appear on scroll? Start invisible and appear on scroll, when in viewport?
Appear Effect Select the appear effect.
Delay appearance (milliseconds) Delay the appearance? If multiple icon boxes, you can delay each one to appear sequentially. The numbers are in milliseconds.

Example

element

Back To Top

Documentation element

Create and display a Documentation element

Options

Option name Description
Number of items Please enter the desired number of items that you want to be shown under each category.

Back To Top

Documentation Header

Create and display a Documentation Header element

Options

Option name Description
Header Style Select the header style you want to use for this page. Please note that header styles can be created from the theme’s admin page.
Bottom masks override The new masks are svg based, vectorial and color adapted.

Back To Top

Fancy Slider

Create and display a Fancy Slider element

Options

Option name Description
Slides Height Add a general height for the slides in px.
Autoplay carousel? Does the carousel autoplay itself?
Timout duration The amount of milliseconds the carousel will pause
Choose Navigation type Choose either arrows or bullets
Move the controls inside? The option will reposition the controls (arrows or bullets) inside or outside the slider.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.
Slides Here you can create your Fancy Slider Slides.

Example

element

Back To Top

Features Boxes

Create and display a Features Boxes element

Options

Option name Description
Title Enter a title for your Features element
Secondary title Enter a secondary title for your Features Element. Please note that this description will only appear if you choose to use the style 2.
Description Enter a description for your Features Element. Please note that this description will only appear if you choose to use the style 2.
Features Box Style Please select the style you want to use.
Features Box Columns Please select the desired number of columns to use.
Features Boxes Here you can create your desired features boxes.

Back To Top

Features Boxes 2

Create and display a Features Boxes 2 element

Options

Option name Description
Title Enter a title for your Features element
Features Boxes Here you can create your desired features boxes.

Back To Top

Flickr Feed

Create and display a Flickr Feed element

Options

Option name Description
Title Please enter a title for this element
Flickr ID Please enter your Flickr ID
Image Size Select the desired image size for the Flickr images
Images to load Please enter the number of images that you want to display

Example

element

Back To Top

Google Map

This element will generate a Google Map

Options

Option name Description
single_multiple_maps Here you can add your map locations.
Zoom level Select the start zoom level you want to use for this map ( default is 14 )
Map Type Select the desired map type you want to use.
Add directions box Select if you want to add a textbox in which the user can enter a departure location and get directions to the office location (first one if there are more than one).
Directions box text Please enter the direction box text you want to use.
Show overview map Select if you wish to add the overview map option
Show street view Select if you wish to add the street view option
Show map type Select if you wish to add the map type option
Info bubble type Please select the info type
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Panel Image Display an image into the info panel.
Panel Title Title in panel.
Panel Content Content in panel.
Background Style Select the background style you want to use. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Enable fullscreen? Do you want to display the static content as fullscreen?
Map Height Please select value in pixels for the map height.
Map custom style Use a custom map style. You can get custom styles from http://snazzymaps.com.
Normal map style Paste your custom style here (Javascript style array). You can get custom styles from http://snazzymaps.com.
Active map style (when a popup is visible) Paste your custom style here (Javascript style array). You can get custom styles from http://snazzymaps.com.
Allow Mousewheel Select if you want to allow map zooming using the mouse scroll (may interfere with page scroll).
Map localization Force the map localization to a specific language

Example

element

Back To Top

Grid Image Boxes

Create and display an Grid Image Boxes element.

Options

Option name Description
Boxes Height Fixed height of the boxes, in px.
Icon Size Select the size of the icon.
Icon Boxes per ROW Select how many icon boxes to appear per row.
Grid Style Select a style for the grid.
Hover Style Select the style should be applied on hover.
Title first? Display the title first?
Icon Box Add Icon Box.
Background Color Add a background color to the box.
Icon Color (Only for Icon Font) Color of the icon.
Icon Hover Color Hover Color of the icon.
Title settings Specify the typography properties for the title.
Description text settings Specify the typography properties for the description text.

Example

element

Back To Top

Grid based Photo Gallery

Create and display a Grid based Photo Gallery element

Options

Option name Description
Number of columns Select the desired number of columns for the grid.
Images Height Ratio Select the desired image height ratio.
Images Here you can add your desired images.

Example

element

Back To Top

Historic element

Create and display a Historic element

Options

Option name Description
Start text Please enter a text that will appear as a start
Events Here you can add your desired events.

Example

element

Back To Top

Horizontal Tabs

Create and display a Horizontal Tabs element

Options

Option name Description
Tabs Style Using this option you can choose the desired tabs style.
Tabs Here you can add your desired tabs.

Example

element

Back To Top

Hover Box

Create and display a Hover Box element

Options

Option name Description
Title Please enter a title for this box.
Subtitle Please enter a subtitle for this box.
Description Please enter a description for this box.
Add Image Please select an image for this box.
Box Link Please choose the link you want to use.
Hover Box Style Please select the style you want to use.
Box Background-color Select a color.
Content Style Select the desired alignment for the content
Remove right margin? Please choose if you don’t want a right margin.

Example

element

Back To Top

ICarousel

Create and display an ICarousel element

Options

Option name Description
Element Height (container) Custom height (px)
Carousel Height (front img) Carousel’s height. The height is only for the main image (px)
Carousel Width (front img) Carousel’s wid. The width is only for the main image (px)
Autoplay? Autoplay the carousel?
Timeout duration Timeout duration in miliseconds. The time between slides
Perspective The 3D perspective option. (Min 0 & Max 100);
Slides Spaces Spaces between slides
Visible Slides How many slides will be shown (Must be an odd number)
Direction Carousel direction when change
Keyboard navigation Enable keyboard navigation?
Mousewheel navigation Enable mousewheel navigation?
Timer Type Timer Style
Timer Opacity. Timer’s Opacity.
Timer diameter/width Timer diameter or width for the bar type. For example by default it’s a 220px width for Bar style
Timer Color Set a color for the timer
Timer position Set the timer’s position?
Timer X position threshold. Timer X position offset.
Timer Y position threshold. Timer Y position offset.
Slides Here you can create your iCarousel Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Icon Box

Create and display an Icon Box element containing an icon, title description with different settings

Options

Option name Description
Title Title text.
Description Description text.
Link Type Link type of the icon box.
The link Add a link here. For call to action button, title is used as anchor text.
Icon Type Type of the icon.
Image Icon Upload an Icon Image.
Select Icon Select an icon to display.
Shaped Background Icon? Display the icon in a shape with hover effects? Available only for icon fonts to control the hover color.
Icon Color Color of the icon.
Shape Background Color Background Color of the shape behind the icon.
Icon Hover Color Hover Color of the icon.
Shape Background Hover Color Hover background color of the shape behind the icon.
Icon Size Select the size of the icon.
Image Size Select the size of the image.
Icon Padding (Shaped) Select the size of the icon.
Box Alignment Alignment for the content inside the box.
Text color theme Choose text color scheme
Floated Style? Is the box left or right floated? Don’t confuse with alignment.
Title settings Specify the typography properties for the title.
Title first? Display the title first?
Description text settings Specify the typography properties for the description text.
Icon Opacity Select the opacity of the icon.
——- Hover Stage Points Use the feature to display a target point onto a Stage object element. First create the Stage element and customise it, then, copy the ID below.
Point Target Stage ID Copy the ID from the Stage element you want to add points to.
Point Coordinates This will add an animated dot onto the stage image with the X and Y coordinates you provide. In px add “x, y” coordinates – X being distance from left and Y distance from top.
Point Tootip Add a custom tooltip text. Leave empty if you don’t want to display a tooltip.
Appear on scroll? Start invisible and appear on scroll, when in viewport?
Delay appearance (milliseconds) Delay the appearance? If multiple icon boxes, you can delay each one to appear sequentially. The numbers are in milliseconds.

Example

element

Back To Top

Image Box

Create and display an Image Box element

Options

Option name Description
Image Box Title Enter a title for your Image box
Image Box Text Please enter a text that will appear inside your action Image button.
Image Please select an image that will appear above the title.
Image Box Style Please select the style you want to use.
Image Box Title Style Please select the style you want to use.
Link text Enter a that will appear as link over the image.
Image Box link Please choose the link you want to use for your Image box button.

Example

element

Back To Top

Image Gallery

Create and display an Image Gallery element

Options

Option name Description
Title Please enter a title for this gallery.
Images Here you can add your desired images.

Back To Top

Info Box

Create and display an Info Box element

Options

Option name Description
Title Please enter the Info Box title
Subtitle Please enter the Info Box subtitle
Select style Select the desired style for this element
Text color scheme Select the desired style for this element
Select background color Select a color to apply as background color.
Select background image Please select an image to use as background image.
Button 2 text Please enter a text that will appear as button
Button 2 link Please choose the link you want to use.
Button text Please enter a text that will appear as button
Button link Please choose the link you want to use.

Example

element

Back To Top

iOS Slider

Create and display an iOS Slider element

Options

Option name Description
Fullscreen Chose wether the slider should be fixed height or fullscreen.
Slider Height Enter a numeric value for the slider height.Please note that the value will be used as percentage. The default value is 39%. This option works if Fullscreen is disabled.
Autoplay? Autoplay slider?
Transition Speed Enter a numeric value for the transition speed (default: 5000)
Slider Navigation Choose what type of navigation you want to use for your slide.
Add Fade Effect? Choose if you want to add a bottom fade effect to your slider.
Color for the fading background Pick a color
Use fixed width slider? Choose if you want to use a full width slider or a fixed width one.
Use fixed position (scroll) slider? Choose if you want your slider to be fixed on the page when you scroll down
Add scrolling effect? Choose if you want the slider to have a scrolling effect on the entire slider and captions. The captions will fade while the slider will slowly move downwards upon scrolling.
This options works only if the slider is positioned at the very top opf the page!!
Slider Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Slides Here you can create your iOS Slider Slides.

Example

element

Back To Top

Keywords Element

Create and display a Keywords Element element

Options

Option name Description
Keyword Box Style Please select the style you want to use.
Background image Select a background image for this element
Background Color Here you can choose the background color for this element.
Content Please enter the Keywords content

Example

keywords

Back To Top

Laptop Slider

Create and display a Laptop Slider element

Options

Option name Description
Enable fullscreen? Do you want to display the static content as fullscreen?
Slider Title Here you can enter a main title that will appear above the slider.
Slider Display Select how to display the slider.
Main title This title will appear on the left side.
Main Description This description will appear on the left side.
Primary Button Here you can add data for the primary button. In case the general slider style is ‘Just Laptop’, this link will be used to add a link to the title of the slide.
Secondary Button Here you can add data for the secondary button.
Enable bullets? Enable bullets for the slides?
Enable Control Arrows? Enable next & prev arrows?
Transition Timeout Enter a numeric value automatic timeout between slides (default: 5000)
Text Theme Colors Select the color theming. Perhaps you want a light background with dark text or viceversa.
Slides Here you can create your Laptop Slider Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Add bottom mask? Add a bottom mask?

Example

element

Back To Top

Latest Posts

Create and display a Latest Posts element

Options

Option name Description
Title Enter a title for your Latest Posts element
Blog page Link Enter the link to your blog page
Blog Category Select the blog category to show items

Example

element

Back To Top

Latest Posts Carousel

THis element will display a Latest Posts Carousel

Options

Option name Description
Title Enter a title for the latest posts carousel
Posts Category Select the category to show items
Number of items Please enter how many items you want to load.

Example

Back To Top

Media Container

Create and display a Media Container element

Options

Option name Description
Link Type Add a center button?
Button Text Add a text inside the button. If no text is added, an icon will be displayed.
Button Style Select a button style
Alternative border animation – box width set a width for the alternative border animation.
Link Target Add a center button?
Link URL Add a link for the link.
Modal image link Add an image for the modal.
Height LG – Large breakpoint Set the height of the media container for large breakpoint ‘> 1200px’
Height MD – Medium breakpoint Set the height of the media container for medium breakpoint ‘> 992px’ and ‘< 1199px'
Height SM – Small breakpoint Set the height of the media container for small breakpoint ‘> 768px’ and ‘< 991px'
Height XS – Extra small breakpoint Set the height of the media container for extra small breakpoint ‘< 767px'
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Embed Iframe link Add a link
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Enable Gloss Overlay Display a gloss over the background

Example

element

Back To Top

Nivo Slider

THis element will create a Nivo SLider.

Options

Option name Description
Slides Height Select a slider height. Removing the height will add an auto flag which will keep the default images heights.
Slider Transition Select the desired transition that you want to use for this slider.
Automatic Transition Select yes if you want the slider to auto advance to each slide, or no, in order to manually change the slide.
Slider Pause Time How long each slide will show ( default is 5000 ).
Slides Here you can create your Nivo Slider Slides.
Shadow style Select the desired shadow that you want to use for this slider.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Partners and Testimonials

Display a block with partners logos and testimonials

Options

Option name Description
ID: eluid5ccbe16d In case you need some custom styling use as a css selector .eluid5ccbe16d .
General text color theme Select the color theme for the texts
Testimonials Add testimonials.
Partners/Clients side title Add a title (or not)
Partners Add partners/logos.

Example

element

Back To Top

Partners Logos

Create and display a Partners Logos element

Options

Option name Description
Title Please enter the title for this element.
Title Style Please select the style you want to use for this title.
Logos Here you can add your partners logos.

Example

element

Back To Top

Photo Gallery

Create and display a Photo Gallery element

Options

Option name Description
Number of columns Select the desired number of columns for the images.
Images Height Select the desired image height in pixels.
Images Here you can add your desired images.

Back To Top

PHP Code

Create and display a PHP Code element.

Options

Option name Description
PHP Code Please enter the PHP code to be executed. You need to be very careful to write this code properly because it will
be executed as it is and it can potentially break your website.

Warning! This is a very powerful element because it gives you the possibility of executing PHP code directly into the page where it is included. be careful when using this element because if the code is not properly written it might break your website!

Back To Top

Portfolio archive

Create and display a Portfolio archive element

Options

Option name Description
Archive style Please choose the desired archive style to display.
Frame Style Please choose which frame style to apply.
Portfolio Category Select the portfolio category to show items
Number of portfolio Items Per Page Please enter how many portfolio items you want to load on a page.
Number of columns Please enter how many portfolio items you want to load on a page.

Example

element

Back To Top

Portfolio item content

Create and display the current post content of the portfolio item.

Example

element

Back To Top

Portfolio Slider

Create and display a Portfolio Slider element

Options

Option name Description
Enable fullscreen? Do you want to display the static content as fullscreen?
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Slider Main Title Here you can enter a description that will appear above the slider.
Slider Description Here you can enter a description that will appear above the slider.
Sliding Direction Select the desired sliding direction.
Parallax scrolling effect? Choose if you want the slider to have a scrolling effect on the slider.
This options works only if the slider is positioned at the very top opf the page!!
Slides Here you can create your Portfolio Slider Slides.
Slider Background Style Select the background style you want to use for this slider. Please note that styles
can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Pricing Table

Create and display a Pricing Table element

Options

Option name Description
Columns Please select the number of pricing tables to display.
Colors Please select a color theme for the table elements.
Pricing Tables Here you can create your desired pricing tables.

Example

element

Back To Top

Recent Work

Create and display your Recent Work

Options

Option name Description
Recent Works Items Height Enter a height for the carousel items
Style Please select the style you want to use.
Recent Works Title Enter a title for your Recent Works element
Recent Works Description Please enter a description that will appear bellow the title.
Portfolio page link Please enter the link to your portfolio page.
Portfolio text button Please enter the text for the link to your portfolio page.
Portfolio Category Select the portfolio category to show items
Number of portfolio Items Please enter how many portfolio items you want to load.

Example

element

Back To Top

Revolution Slider

Create and display a Revolution Slider element

Options

Option name Description
Background Style Select the background style you want to use. Please note that styles can be created from the unlimited headers
options in the theme admin’s page.
Select slider Select the desired slider you want to use. Please note that the slider can be created from inside the Revolution
Slider options page.
Use Paralax effect Select yes if you have used the parallax classes when you created your slider.
Bottom masks override The new masks are svg based, vectorial and color adapted.

Example

element

Back To Top

Screenshots Box

Create and display a Screenshots Box element

Options

Option name Description
Title Please enter title for this box.
Style Please select the style you want to use.
Link Text Please enter a text that will appear as a button link.
Button Link Please choose the link you want to use.
Features Here you can add your desired features.
Images Here you can add your screenshots images.

Example

element

Back To Top

Search Box

Create and display a Search Box.

Options

Option name Description
Search Box Style Choose a style
Placeholder Effect Choose the placeholder’s effect
Search Input text Add a placeholder text inside the search input.
Button text type Choose the button text or icon
Button text Add a text inside the button
Button width (px) Add a button width
Form height Specify the form height

Example

element

Back To Top

Service Box

Create and display a Service Box.

Options

Option name Description
Service Box Style Select the style of this services box.
Service Box Title Enter a title for your Service box
Service Box Text Description Enter a text for your Service box
Service Box Features Please enter your features one on a line.This will create your features list with an arrow on the right.
Icon Type Type of the icon.
Image Icon Upload an Icon Image.
Image Hover Icon Upload an Icon Image for the hover transition.
Icon Size Select the size of the icon.
Select Icon Select an icon to display.

Example

element

Back To Top

Services Element

Will display the post content of a Services element.

Example

element

Back To Top

Shop Features

Display the Shop Features

Options

Option name Description
Title The title for this element.
Features Here you can add your shop features.

Example

element

Back To Top

Shop Limited Offers

Display Shop Limited Offers

Options

Option name Description
Element Title Enter a title for this element
Shop Category Select the shop category to show items
Number of products Please enter how many products you want to load.
Autoplay carousel? Does the carousel autoplay itself?
Timeout duration The amount of milliseconds the carousel will pause

Example

element

Back To Top

Shop Products Presentation

Display Shop Products.

Options

Option name Description
Display style Select the display layout.
Show Latest Products Select yes if you want to show the latest products.
Latest Products Title Please enter a title for the latest products. If no title is set, the default title will be shown ( LATEST PRODUCTS )
Show Best Selling Products Select yes if you want to show the best selling products.
Best Selling Title Please enter a title for the best selling products. If no title is set , the default title will be shown ( BEST SELLING PRODUCTS )
Show Featured Products Select yes if you want to show the featured products.
Featured Products Title Please enter a title for the featured products. If no title is set, the default title will be shown ( FEATURED PRODUCTS )
Shop Category Select the shop category to show items
Number of products Please enter how many products you want to load.

Example

element

Back To Top

Simple Slider

Display a Simple Slider (formerly known as Flex Slider).

Options

Option name Description
Slider height (px) Add a height for the slider. Empty means automatic height.
Slider style Select a style for the slider.
Slider Transition Select the desired transition that you want to use for this slider.
Slider Speed Adjust the speed between sliding timeout.
Autoplay carousel? Does the carousel autoplay itself?
Slider Navigation Display arrows?
Slider Bullets Display navigation bullets?.
Show Thumbnails? Select if yes if you want to display thumbnails of images on the right side of the slider. Will replace bullets.
Shadow style Select the desired shadow that you want to use for this slider.
Slides Here you can create your Flex Slider Slides.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Skills

Create and display a Skills element

Options

Option name Description
Main center text Add a text that’s going to be placed inside the center
Diagram Width & Height Select the diagram width and height
Diagram font-size Select the diagram text font-size
Center main color Select the center color of the diagram
Center text color Select the center text color of the diagram.
Enable Legend Enable legend?
Legend title Add a text that’s going to be placed into the legend box
Legend Alignment Select the alignment of the legend
Skill Here you can add skills.

Example

element

Back To Top

Stage Image Box

Create and display an Stage Image Box element. To be used with Icon Boxes.

Options

Option name Description
ID: eluid74fe906e To be used in combination with Icon Boxes to display associative points. Copy this ID to the iconbox you’ll be using.
Stage Image Upload an image that will be placed in the middle
Img Alt Add an alternative text for the image (SEO purposes)
Point Color The color of the points.
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.

Example

element

Back To Top

STATIC CONTENT – Boxes

Display a STATIC CONTENT – Boxes element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Title Please enter a title for your boxes.
Box 1 Title Please enter a title for your first box.
Box 1 image Select an image for this Box
Box 1 Description Please enter a description text for your first box.
Box 2 Title Please enter a title for your first box.
Box 2 image Select an image for this Box
Box 2 Description Please enter a description text for your first box.
Box 3 Title Please enter a title for your first box.
Box 3 image Select an image for this Box
Box 3 Description Please enter a description text for your first box.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Default

Display a STATIC CONTENT – Default element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Main title Please enter a main title.
Subtitle Please enter a subtitle
Alignment Select the alignment of the content
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Event Countdown

Display a STATIC CONTENT – Event Countdown element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Title Please enter a title.
Video Please enter the link for your desired video (youtube or vimeo ).
Video Description Please enter a description for this video that will appear above the video.
Date Here you can select the date until the countdown finishes.
Mailchimp List ID Please enter your Mailchimp list id. In order to make Mailchimp work, you should also add your Mailchimp api key in the theme’s admin page.
Use normal or colored social icons? Here you can choose to use the normal social icons or the colored version of each icon.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!
Social Icons Here you can add your desired social icons.

Example

element

Back To Top

STATIC CONTENT – Product Loupe

Display a STATIC CONTENT – Product Loupe element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Title Please enter a title.
Featured image Select an image that will appear on the right side. Recommended size 1000px x 630px .
Features list Please enter a title.
Button 1 Text Please enter a text for the first button.
Button 1 link Here you can add a link to the first button
Button 1 icon Select your desired icon that will appear on the
left side of the button text.
Button 1 style Select the desired style for your button.
Button 1 icon style Select the desired style for your icon.
Text between buttons Here you can add a text that will appear between
your buttons
Button 2 Text Please enter a text for the second button.
Button 2 link Here you can add a link to the second button
Button 2 icon Select your desired icon that will appear on the
left side of the button text.
Button 2 style Select the desired style for your button.
Button 2 icon style Select the desired style for your icon.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Reservation Form

Display a STATIC CONTENT – Reservation Form element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Main title Please enter a main title.
Subtitle Please enter a subtitle
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!
Month field Please enter the name for the month field that holds the month when the url to the endpoint is generated.
Day field Please enter the name for the day field that holds the day when the url to the endpoint is generated.
Nights field Please enter the name for the nights field that holds the nights when the url to the endpoint is generated.
Guests field Please enter the name for the guests field that holds the guests when the url to the endpoint is generated.
Endpoint URL Please enter the link to the endpoint which will display the search results based on the retrieved values. Ex: http://your.endpoint.url/

Example

element

Back To Top

STATIC CONTENT – Showroom Carousel

Display a STATIC CONTENT – Showroom Carousel element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Text content Please enter a content.
Primary Button Add a link, text and select the target for this link
Secondary Button Add a link, text and select the target for this link
Carousel Speed Set the carousel speed in milliseconds (ms). 1000ms = 1s
Enable Pagination? Do you want to enable the carousels pagination?
Carousel Here you can add your carousel items.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Simple Text

Display a STATIC CONTENT – Simple Text element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Text Please enter your desired text.
Button Text Please enter a text that will appear as a button bellow your text.
Button Style Select a button style.
Text color theme Please choose a color theme.
Button link Please choose the link you want to use for your button.
Enable Faded Mask? Add a faded mask at the bottom?
Enable Boxed Mask? Enable Boxed Mask with content over Static content?
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.

Example

element

Back To Top

STATIC CONTENT – Text and Register

Display a STATIC CONTENT – Text and Register element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Main title Please enter a main title.
Subtitle Please enter a subtitle
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Note that this element will only be displayed for non-authenticated visitors!

Example

element

Back To Top

STATIC CONTENT – Text and Video

Display a STATIC CONTENT – Text and Video element

Options

Option name Description
Background Style Select the background style you want to use. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Main title Please enter a main title.
Subtitle Please enter a subtitle
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Video Please enter the link for your desired video ( youtube or vimeo ).
Video Description Please enter a description for this video that will appear above the video.
Bottom masks override The new masks are svg based, vectorial and color adapted.

Example

element

Back To Top

STATIC CONTENT – Video element

Display a STATIC CONTENT – Video element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Title Please enter a title for your boxes.
Video Link Please enter the link to the video you want to embed ( Vimeo or Youtube ).
Video Description Please enter a text that will appear under the video link.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Text Pop

Display a STATIC CONTENT – Text Pop element

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Line 1 Text Please enter a text for the first line.
Line 2 Text Please enter a text for the second line.
Line 3 Text Please enter a text for the third line.
Line 4 Text Please enter a text for the fourth line.
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

STATIC CONTENT – Video Background

Display a STATIC CONTENT – Video Background

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Line 1 Title Please enter a title that will appear on the first line.
Line 2 Title Please enter a title that will appear on the second line.
Caption align Select where to align the captions.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Video link Please enter the video link as seen in the browser address bar for the desired video.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.

Example

element

Back To Top

STATIC CONTENT – Weather Box

Display a STATIC CONTENT – Weather Box

Options

Option name Description
Element Height Please read!
Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don’t add any height, the height will be automatically rely on the content inside the element.
Enable fullscreen? Do you want to display the static content as fullscreen?
Enable scrolling effect? Do you want to enable the scrolling effects? Might cause performance issues.
This options works only if the slider is positioned at the very top opf the page!!
Parallax Scrolling effect type? Select the effect type
Main title Please enter a main title.
Subtitle Please enter a subtitle
Button Main Text Please enter a main text for this button
Button Link Text Please enter a text that will appear on the right side of the button
Button link Please enter a link that will appear on the right side of the button
Enable Weather? Enable displaying the weather forecast?
Location WOEID Add the location WOEID. You can get one here, or search Google for WOEID to find where to get one.
Real Location Add the real location to improve accuracy. City, County, Country etc.
Display unit Choose what unit to display the weather info
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Statistics

Display Statistics

Options

Option name Description
Style Please select the style you want to use.
Text theme color Please select the color theme.
Bar Color Color of the separator bar.
Icons Size Select the size of the icon.
Statistics Here you can create your desired statistics.

Example

element

Back To Top

Stats Box

Display Stats Box

Options

Option name Description
Title The title for this box
Tab icon Select your desired icon that will appear on the left side of the title.
Stats Boxes Here you can add your desired stats boxes.

Example

element

Back To Top

Steps Box

Display a Steps Box element

Options

Option name Description
Select style Please choose a style you want to use.
Element Height Select the minimum height of the element.
Right side background color Please select the right side background color.
Icons Size Select the size of the icon.
Title Please enter a title that will appear on the first box
Subtitle Please enter a subtitle that will appear on the first box
Description Please enter a description that will appear on the first box
Link Text Please enter a text that will appear as link in the first box under the description.
Bottom Link Please choose the link you want to use.
Steps Here you can create your desired Steps.

Example

element

Back To Top

Team Box

Display a Team Box element

Options

Option name Description
Name Please enter a name for this team member
Position Please enter a position for this team member
Description Please enter a description for this team member
Member image Please select an image for this team member
Member image Width Please select the width of the image for this image
Member image Height Please select the height of the image for this image
Image link Please choose the link you want to use for the image.
Social Icons Here you can add your desired social icons.

Example

element

Back To Top

Testimonial Box

Display a Testimonial Box

Options

Option name Description
Testimonial style Select the desired style for this testimonial element
Background Color Here you can choose the background color for this element.
Quote style Select the desired style for quotes
Author Please enter the quote author name
Author Company Please enter the quote author company/function
Author Quote Please enter the quote for this author
Author logo Please select a logo for this author.

Example

element

Back To Top

Testimonial Fader

Display a Testimonial Fader element

Options

Option name Description
Title The Testimonials Fader title
Description The description for this element
Transition Speed T numeric value for the transition speed. Default is 5000
Testimonials Here you can add your testimonials.

Example

element

Back To Top

Testimonial Slider

Display a Testimonial Slider element

Options

Option name Description
Title The Testimonials Fader title
Transition Speed The numeric value for the transition speed. Default is 2500
Testimonials Here you can add your testimonials.

Example

element

Back To Top

Text Box

Display a Text Box

Options

Option name Description
Content Please enter the box content
Title Please enter the title for this box
Title style Select the desired style for the title of this box
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.

Back To Top

Title Element

Display a title and or subtitle

Options

Option name Description
Title Add the title. Shorcodes and HTML code allowed
Sub Title Add a sub-title. Shorcodes and HTML code allowed
Alignment Select the alignment
Text color theme Select a theme text color. In case you have a dark background you most definitely want a light colored text
Top padding Select the top padding ( in pixels ) for this section.
Bottom padding Select the bottom padding ( in pixels ) for this section.
Add a symbol? Add any symbol?.
Symbol Color Select symbol color.
Symbol Custom Color Select symbol color.
Icon Add icon.
Icon Size Select the icon size in px.
Symbol position Select the symbol’s position.
Some text maybe? Add a text paragraph.
Title Heading Select a title heading. The title will be wrapped in this tag
Title settings Specify the typography properties for the title.
Sub-Title settings Specify the typography properties for the sub-title.

Example

element

Back To Top

Vertical Tabs

Display a Vertical Tabs element

Options

Option name Description
Select style Select the desired style for this element
Tabs Here you can add your desired tabs.

Example

element

Back To Top

Video Box

Display a Video Box element

Options

Option name Description
Video URL Please enter a link to your desired video ( Youtube and Vimeo ).
Image Please select an image that you want to display.If no image is selected, the video will be shown directly.
Video title Please enter a title that will appear over the play icon. This will only be shown if you select an image.

Example

element

Back To Top

Wow Slider

Display a Wow Slider

Options

Option name Description
Slides Height Select a slider height. Removing the height will add an auto flag which will keep the default images heights.
Slider Transition Select the desired transition that you want to use for this slider.
Caption style Select caption style
Autoplay? Autoplay the carousel?
Timeout duration Timeout duration in miliseconds. The time between slides
Slides Here you can create your Wow Slider Slides.
Shadow style Select the desired shadow that you want to use for this slider.
Element Background Style Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin’s page.
Background Source Type Please select the source type of the background.
Background image Please choose a background image for this section.
Slide Video Youtube ID Add an Youtube ID
Mp4 video source Add the MP4 video source for your local video
Ogg/Ogv video source Add the OGG video source for your local video
Webm video source Add the WEBM video source for your local video
Video poster Using this option you can add your desired video poster that will be shown on unsuported devices.
Autoplay video? Enable autoplay for video?
Loop video? Enable looping the video?
Start mute? Start the video with muted audio?
Video controls Enable video controls?
Video controls position Video controls position in the slide
Background colored overlay Add slide color overlay over the image or video to darken or enlight?
Overlay background color Pick a color
Overlay’s opacity. Overlay background colors opacity level.
Overlay Gradient 2nd Bg. Color Pick a color
Gradient Overlay’s 2nd Opacity. Overlay gradient 2nd background color opacity level.
Bottom masks override The new masks are svg based, vectorial and color adapted.
Disclaimer: may now work perfectly for all elements!

Example

element

Back To Top

Widgets

Widgets

Kallyas provides 10 custom widgets that you can use in your website. They can be found in the “Appearance > Widgets” page:

widgets

All of them are configurable and very easy to use. All you have to do is drag and drop them into the selected sidebar:

w-sidebar

This is the full list of widgets that come with Kallyas:

  • Archives (Displays a monthly archive of your website’s posts)
  • Categories (Displays a list or dropdown of your website’s categories)
  • Contact Widget (This widget will display your content with a “Say Hello” image on the top right)
  • Flickr Widget (This widget will display a list of images from Flickr to your website)
  • Recent Posts (This widget will display a list of the most recent posts on your site)
  • Mailchimp Newsletter (This widget will add a mailchimp newsletter to your site)
  • Side by side Menu (This widget will add one of your custom menus as a widget.This widget will display two menu items on a row )
  • Social Buttons Widget (This widget will display your desired social buttons)
  • Tag Cloud (This widget will display your most used tags in cloud format)
  • Twitter Widget (This widget will display your recent tweets)

Back To Top

Shortcodes

Shortcodes

Kallyas provides a great number of shortcodes you can use in your pages, posts, products, portfolio items or documentation pages.  To make it easier for you to use them, we’ve added a button to the editor:

top-bar-editor

You can see the rounded button with the letter “K” inside it only when the editor is in “Visual” mode.  Once you click it, the folowing list is presented to you and then you can simply click on the element you want to generate to add it to your page’s content.

shortcodes

Back To Top

Portfolio

Setting up portfolio

Setting up your portfolio is extremely easy. Navigate to your website’s admin area and click on the “Portfolio Items” from the left hand side menu, as you can see in the screenshot below:

portfolio-1

After that,  you can start adding portfolio items and create categories for them. By default, your portfolio will available at this URL: http://your-website/portfolio, but that can be changed. We’ll show you how to do that in the next section.

Back To Top

Using custom permalinks for portfolio

In this section you will learn how easy it is to change the permalinks that point to your portfolio. In the previous section we were saying that your portfolio would be, by default, available at this address: http://your-website.name/portfolio; but that can be changed to anything you want.

For example, if you want to rename your Portfolio to Showcase, all you have to do is go to General Settings and click on Permalinks. Locate the “Portfolio Slugs” section and update it as you can see in the below picture:

portfolio-3

Save settings. Now that you’ve changed the portfolio slug, it will be available at this address: http://your-website.name/showcase.

That’s all there is to it!

Back To Top

Setting up blog

Setting up blog

To setup your blog, is very easy. Navigate to Settings > Reading and select the page you would like to use as the blog page, as you can see in the image below:

blog

Once you save the settings, you can access the blog at this address: http://your-website.name/blog.

Kallyas provides more options to customize the blog page’s appearance and they can be found under Kallyas Options > Blog Options:

blog

As you can see in this image, these are the default values the theme uses to display the blog page.

You can customize the layout by using the “Blog Columns” option to set how the number of columns:

3-cols

In this example, we have used a 3 columns layout.

 

The “Archive Page Title” sets the title of the page that will be displayed in the page header. This is a translatable string so if you’re using the WPML plugin you will find this text there, available for translation.

 

The “Archive page subtitle” sets the page’s subtitle and, if provided, it will be displayed right beneath the “Archive Page Title“. This is also translatable.

 

The “Use full width image” option refers to how the featured image of the blog entries will be displayed. The “Use default layout” will display blog entries like this:

1

while “Use full width image” will display them like this:

2

 

The “Use first attached image” option, if set to a value of “Yes“, will use the first image found in a blog post as featured image if no featured image is set for that post.

 

Back To Top

Using child theme

Using child theme

Kallyas was built with extensibility in mind, which means that it can act either as a standalone theme or as a parent theme. When used as a parent theme it will give you a great deal of extensibility because you can extend the Kallyas theme to a whole new level.

By using a child theme, you can change some of the functionality the Kallyas theme provides, this way you can ensure the theme is performing the exact way you want it to.  If you don’t know much about Child Themes, here is a good article from WordPress team: https://codex.wordpress.org/Child_Themes.

When using a Child theme, basically you extend or rewrite parts of the parent theme, in our case the Kallyas theme.  For some developers and site owners this is an important functionality because some of them might want to execute a different code at a certain time, or extend the default functionality from the parent theme.

Since version 4.0, we have better organized the code so you can find very easy what you’re looking for.  We have now grouped all WordPress hooks and custom functionality in various files:

  • th-action-hooks.php – This file holds all theme’s functions bound to various action hooks
  • th-custom-hooks.php – This file holds all theme’s custom hooks
  • th-filter-hooks.php – This file holds all theme’s functions bound to various filter hooks
  • theme-functions-override.php – This file holds all theme’s functions bound to various hooks that can be overridden in child themes

Back To Top

Adding custom css

Adding custom css

Kallyas provides now a powerful feature called “Custom CSS“. This is available on both front-end and back-end.

In the front-end, it is located at the bottom of the page, and visible only if the post or page is edited with the new Page Builder, as you can see in the image below:

custom-css

All the style rules added in this section will be saved and later on dynamically added in the header of the page. So these style rules will be visible for this page only.

If you want to customize the theme at a larger scale, you can use the “Custom CSS” form available in the theme’s options under the “Advanced options” section:

csss

All the style rules added in this section will be saved into a css file called “zn_dynamic.css” which is located in the “wp-content/uploads” directory. This file will be loaded on every page of your website.

Back To Top

Page specific options

Page specific options

To better manipulate the layout of a post or page we have added a set of options that will be available when editing a post or page.

page-options

Post Layout Options” allows you to specify whether or not the page will have a sidebar. You can either set it to the left of the content or to the right.

Select sidebar” dropdown will give you the possibility of choosing what sidebar to be displayed. THis dropdown will list all sidebars created in the theme.

Show Social Share Buttons?” allows you to control the displaying of the Social Media links, like G+ or Twitter.

Hide page subheader?” allows you to hide the page subheader, including the sliders (if any was set globally).

 

Back To Top

Additional help

Configure MailChimp

Kallyas is using MailChimp for subscription forms. In order to be able to use this functionality you must first enter your MailChimp Api Key in the Theme Options page:

mailchimp

 

 

These two articles will give you more info about how to get your API key:

  • http://kb.mailchimp.com/accounts/management/about-api-keys
  • https://support.leadpages.net/hc/en-us/articles/203522270-How-do-I-find-my-MailChimp-API-token-or-key-

 

You will also need to create a List on your MailChimp account page. The lists you create there will automatically be retrieved by Kallyas once you add your MailChimp API key. The lists are displayed in to places:

 

Kallyas options > Coming Soon:

mc-1

 

 

Appearance > Widgets > [Kallyas] Mailchimp Newsletter:

mc-2

 

This article will guide you through the process of creating a List:

  • http://kb.mailchimp.com/lists/growth/create-a-new-list

Back To Top

Google Analytics

To add Google Analytics in your website, you need to go to Kallyas options and add the code from Google Analytics:

ga

 

These article will show you how to find your Google Analytics code:

  • https://support.google.com/analytics/answer/1032385?hl=en

Back To Top

Facebook API key

In order to be able to use and display Facebook buttons on your website you need to add your Facebook API key in the Theme Options as you see in the below image:

fb

 

 

This article will show you how to get your API key:

  • http://www.shoutmeloud.com/how-to-acquire-your-facebook-api-key.html

Back To Top

Configure reCaptcha

To be able to use ReCaptcha on your website you need to add your ReCaptcha API key in the Theme Options:

rc

 

This article will walk you trough the process of getting the API key:

  • https://developers.google.com/recaptcha/docs/start?hl=en

Back To Top

Automatic updates

Kallyas can provide you with an easy way to update the theme. To be able to use this functionality you must first provide your Themeforest username and API key in the Theme Options:

tf

 

These are the steps to get your API key:

  • Log into your ThemeForest account and click your username in the top right corner to access the dropdown. Then, select the “Settings” link (Image 1).
  • After the “My Account” page loads, click the “API Keys” tab on the left side (Image 2).

 

Step #1

Step #1

 

Step #2

Step #2

Back To Top