THEME DOCUMENTATION
We would like to thank you for choosing Zaya. Built compatibly with the latest version of WordPress and page builder plugin Visual Composer, Zaya promises to give you awesome experiences in creating your own websites.
In case of any questions please do not hesitate to contact us via our support forum at https://nictes.com/
INSTALLATION
INSTALLING WORDPRESS
To install this theme you must have a working version of WordPress already installed. If you need help installing WordPress, follow the instructions here: http://codex.wordpress.org/Installing_WordPress
REQUIREMENTS
To use Zaya, you must be running WordPress 4.9 or higher. We have tested it with Mac, Windows and Linux. It has been tested on Chrome, Firefox, Safari, Opera, Internet Explorer 10+.
There are system requirements in order to install and setup Zaya theme and its components properly. Make sure that you are running the latest version of WordPress, PHP version 7 or higher and MySQL version 5.6 or higher. We also recommend the following PHP configuration limits:
Recommended PHP configuration limits
Please contact your server provider to verify your current PHP limits and have them set it up again if needed.
DOWNLOADING ZAYA
After purchasing Zaya theme on Nictes.com, Download the Zaya.zip file and unzip it. In this zip file you have everything you need:
Zaya.zip
The main theme zip file you need to upload to your WordPress in order to install Zaya (see below). In this zip you will find the theme itself. NOTE: Do not unzip this file. Do not upload the entire Zaya.zip file you get from Nictes, upload ONLY zaya.zip.
Child Theme
Here you will fid Zaya Child Theme (zaya-child.zip).
Demo Sliders
All demo sliders we have used on our demo website. (demo-data/sliders).
Demo Default Widgets
Default widgets used for widget site footer area and default page sidebars on our demo website. (demo-data/default-data).
XML Files with demo content, which you can use for manual content import in WordPress.
Plugins
Gantry 5.4.23+ is required for Zaya to work correctly. For more details on the Gantry Framework, please visit its Dedicated Website gantry.org
Documentation
A link to this documentation.
Licensing
INSTALLING GANTRY FRAMEWORK
You can install Gantry 5 Framework via 2 ways: Upload Gantry 5 or Via WordPress Plugin Repository
Upload Gantry 5
- To install the Gantry plugin, you’ll need to navigate to Plugins → Add New in the admin area of WordPress.
- Browse on your Zaya Package → Plugins and find wordpress-pkg_gantry5_v5.4.23.zip file on your computer and click Install Now.
- Once installation is done, select the Activate button to turn the Gantry 5 plugin on.
WordPress Plugin Repository
- To install the Gantry plugin, you’ll need to navigate to Plugins → Add New in the admin area of WordPress.
- The next step is simple. Use the Search Plugins field at the right-hand side of the page to search for Gantry. This will enable you to find the Gantry 5 Framework plugin.
- The next thing you will need to do is select the Install Now button on the Gantry 5 Framework plugin’s box. Make sure you are installing Gantry 5 and not Gantry 4.
- Once installation is done, select the Activate button to turn the Gantry 5 plugin on. This button will appear in the same place the Install Now button was before.
INSTALLING ZAYA THEME IN WORDPRESS
You can install Zaya theme via 2 ways: Via WordPress or via FTP
Via WordPress
Follow these steps below to install Zaya theme via WordPress:
- Visit Dashboard > Appearance > Themes > Add New.
- Click Upload Theme.
- Browse zaya.zip file (not the theme package zip file) on your computer and click Install Now.
- Activate Zaya theme.
Via FTP
Follow these steps below to install Zaya theme via FTP:
- Login your FTP account via FTP software to access your host web server.
- Extract zaya.zip file.
- Upload the extracted folder zaya to wp-content/themes folder.
- Activate Zaya theme in Dashboard > Appearance > Themes.
INSTALLING PLUGINS
In order to get Zaya properly work you need to install some useful plugins. All these plugins are included in Zaya, you don’t need to purchase them extra!
After the theme is installed successfully you will get following message about the installation of required and recommended plugins:
- Click on “Begin installing plugins”
- Check all plugins, select “Install” and click on “Apply”
REQUIRED PLUGINS
In order to use Zaya in its full, please note, that following plugins SHOULD BE installed during the theme installation (see installation instructions above):
- Gantry 5 – Framework for Gantry 5 based themes.
- Gantry 5 Outline Picker – allows you to choose your desired Gantry 5 outline when creating pages.
RECOMMENDED PLUGINS
In addition, you can take an advantage of enriching your Zaya’s experience with following recommended plugins:
- WPBAKERY Page Builder – leading visual drg’n’drop page builder for WordPress
- Revolution Slider – leading slider plugin for WordPress
- WooCommerce – leading eCommerce plugin for WordPress.
- Projects – show off your recent work using our shortcode, widget or template tag.
- Breadcrumb NavXT – adds a breadcrumb navigation showing the visitor’s path to their current location.
- Contact Form 7 – one of the most popular plugins for managing contact & feedback forms
- MailChimp for WordPress – adds various highly effective sign-up methods to your site.
- Invisible reCaptcha – Google Invisible reCaptcha for WordPress.
- Social Login, Social Sharing by miniOrange – allow your users to login, comment and share with Social Networks.
- One Click Demo Import – start the website development process at the same starting point as the theme demo page, so you can quickly develop the website you want.
- Regenerate Thumbnails – useful when changing their sizes or your theme.
That’s all! Now you are ready to go on with Zaya, installed on your WP.
INSTALLING CHILD THEME
If you plan to modify the source code of the main parent theme (php, js, style.css, .scss) we strongly recommend to install this child theme and make such modifications inside this child theme in order to avoid any possible problems & issues by installing updates of Zaya’s main parent theme in future. You can find this child theme in your Zaya Package folder – please check for zaya-child.zip
The installation of the child theme works in the same way as the installation of the main parent theme (see description above).
IMPORTANT: DON’T TRY TO INSTALL CHILD THEME IF THE MAIN THEME IS NOT INSTALLED – THIS WILL GIVE NO RESULT
IMPORTING DEMO CONTENT
NOTE: Make sure the wp-content > uploads folder is writeable
RECOMMENDED PHP SETTINGS
In order to avoid any possible import issues because of your server and php setings, we would recommend setting following PHP values in your server’s php.ini:
- Upload Max File: – upload_max_filesize = 256M
- Max Input Time: – max_input_time = 400
- Memory Size: memory_limit = 256M
- Script execution time: max_execution_time = 400
- Post Size: – post_max_size = 512M
If you don’t have an access to the php configurtation on your server, you can try to set this values in .htaccess file:
php_value upload_max_filesize 256M
php_value max_input_time 400
php_value memory_limit 256M
php_value max_execution_time 400
php_value post_max_size 512M
Please be careful, because some of hosting companies don’t allow to change php settings directly using .htaccess. In case you have some problems after modifying your .htaccess file, log in to your FTP account and remove these modifiactions from .htaccess
ONE-CLICK IMPORT OF DEMO CONTENT
Zaya comes with the plugin “One Click Demo Import”, allowing you to import the whole demo content from the main multipurpose demo site (https://zaya.nictes.com/).
This plugin is a demo importer which imports all posts/pages, sample sliders, widgets, customization, and more.
Follow these steps below to import demo via Zaya Demo Import:
- Visit Dashboard > Appearance > Zaya Import Demo.
- Before you begin, make sure all the required plugins are activated.
- Click Import Demo Data.
- After you import Zaya demo, please check your page and make sure that everything has imported correctly. If it did, you can deactivate the One Click Demo Import plugin.
- Also, we recommend you will have to regenerate thumbnails, go to Tools > Regenerate Thumbnails.
The importing process may take up to 15 minutes.
CUSTOMIZATION
SETTING UP HOMEPAGE
Next step after making your general website settings would be to set your homepage – starting page of your website.
Go to “Settings -> Reading”
Select a static page option to be displayed as your front page
Choose a page from the select box “Front page” that should be your homepage
Save your changes
LOGO
You are able to customize your website in Dashboard > Zaya Theme or Zaya Child Theme
COLORS
In some cases, if you will need to use transparent website navigation or header, where your logo and the main menu will be placed above some dark image or background, you will need other colors for your logo as well. In order to prevent the situation, where your logo will not be seen, for instance, because it is black on a very dark background. For such cases, you would prefer am inverted version of your logo, i.e. in white or light gray colors.
UPLOADING YOUR LOGO
The Logo particle enables you to set the image and/or text you want to have appeared as your logo for the site. Through this particle, you can add your logo to the site in a position you set in the Layout Manager.
In order to set up your logo, go to “Zaya Theme or Zaya Child Theme → Particle Defaults → Logo / Image”. As described above, here you can set:
We recommend to initially prepare your logo in the right size in order to avoid some unwanted artefacts.
Setting | Description |
---|---|
URL | Sets the URL the logo links to. If left blank, the home page is used. |
Image | Sets the image that appears as the logo on the front end. |
SVG Code | You can enter SVG code here in place of an image. |
Text | Sets the text which appears along with, or instead of, the logo image. |
CSS Class | Set a specific CSS class for custom styling |
<svg width="400" height="180">
<rect x="50" y="20" rx="20" ry="20" width="150" height="150" style="fill:red;stroke:black;stroke-width:5;opacity:0.5">
Sorry, your browser does not support inline SVG.
</svg>
This would produce a rectangle in place of your image. This is a great way to save on bandwidth as there would be no image file at all to load, just the SVG code.
FAVICON / TOUCH ICON
UPLOADING YOUR FAVICON – TOUCH ICON
In order to set up your favicon and touch icon, go to “Zaya Theme or Zaya Child Theme → Pages Settings → Assets → Favicon / Touch Icon”.
We recommend to initially prepare your favicon (512×512) and your Touch Icon (192×192) in the right size in order to avoid some unwanted artefacts.
SETTING UP NAVIGATION
The Menu particle gives you the ability to place menus and define how they appear on the front end.
The Menu particle settings are different than the ones found in the Menu administrative panel. Here’s a quick breakdown of the life cycle of a menu in Zaya with Gantry 5.
Setting | Description |
---|---|
Menu | Select the menu you wish to assign to the Particle. |
Base Item | Select the menu item to be used as the base for the menu display. |
Start Level | Sets the starting level for the menu. |
Max Levels | Sets the deepest level at which the menu particle renders the menu. |
Render Titles | Renders the titles and/or tooltips of the menu items for accessibility. |
Expand on Hover | Allows the user to enable/disable the ability to expand menu items by hover or click only. |
Mobile Target | Check this field if you want this menu to become the target for Mobile Menu and to appear in OffCanvas. |
Select the menu you wish to assign to the Navigation bar.
Go to Zaya Theme or Zaya Child Theme → Particle Default → Menu
Chose your “Primary menu”
Edit Item of your Primary Menu
Go to Appearance → Menus
Select your “Primary menu”
Edit your menu as usually
NAVIGATION LAYOUTS & STYLES
Disable Fixed Header
Go to Zaya Theme or Zaya Child Theme → Layout (Base Outline)→ Navigation Section
Click Section Settings
Remove Tag Attributes
Click Apply and Save
NAVIGATION COLORS
In order to set up colors for your main and sub-navigation, go to “Zaya Theme or Zaya Theme Child → Styles (Base Outline) → Navigation Styles”. Here you can set any color for main navigation and subnavigation.
THEME STYLE SETTINGS
One of the most important aspects of Zaya Gantry theme is its ability to be easily customized using the settings presets in the Theme Settings page. These settings can be adjusted by navigating to Zaya or Zaya Child Theme.
Basically, this panel serves as a one-stop-shop for changing the way the theme itself looks for a specific outline.
Controls
As you configure the commands in this panel, you may notice the Recompile CSS and Save Styles buttons at the top of the page. These buttons allow you to save your outline Styles settings, as well as to recompile the CSS of the page so that you can preview your settings on an associated page.
The Save Styles button saves your new style settings to the outline and recompiles the CSS so that your changes appear on the frontend. If you select this button, you do not have to click Recompile CSS as this action is automatically performed.
Select a Preset
Zaya Theme on Gantry makes use of a powerful preset system that allows developers and site builders to create preset styles and configurations.
Zaya Styles Presets are a combination of features and configuration settings which allow you to create predefined groupings for the entire theme, as well as on a per-outline basis. Presets can consist of any Zaya configuration option such CSS style, link color, background, body graphic levels, font settings, and much more.
The Preset Selector gives users the ability to quickly switch between Presets, with a pre-designed color palette and style settings. This is a quick and easy way to dramatically change the look of your site. Once you have selected the preset of your choice, you can further customize the style of the outline using the Theme-specific Settings, below.
Theme-specific Settings
Zaya comes with a set of Style settings you can use to customize the look and feel of the theme. These settings can appear in multiple sections, with each section focusing on a particular area or type of Style quality. For example, there might be a section dedicated to section-by-section color, while another focuses on the background section of the site, specifically.
If you are changing these settings for a non-default outline, the settings themselves will appear faded out until these settings are changed from their defaults. You can either click on the setting itself or check the box to the right of the setting to indicate that you wish to make a change from the default before making your changes.
If you wish to have the setting for the outline revert back to defaults, simply uncheck the checkbox and save the style.
Configuration Styles
The Configuration Styles area of the Styles administration panel gives you the ability to set responsive breakpoints for the outline, as well as menu options such as the dropdown width for the Simple dropdown setting.