Start

Vara - WordPress Theme for Architects & Interior Designers


1. Getting Started

Hi, and welcome to the Vara Documentation. The Documentation covers all the information needed to use the Vara theme to build an amazing website, as well as some helpful tips and tricks that will make your experience working with the Vara theme easier and more enjoyable.

If you need any additional assistance while using our theme, you can always contact us via our profile https://themeforest.net/user/gradastudio and our support team will be glad to help you out.


- Installing Vara

After downloading the Vara installation file from ThemeForest, extract it and in the extracted folder locate the vara.zip file. You can then install the Relaite theme using one of the two following installation methods:

  1. WordPress upload - For most users, this is probably the simplest installation method. To install the Vara theme using this method, please follow these steps:
    1. Login to your WordPress admin panel
    2. Navigate to Appearance > Themes > Add New > Upload Theme
    3. Click on Choose File and select vara.zip
    4. Click on Install Now
  2. FTP upload - If you would like to install the Vara theme via FTP, please follow these steps:
    1. Extract the vara.zip file you previously located. You should now see a folder named vara
    2. Using an FTP client, login to the server where your WordPress website is hosted
    3. Using an FTP client, navigate to the /wp-content/themes/ directory under your WordPress website's root directory
    4. Using an FTP client, upload the previously extracted vara folder to the themes directory on your remote server

- Importing Demo Content

With the Vara theme, you have the option to either start creating your site from scratch, or choosing to import one of the included demo sites to use as a starting point, and then modifying it to suit your needs. In this section we will explain how to do the latter.

Note

If you plan on building an online shop with Vara, you should install the WooCommerce plugin before importing the demo content. For more information on how to install WooCommerce, please read the WooCommerce section of this Documentation.

Note

If you plan on using contact forms on your website, you should instal the Contact Form 7 plugin before importing the demo content so you recieve all the contact forms from our demo site. For more information on how to install Contact Form 7, please read the Contact Form 7 section of this Documentation.

Vara comes with a one-click import module. To import one of the included demo sites, please follow these steps:

  1. Login to your WordPress admin panel
  2. Navigate to Appearance > Import Demo Data
  3. Choose to import Main Demo or Header Templates only
  4. Click Import and wait until importing demo is finished

import


- Updating Vara

You can update your theme by performing the following steps:

  1. Download the latest theme .zip file from ThemeForest
  2. Extract it and locate vara.zip
  3. Extract vara.zip and locate the vara folder
  4. Copy/Replace the contents of the vara folder to the /wp-content/themes/vara folder of your web site.

- Frequently Asked Questions

1 - Why can't I save my menu?

WordPress by default has a limited number of menu items. When you import our demo content, which contains a lot of menu items, you might not be able to save changes you make to a menu. You can fix this problem by contacting your hosting and asking them to add the following lines to the php.ini file:

suhosin.post.max_vars = 5000 suhosin.request.max_vars = 5000

2 - Why is there a smiley displayed on blank pages?

This problem is most likely related to JetPack and memory settings of your hosting. You can either disable JetPack or read what the JetPack developer wrote: Regarding the memory limit, please refer to the WordPress Codex section concerning this problem. Some sites that load many plugins alongside WordPress ultimately require a higher memory limit than WordPress defaults to, but since this is limited to specific hosts and configurations, it must be dealt with on an individual basis. You'll find the Codex article at: https://codex.wordpress.org/Common_WordPress_Errors#Allowed_memory_size_exhausted

3 - How do I optimize my site?

Please use this tool to investigate reasons for slow loading: https://developers.google.com/speed/pagespeed/insights/?hl=en

4 - How to translate or rename default theme labels?

You can use the Poedit software (https://poedit.net/wordpress) to translate/rename all the theme's labels. Another solution is to edit the theme folder/languages/en_US.po file directly in a text editor and manually edit the labels you want to translate.

5 - Why do I see a white screen when importing demo content?

If you get a white screen or some other error when trying to import our demo content, this probably happens because of the maximum execution time limit. You need to increase the maximum execution time (upload time) setting of your web server. The default maximum execution time on web servers is 30 seconds. Please increase it to 120 seconds. Possible ways of achieving this are:

You can also ask your hosting provider to take care of this for you.

2. Theme Settings

After installing our theme you are able to customize the view of your web-site with our Theme Options panel located at Appearance > Customize. Here you can find a lot of settings for:

Required

Make sure you've installed Vara Plugin.

customizer


- General


- Header



- Portfolio


- Blog


- Shop


- Utility


- Style


- Typography


- Social Media

3. Options for pages

Another powerful tool to customize your website is options for pages. You can configure your layout, header, page title and others for any particular page.

Required

Make sure you've installed Advanced Custom Fields plugin.

All the settings are divided into the following tabs:

acf


- General


- Header



- Hero

4. Page Builder Elements

Today using native WordPress shortcode function is not comfortable and easy. Instead, you can create your pages using Elementor Page Builder widgets (shortcodes) allowing to create page templates of any design. GradaStudio has developed an integrated set of widgets expanding and improving options in order to provide comprehensive tools to present Posts, Portfolio, Gallery and other functionality. So, all our theme elements are available through the Elementor Page Builder interface:

Elementor

Other widgets mostly used for building custom header and footer templates

5. Menus

In this section of the Documentation we will discuss menus and menu creation.

- Menu Creation

To create a menu, navigate to Appearance > Menus from your WordPress admin panel.

Menu

In the upper left corner of your screen you will see two tabs: Edit Menus and Manage Locations.

Menu

In the Manage Locations tab you can assign menu to location Main Menu in case you want to show the menu on default header.

Menu


You can edit your menus in the Edit Menus tab. When editing menus, you can click on the small triangle icon on each menu item to open a list of editable settings:

6. WooCommerce

Watch video tutorials that can help you use all features from the WooCommerce plugin. More video and tutorials you can find on their official website https://docs.woocommerce.com/document/woocommerce-guided-tour-videos/

7. Contact Form 7

In this section of the Documentation we will discuss how to install the Contact Form 7 plugin and how to add contact forms to your pages.

Vara comes with Contact Form 7 integration, making it possible to create contact forms for various purposes.

In order to setup Contact Form 7, please perform the following steps:

  1. Navigate to Plugins > Add New from your WordPress admin panel.

    Contact form 7 install

  2. Type "Contact Form 7" in the search field.

  3. Locate "Contact Form 7" in the search results and click on Install Now

  4. Once installation is complete, click on Activate Plugin.

    Contact form 7 install

8. Changelog


Version 1.0