Documentation - GymEdge WordPress Theme

# Gym Fitness, Yoga & Personal Trainer WordPress Theme Documentation

For any support please don't hesitate to contact us at support@radiustheme.com. We provide 15 hours real-time support for our customers.
Last updated on: May 31, 2019 / v3.6

## 1| Requirements

You need at least WordPress version 4.5+ installed for this theme to work properly. It is strongly recommended that you always use the latest stable version of Wordpress to ensure all known bugs and security issues are fixed. Other requirements:

- PHP version 5.6 or greater. But for maximum speed gain we recommend you to use PHP version 7.3+.
- MySQL version 5.6 or greater OR MariaDB version 10.0 or greater.

For more information about WordPress requirements you can check the official page from here: https://wordpress.org/about/requirements/

## 2| Theme Installation

When you are ready to install a theme, you must first upload the theme files and then activate the theme itself. The theme files can be uploaded in two ways:

- FTP Upload: Using your FTP client, upload the non-zipped theme folder into the /wp-content/themes/ folder on your server.
- WordPress Upload: Navigate to Appearance -> Themes -> Add New -> Upload. Go to browse, and select the zipped theme folder. Hit "Install Now" and the theme will be uploaded and installed.

Once the theme is uploaded, you need to activate it. Go to Appearance -> Themes and activate your chosen theme.

After that you need to install and activate the following pre-packaged plugins:

1. GymEdge Core: Required and must install plugin.
2. Redux Framework: Required and must install plugin.
3. RT Demo Importer: Required if you want to import demo contents. You can deactivate it after demo is imported.
4. WPBakery Page Builder: Recommended. Page builder plugin.
5. WP Logo Showcase: Optional. Install if you want to showcase your logo.
6. LayerSlider WP: Optional. Install if you want to show slider.
7. Contact Form 7: Optional. Install if you want to use contact form.
8. Easy Twitter Feed Widget: Optional. Install if you want to show twitter feeds at bottom/sidebar.
9. Meks Simple Flickr Widget: Optional. Install if you want to show flickr images at bottom/sidebar.
10. WP Retina 2x: Optional. Install if you want your site to be retina ready.
11. WooCommerce: Optional. Install if you want ecommerce/store functionality.
12. YITH WooCommerce Quick View: Optional. Install if you want quickview icon over products.
13. YITH WooCommerce Wishlist: Optional. Install if you want wishlist icon over products.

N.B: All plugins must be installed and activated if you want your site to look exactly like demo.

To install these plugins, navigate to Appearance -> Install Plugins and start installation.

After installation process complete you have to activate these plugins.

## 3| Importing Demo contents

We provie you two methods for importing demo contents: Automatic and Manual. You can follow either one of these methods.

- Automatic: This method will remove all your existing data, so use this method only in fresh website. This procedure will be faster because you just have to do one click and then everything will happen automatically. And at the end your website will exactly look like demo.
- Manual: With this method you have to import and configuire everything manually. The downside of this method is your website will not look exactly like the demo unless you configuire everything exactly like the demo. This method is suitable for you if:
  - You already have a working website with existing contents(eg. posts, pages etc)
  - You don't care about other configurations(eg. various plugin settings), you just want to import posts,pages etc from the demo

Our recommendation is to go with Automatic Method unless your website has any existing contents you want to keep. If you have any query regarding this, do not hesitate to contact our support email. We will reply you as soon as possible.

## 3.1| Automatic Import

Want an exact clone like the demo? You can do it by only one click!

** Note: Before proceeding, please remember that when you are done with the demo import, all existing data will be removed and replaced by the demo contents. So it is highly recommended that you should do this only on fresh site. **

First please make sure that GymEdge Parent Theme is activated on your site.

From Admin menu, navigate to Tools -> Demo Content Install. Or alternatively, navigate to Plugins -> RT Demo Importer -> Install Demo Contents.

In this page, Click on the Install button for installing the demo.

It will take some time for importing the demo contents. Please note: Some images are replaced with a placeholder image because of licensing.

After importing demo data, please update your permalink. To update permalink, navigate to Settings -> Permalink and then click on Save Settings button.

If you face any issue, check the Troubleshooting section from here.

## 3.2| Manual Import

We have provided some sample contents inside "sample-data" directory which comes with your theme package. You have to import those contents.

- Importing Contents: From Admin menu, navigate to Tools->Import. From there select the "WordPress" and then run the importer(It will ask you to install the importer before if this is your first time). In the next step when file uploading option appears, select the "contents.xml" file from sample-data and start uploading. In next step select the checkbox saying "Download and import file attachments" and click on "Submit". Then it'll start uploading contents eg. pages, posts etc.

- Importing Widgets: You can import widgets using plugin Widget Importer & Exporter. After installing this plugin, navigate to Tools->Widget Importer & Exporter. In the next step when file uploading option appears, select the "widgets.wie" file from sample-data and start importing.

- Importing Sliders: From Admin menu, navigate to LayerSlider WP, then click on "Import Sliders" option. In the next step when file uploading option appears, select the "slider.zip" file from sample-data and start importing.

- Importing options: First open the file "options.json" in any text editor and copy the whole contents. Now from Admin menu, navigate to Appearance -> GymEdge Options, then go to import/Export tab. From there click on "Import from file" option. A textbox will appear, paste the copied contents on that textbox and click on "Import" button.

- More Configurations: This theme comes with many pre-packaged plugins eg. Contact Form 7 etc . You should also configure these plugin settings too as per your needs.

## 4.1| Sitewide Colors

From Admin menu, navigate to Appearance -> GymEdge Options. Then go to General tab.

Choose your preferred primary and secondary color from the color palette.

After changing the settings, Click on Save Changes button.

## 4.2| Logo

From Admin menu, navigate to Appearance -> GymEdge Options. Then go to Header tab.

From here you can upload dark logo and light logo. Light logo will be used when "Header Style 2" is selected for any page (Header style section will be discussed later)

Starting from version 1.5, you can set the logo area width too.

After changing the settings, Click on Save Changes button.

## 4.3| Favicon

Favicon is the little icon which you see at the address bar of your browser.

To set this, from Admin menu navigate to Appearance -> Customize link.

Then navigate to Site Identity

From there you can upload the "Site Icon" which will be used as favicon

For more details, here's the WordPress official instruction link for setting up favicon: https://codex.wordpress.org/Creating_a_Favicon

## 4.4| Preloader

From Admin menu, navigate to Appearance -> GymEdge Options. Then go to General tab

Here you can find the option for enabling/disabling "Preloader" option. Also you can upload your custom preloader image. When uploading image, make sure it's a transparent GIF image.

After changing the settings, Click on Save Changes button.

## 4.5| Back to Top Arrow

From Admin menu, navigate to Appearance -> GymEdge Options. Then go to General tab

Here you can find the option for enabling/disabling "Back to Top Arrow" option. Choose your preferred option

After changing the settings, Click on Save Changes button.

## 4.6| Header Search Icon

You can activate or deactivate the header search icon which is displayed beside the menu. To activate this, please go to Appearance -> GymEdge Options. Then go to Header tab. Here you can find the option.

After changing the settings, Click on Save Changes button.

## 4.7| Header Cart Icon

You can activate or deactivate the header search cart which is displayed beside the menu. To activate this, please go to Appearance -> GymEdge Options. Then go to Header tab. Here you can find the option.

After changing the settings, Click on Save Changes button.

## 4.8| Top Bar

Top Bar looks like this

To activate topbar, navigate to Appearance -> GymEdge Options. Then go to Header tab. Here you can find the options for changing top bar settings.

After changing the settings, Click on Save Changes button.

To show any menu items in top bar, please create a menu first from Appearance -> Menus Page. This is standard WordPress functionality. After that, select the menu location as "Header Top".

## 4.9| Menu

You can create menus from Appearance -> Menus Page. This is standard WordPress functionality. To display any menu on site header, please select the menu location as "Primary Menu".

To customize the menu settings, navigate to Appearance -> GymEdge Options. Then go to Main Menu tab.

From here you can change the menu display behaviour. You can set weather menu is sticky or not. You can set menu fonts and colors as well.

After changing the settings, Click on Save Changes button.

## 4.10| Multi Column Menu

Multi column menu looks like this:

To make any menu item multi column, you have to add some specific classes in the parent menu item. Here's an example:

Here i used css class mega-menu which turns the submenu items into multi column. Also i used another class hide-header which hides the title "Column 1" and "Column 2" inside menu.

NB: If you can't see the field "CSS Classes", you have to enable it first. To do this, go to the top and follow this screenshot below:

## 4.11| Footer

Footer part consists of footer widgets and copyright texts. To set up footer widgets, navigate to Appearance -> Widgets. Here you can find a widget area named as Footer. You can add maximum 4 widgets in Footer.

To change the design of Footer parts, please go to Appearance -> GymEdge Options. Then go to Footer tab. From here you can change the footer color and copyright text. If you want to disable the copyright text part, simply keep this area empty.

After changing the settings, Click on Save Changes button.

## 4.12| Typography

You can change the typography of Body and Headers. To do this, go to Appearance -> GymEdge Options. Then go to Typography tab.

After changing the Typography settings, Click on Save Changes button.

## 4.13| Contact & Socials

You can set up your contact and social info which are displayed in Top Bar. To do this, navigate to Appearance -> GymEdge Options. Then go to Contact & Socials tab.

After changing the settings, Click on Save Changes button.

## 5| Layout Settings

From here you can set default layouts for pages, blog, posts etc. You can find this settings on Appearance -> GymEdge Options and then Layout Defaults tab.

This settings is similar for all submenus under "Layout Defaults", so for convenience i'll just describe for one case (Trainer Single).

Slug: This part will be visible in URL.

Layout: You can choose various layout types for pages eg. Left Sidebar, Right Sidebar, Full Width.

Header Style: Style 1 is the default Header style. Style 2 is the transparent header. For transparent header, light logo is used.

Content Padding Top: Paddings at the top of page contents. (see image below)

Content Padding Bottom: Paddings at the bottom of page contents.(see image below)

Banner: You can enable or disable banner (see image below).

Breadcrumb: You can enable or disable breadcrumb (see image below).

Banner Background Type: You can choose weather you want a background image or background color for banner.

Banner Background Color/Image: You can select the banner background color or image from here.

## 6| Layout Settings for Individual Post Types

You can override the above settings for individual post types. For any post types (like Posts, Pages, Trainers, Classes etc), when you go to Add New or Edit page, you can find similar settings like above under the "Layout Settings" box. If you change any settings from here, this will take priority. If you choose default, settings from the GymEdge Options -> Layout Defaults (described above) will be used.

## 7| Error Page Settings

Navigate to Appearance -> GymEdge Options. Then go to Error Page Settings tab. Settings will look like this:

This part is well explained in the image below:

## 8| WooCommerce Settings

Navigate to Appearance -> GymEdge Options. Then go to WooCommerce tab. Here you'll find WooCommerce related options:

## 9| Trainer

You can add trainer from Trainers menu. For each trainer you'll see the following settings:

For displaying Trainers, we have created page builder elements for you. From Page Builder, Go to GymEdge tab, here you'll see GymEdge: Trainer element.

## 10| Class and Schedules

You can add class from Classes menu. For each class you'll see the following settings:

For displaying class and schedules, we have created several page builder elements for you. From Page Builder, Go to GymEdge tab, here you'll see GymEdge: Class, GymEdge: Upcoming Class, GymEdge: Schedule and GymEdge: Routine element.

## 11| Testimonial

You can add testimonials from Testimonials menu. For each testimonial you'll see the following settings:

For displaying testimonials, we have created page builder elements for you. From Page Builder, Go to GymEdge tab, here you'll see GymEdge: Testimonials element.

## 12| Gallery

You can add gallery images from Galleries menu. For each gallery image you'll see the following settings:

For displaying Gallery, we have created page builder elements for you. From Page Builder, Go to GymEdge tab, here you'll see GymEdge: Gallery element.

## 13| Page Builder Elements

We have created several page builder elements for you. You can find them from GymEdge tab in the page builder

## 14| Widgets

We have created following widgets for you:

When displayed, it'll look like this:

## 15| Built-in CSS Classes (Advanced)

You can use the following built-in css classes if needed:

- gym-primary-color: set primary color
- gym-primary-bgcolor: set primary background color

## 16.1| Setting up Contact Form

We are using plugin "Contact Form 7" for contact functionality. You can see their documentation for better understanding.

If you don't want to go through all the troubles to check their documentation and just want to use the default contact form we provided with this theme, please at least set up the default emails in contact form settings. (Because if you don't do that, all form submission emails will come to us instead of you). To do that, please follow the steps below:

Step 1: Navigate to Contact, and then click on Contact form 1 link.

Step 2: From this page, click on Mail tab. Here you should set your own email address where you want to receive user submitted forms. Then click on save button.

Step 3: Please submit some dummy forms from Contact page to make sure that it's working properly.

## 16.2| Creating One Page Navigation

Creating one page navigation can be done by using default wordpress functionalities. Heres the steps below:

Step 1: When creating the homepage using page builder, give an id to every row.

Step 2: When creating the menu items, use the "Custom Links" box and use that row id as menu URL.

You can watch this video for better understanding:

## 16.3| Translating Theme

You can translate this theme to another language easily. You actually have to translate two things for your website to work properly: "GymEdge" theme and "GymEdge Core" plugin. This plugin plays a major role in theme functionality, so if you don't translate this plugin along with the theme you can't be able to get the full translation.

There are many tools available for translation. But the easiest way is to use plugin "Loco Translate". Using this plugin, you can literally translate any WordPress themes or plugins if it supports translation.

--- Here's a step by step tutorial about translating any themes and plugins using "Loco Translate":

Step 1: Install and activate plugin "Loco Translate".

Step 2: Select the Theme or Plugin you want to translate from "Loco Translate" menu.

Step 3: Click on New language link.

Step 4: Select your preferred language, and also select your location as "System". Then click on "Start Translating" button.

Step 4: Click on the "Sync" button for the first time. Then start translating strings like the image below.

Here's a quick video tutorial about how to use Loco Translate:

## 16.4| Updating Theme

Occationally we provide updates which includes new features and bugfixes. Updating WordPress theme is standard WordPress functionality.

Before Updating Theme:

** Before updating please make sure to keep a backup of your installed theme and plugins (eg. GymEdge Core) to be on safe side.

You can use this plugin to keep the backup: https://wordpress.org/plugins/wp-theme-plugin-download/

There are few ways to update WordPress theme. You can follow any of the methods described below:

Method 1: Automatic Update by Using Envato Market Plugin

1. Install and activate the "Envato Market" plugin manually. Here's the plugin zip file: http://envato.github.io/wp-envato-market/dist/envato-market.zip
2. From WordPress Admin Panel, navigate to "Envato Market" menu.
3. In this page, you'll find a field for insering Envato Token. Insert your Envato Token Code from there. You can generate this code from this link: https://build.envato.com/create-token/?purchase:download=t&purchase:verify=t&purchase:list=t.Remember, while generating the token, you have to login using the same envato id which you used to purchase theme.
4. After completed the above steps successfully, Navigate to Appearance -> Themes. Here you'll see an "Update now" link beside your theme. Click on that link and your theme will be updated automatically.

Here's a quick video tutorial explaining this method:

Method 2: By Uploading zip File

1. From WordPress Admin Panel, Navigate to Appearance -> Themes.
2. Activate any other theme (eg. Twenty Seventeen) than the current one.
3. Delete GymEdge Theme.
4. Now you have to upload the updated theme zip file. To do this, Navigate to Appearance -> Themes -> Add New -> Upload. Go to browse, and select the zipped theme folder. Hit "Install Now" and the theme will be uploaded and installed.

Method 3: By FTP

1. Using your FTP client, navigate to "/wp-content/themes/" folder on your server and delete the "gymedge" folder from there.
2. Now upload the latest non-zipped theme folder into that "/wp-content/themes/" folder .

After Updating Theme:

** After updating the theme please update all plugins which come with the theme.

## 16.5| Modifying Page Builder Custom Addons

We created our Page Builder customs addons in a way so that you can customize it from your child theme if you are a developer. To do that, first you have to create a folder named as "vc-custom-addons" inside your child theme.

Our custom addons are located in the "vc-modules" directory inside GymEdge Core Plugin. For every custom addon, there is one Class file and one or several View files. Class files are located under "vc-modules" directory and View files are located under "vc-modules/views" directory.

If you want to modify any Class file, just copy that Class file into "vc-custom-addons" directory of your child theme, and rename it as [file name]-class. And if you want to modify any View file, copy it into "vc-custom-addons" directory and rename it as [File Name]-view. After that you can make changes inside those files.

Example: For GymEdge:Routine Addon we have created "gymedge-core/vc-modules/routine.php" Class file and "gymedge-core/vc-modules/views/routine.php" View file, like this:

To modify those files in child theme, all you have to do is create a folder "vc-custom-addons" in your child theme, copy those 2 files in there as "vc-custom-addons/routine-class.php" and "vc-custom-addons/routine-view.php" respectively and then you can modify them.

## 17.1| Demo Content installation failed

This is a hosting issue. In most hostings demo installation will work fine. But some hostings block certain permissions which may cause this issue. If this happens to you, you can contact your hosting provider or alternatively send a support request to support@radiustheme.com and we will help you to fix this.

## 17.2| 404 Error in all pages

If you face this type of issue, please update your permalink. To update permalink, navigate to Settings -> Permalink and then click on Save Settings button.

## 18| Contact

If you face any issue, please contact at support@radiustheme.com

Thank you for purchasing our theme.