Modern and elegant multipurpose theme
Created: 11/04/2017
Last Update: 10/10/2021
By: AthenaStudio
E-mail: [email protected]

Table of Contents

  1. Directories
  2. Installation
  3. WPBakery in Portfolio
  4. Theme Options
  5. Site Sections
  6. Setup Front Page
  7. Import Demo Content
  8. Blog Page
  9. Separate Page
  10. Create New Project
  11. Reorder Projects
  12. Primary Menu
  13. WooCommerce
  14. Contact Form 7
  15. How to Translate
  16. Twitter Feed
  17. Google Maps

A) Directories

royal - Contains theme files.

help – Help file (HTML).

licensing – GPL descriptions.

psd – Preview PSD file.

B) Installation

Current documentation was created to help you with quick installation and configuration of Royal theme. Please, read it carefully to avoid most of potential problems with incorrect configuration.

To install this theme you must have a working version of WordPress already installed.

For detailed Wordpress installation instructions visit

Download the zipped package from ThemeForest and extract to your desktop. In the extracted package you will find file which is the WordPress theme.

You can install the theme in two ways:

Once you have activated the theme you will need to change some of the pages and media settings for optimal performance.


After that, check required plugins on Appearance / Install Plugins:

Then, import sample data automatically via Appearance / Import Demo Data.

Or, import sample data manually (royal/demo/royal.wordpress.xml) at Tools / Import / WordPress (If not installed, press "Install Now"). Click on Run Importer. (You can load sample images by ticking the field in the opening page.)

In 3rd step, if you imported the data manually, open Site Sections. Click on Import & Export Sections button. Select (royal/demo/royal.sections.json) to import.

In 4th step, go to Settings / Reading. Select "A static page (select below)" and select Front Page as Header Style - Image Slideshow.

In 5th step, go to Appearance / Menus. Click on Manage Locations and select Main Menu as Primary Menu.

Finally, visit and follow steps to create a Google Maps JS API key. Then, open Royal / General option. Copy the key into Google Maps JavaScript API Key field and Save.

C) Enable WPBakery Page Builder in Portfolio

Firstly, select WPBakery Page Builder / Role Manager from WordPress menu on the left.

Then, choose Post types field as Custom and check portfolio.

Finally, click on Save Changes button at the bottom.

D) Theme Options

After the installation you can make your own settings. Please, open Royal (Theme Options) and make site-wide settings:

Theme Options

E) Site Sections

The template uses sections to generate front page. Go to Site Sections you will see a panel where you can create new sections.

Create a few, select needed types and fill required data. Drag-and-drop feature allows to sort sections.

After editing, click Save Sections.

Site Sections

F) Setup Front Page

Create a new page Pages > Add New based on the Front Page template, then click on the Publish.

Once page will be reloaded, you need to select the Section Type and enter some data.

Then click on the Update for saving changes.

Go to Settings > Reading and set the new page as front page.

Setup Front Page

G) Import Demo Content

If you want to have the same website as Live Preview of theme, you’ll need to import demo content.

There're 2 ways to import demo data:

1. One Click Demo Import

Import Demo Data

2. Import Demo Data Manually

Import XML

Import/Export Sections

Import/Export Sections

H) Blog Page

Create a blog page:

Select an Archive Pages Layout. Go to Royal > Layout Settings.

Blog Page

I) Separate Page

Creating pages is nothing new if you have even basic experience with WordPress.

We offer a few additional options in editor. Below editor you’ll find an additional metabox: Visual Subtitle.

Separate Page

J) Create New Project

Creating project is nothing new if you have even basic experience with WordPress and is similar to posts. You can create portfolio project which will your images or video clip. Fill the content and don’t forget to set Featured Image.

Create New Project

K) Reorder Projects

To move a Project, place the cursor over the block. Depending on your browser, the cursor will change to show a Hand or a Move icon. Drag and drop the block on top of another block to place it above that block.

Reorder Project

L) Primary Menu

Royal supports custom WordPress menu. Navigate to WP Admin Appearance > Menus page and create menu. Select the newly created menu from the theme locations dropdown box Main Navigation as it mentioned on screenshot and press Save button.

Primary Menu

M) WooCommerce

Royal requests to install WooCommerce after theme setup.

After installing & activating WooCommerce, you can click on skip store details.

After importing demo data remove duplicate Cart, Checkout, My account and Shop pages which don't have info text on the right side or didn't set by WooCommerce.

If you want to install WooCommerce manually follow these steps:

At 1st, install WooCommerce plugin by Plugins > Add New. Search for WooCommerce. After finding it, Install & Activate the plugin.


After installing it, you can import sample products by opening Products > All Products. Click on Import button. Then, unzip and select royal/demo/royal.products.csv which is included in the main zip file. Then, click on Continue to start data import.


Finally, you can add Shop page to Primary Menu by Appearance > Menus.

N) Contact Form 7

Open Contact > Contact Forms. Edit the 1st contact form. Copy following HTML code to Form field.

<div class="field">
	[text* your-name placeholder "Name"]
<div class="field">
	[email* your-email placeholder "Email"]
<div class="field">
	[text* your-subject placeholder "Subject"]
<div class="field">
	[textarea your-message placeholder "Message"]
	[submit class:btn class:btn-default "Send Message"]

Then, edit Contact page. Remove if there's old shortcode of contact form and add Contact Form 7 shortcode by clicking on + button.


O) How to Translate

The translation file you can find in languages folder (/wp-content/themes/royal/languages). Edit the .po file using POEdit, use the translation field to make replacements. Read here how to do it right.

From the file menu, save file with your language name e.g de_DE.po into languages folder. It will generate both a *.po and *.mo file for your translation.

Next edit wp-config.php located in the root folder of wordpress and define the WPLANG prefix with your language name which should be similar to the translation file name.

P) Twitter Feed

The template comes with a twitter feed section to display the last tweet from you twitter account. By default, it's set the twitter feed the display my own twitter feed for the preview purposes. To change the twitter feed to display your own feed, open Twitter Feed page. You'll find this line:

[twitter-feed account="AthenaStudio87" limit="8"]

You only have to change the username to yours.

Important note: Since Twitter requires every request to be authenticated due the new version 1.1 of twitter API, it needs some private informations and settings. I recommend that you open the index.php file in the twitter folder and fill in with your own API settings. You can create a Twitter app here:

When you create your twitter app here you get this information under My applications tab.

Q) Google Maps

Please, get an API key here:

After you get the Google Maps JavaScript API, write it to Google Maps JavaScript API Key field in Royal / General theme option.