leisure documentation

49
Thank You For Purchasing Leisure - Hotel, Resort & Spa WordPress Theme! You can read below a comprehensive guide with detailed instructions about the Leisure WP Theme functionalities. Each section is carefully explained, using helpful screenshots and videos when necessary. It contains everything you need to have your theme up and running in no time. Leisure WordPress Theme v.1.0 Documentation Version: 1.0 Author: Curly Themes

Upload: eli-vargas

Post on 11-Jan-2016

28 views

Category:

Documents


0 download

DESCRIPTION

Wordpress

TRANSCRIPT

Page 1: Leisure documentation

Thank You For Purchasing Leisure - Hotel, Resort & Spa WordPress Theme!You can read below a comprehensive guide with detailed instructions about the Leisure WP Theme functionalities. Each section is carefully explained, using helpful screenshots and videos when necessary. It contains everything you need to have your theme up and running in no time.

Leisure WordPress Theme v.1.0Documentation Version: 1.0Author: Curly Themes

Page 2: Leisure documentation

1. Table of Contents

Free Support

Installing the Theme

Theme Requirements

WordPress Theme Upload

FTP Theme Upload

Activating the Theme

Migrating From another Theme

Importing the Demo Content

How to Update the Theme

Quick Theme Setup

Theme Options

General Options

Header Options

Typography

Color Settings

Retina & Icons

Custom Code

Backup & Restore

Setting up the Pages

Setting up the Homepage

Setting up the Blog

Setting up the Contact Page

Visual Composer

Revolution Slider

Ninja Forms

Simple Weather

Individual Page Settings

Contact Details

Page Title

Header Options

Page 3: Leisure documentation

Background Options

Setting up the Sidebars

Setting up the Menus

Setting up the Secondary Navigation

Plugin Integration

CSS & JS Files

Child Theme

Translating the Theme

2. Free Support

We provide Free Customer Support for all Curly Themes productsthrough our quick and easy ticket application interface. Please limityour inquiries to problems related to the theme, its setup andfeatures. For any problems concerning third-party plugins youshould address the application’s developer.

Note: We can not offer support for custom CSS codecustomization. You should ask a professional developer for aid ifyou require help with advanced customization andprogramming.

Free Ticket Support

Curly Themes offers a free ticket support application for all clients,through a real-time purchase code automatic verification. Thededicated app is fast and easy to use and includes an emailnotification feature. We will let you know as soon as your inquiry hasreceived an answer. Thanks to our modern design, you can alsoupload images as an attachment to your support ticket.

Before writing a ticket please get your License Certificate:

Page 4: Leisure documentation

Before opening a new ticket, please make sure you have readthrough all our documentation and watched the video tutorials.Also, our Knowledge Base !! contains helpful answers to questions

we often receive from our customers. Following these steps is in theusers’ interest, as they will save valuable time. Still, we are alwayshappy to respond to any inquiries you may have related to ourtheme.

Create Support Ticket Knowledge Base

3. Installing the Theme

Before installing this theme you need to have a WordPress platformalready installed on your server. You can download it from WordPress.org ! if you don’t have it already.

If you do not know how or you have problems with the installation,you can access helpful information at:

WordPress Codex !

WP101 Basix Traning Video !

WordPress FAQ !

Once you have a working WordPress on your server, you have twoavailable ways to install this theme.

Page 5: Leisure documentation

3.1. Theme Requirements

The theme needs to be hosted on a server that is running WordPress4.0 or higher, PHP5 or higher, and MySql 5 or higher. Our WordPressTheme has been successfully tested with Mac, Windows and Linux.Also, to ensure that your experience is 100% safe, please follow thebelow checklist:

Make sure that your server is allowing WordPress to operatenormally; some servers restrict WordPress functions, causingpotential problems.

Please be sure to operate the latest version of WordPressavailable. To download the latest version of WordPress, youneed to go to the official WordPress.org ! website.

Please make sure that you are using the latest version of thetheme. To download the latest version of theme, you need togo to your Theme Forest ! account, under

the Downloads tab.

3.2. WordPress Theme Upload

Step 1 – Login to WordPress Dashboard

Step 2 – Go to Appearance > Themes > Add New

Step 3 – Click Upload and select the file leisure.zip from yourcomputer, after this click the Install Now button.

Page 6: Leisure documentation

Step 4 – Wait for the theme to be installed. Once installed, you willbe notified.

Warning: Please make sure that you upload the leisure.zip fileand NOT the pack.zip file!

3.3. FTP Theme Upload

Step 1 – The .zip file you downloaded from Theme Forest contains afolder named leisure

Step 2 – Upload this folder on your server in your WordPressdirectory to /wp-content/themes/

Note: We recommend that you use FileZilla FTP client.

3.4. Activating the Theme

After you have completed the install process, in either of the twoways, you need to activate it.

Step 1 – Log in to the WordPress Dashboard.

Page 7: Leisure documentation

Step 2 – Go to Appearance > Themes and select Leisure.

Step 3 – Click the Activate button and you can start using the theme.

Step 4 – It is recommended that you install the theme bundledplugins:

Visual Composer brings nice features such as shortcodes,widgets and other cool functionality

Revolution Slider is a premium slider, provided along with thetheme, for gorgeous showcasing

Ninja Forms is one of the top form creation plugins forWordPress

Simple Weather is a cool, lightweight plugin to display theweather in WordPress

Page 8: Leisure documentation

3.5. Migrating From another Theme

If you want to migrate your website from another WordPress themeto the Leisure theme, you need to resize the thumbnails using theRegenerate Thumbnails plugin. Go to Regenerate Thumbnails Plugin ! to download the plugin and follow

all the required steps. Also, do not forget to adapt the shortcodes.

3.6. Importing the Demo Content

In the Leisure download package you can find the Demo XML file(located in the demo content folder) that you can use for a quicktheme set up. Images, videos and sliders are not included in theXML file.

To import the demo XML file, in the WordPress dashboard goto Tools > Import and select to install from the list WordPressImporter. After the installation is complete, select and upload theXML file. You can find it in the demo XML file in the demo contentfolder at root level in the Leisure download package. in the democontent folder you will find three folders: ninja forms, revolutionslider and wordpress xml data, each of them with it’s relevant democontent. The process can take up to a few minutes.

Page 9: Leisure documentation

After the import process, go to Appearance > Menus and fromthe Manage Locations tab, use the Main Menu select box to choosethe Main Menu option. Click the Save Changes button to record thechanges.

After this go to Settings > Reading and from the A static page radiobutton, use the Front page select box to choose your home andthe Posts page select box to choose the page for your blog.

Problems Importing the XML File?

Note: If you have a problem loading the XML file, it might becaused by host limitations. You need to uncheck the Downloadimages and attachments box to upload only your pages andposts.

3.6.1. Importing the Demo Contact /Booking Forms

To import a form used in the demo, you need to go to yourDashboard and then to Forms > Import / Export and select one ofthe demo forms located in the demo content folder, in the ninjaforms folder, which contains all the forms used in the demo.

Page 10: Leisure documentation

Available demo forms:

Get in touch with us!

Golf Course Reservation

Playground Reservation

Restaurant Reservation

Room Booking

Tennis Court Reservation

Water Sports Reservation

3.6.2. Importing the Demo Sliders

To import the slider used in the demo, you need to go toyour Dashboard and then to Revolution Slider, click on ImportSlider on the right side of the screen and select the demo sliderlocated in the demo content folder, in the revolution slider folder,which contains the slider used in the demo.

Page 11: Leisure documentation

Available demo slider:

Home Slider

3.7. How to Update the Theme

Important: Before updating it is important to know that themesettings and content are not lost during the update process. Youwill lose changes to the theme files, if you changed any files. Inorder to prevent losing the file changes, we stronglyrecommend that you use child themes. Also, we recommendthat you look in the release notes before updating.

The theme update can be done via FTP or via WordPress. Themeupdate can be done automatically or manually, depending on themethod you prefer. Both methods are presented below as follows:

3.7.1. Auto-Update

Auto-Update can be done directly from the Themes panel in yourWordPress Dashboard.

Page 12: Leisure documentation

Step 1 – To do this, you first need to set-up your Theme ForestUsername & API Key in the special boxes, located at Appearance >Theme Options > General > Theme Forest Username & API Key.

Step 2 – To generate an API key, you need to login to your ThemeForest account and go to Settings > API Keys. Enter a label (ex:theme update) and hit the Generate API Key button.

3.7.2. Manual Update

Manual Update can be done via FTP or via WordPress. No matterwhat method you choose, you first need to download the new themefiles from Theme Forest. To download the new files, you need tofollow these steps:

1. Login to your Theme Forest account, go to Downloads andsearch for Leisure - Hotel, Resort & Spa WordPress Theme inyour downloads list.

2. Click on the download button and choose the files you wish todownload. You can either download the Installable WordPressTheme (this consists only of the theme files needed for update)or the Main Files package.

3. Now, based on your choice of install options, follow themethod you prefer most:

Manual Theme Update via FTP

1. Login to your FTP account and go to Wp-content > Themes.Delete the old folder called leisure.

2. Unzip the new update previously downloaded. If youdownloaded the Installable WordPress Theme, you will needonly to unzip this file. If you downloaded the Main Files, youfirst need to unzip the Main Files, then you need tounzip leisure.zip

3. Upload the leisure unzipped folder to your Wp-content >Themes folder.

Page 13: Leisure documentation

Manual Theme Update via WordPress

1. Login to your WordPress dashboard and head overto Appearance > Themes and deactivate Leisure

2. Delete the old Leisure theme.3. Upload the new theme file. You can either upload

the Installable WordPress Theme or unzip the MainFiles package and upload the leisure.zip file.

4. After uploading, activate Leisure and you are done!

4. Quick Theme Setup

After installing the theme, the recommended plugins

and the demo content, it is best that you configure

your theme to your desire. Please follow the next

steps for a quick setup:

4.1. Quick Theme Customization

From your Dashboard, head over to Appearance > Customize andstart customizing the theme. Here is a short description of allsections and fields:

Page 14: Leisure documentation

4.1.1. Site Title & Tagline Section

Site Title – Enter your site title. Default: Leisure

Tagline – Enter your left tagline. Default: [icon icon=map-marker] ST. ANDREWS, SCOTLAND

Right Tagline – Enter your right tagline. Default: [simple-weather days=2 location=”Bucharest, Ro” units=metric]

4.1.2. Site Logo Section

Logo – Upload your logo here. Default: none

Retina Logo – Upload your retina logo here. Your retina logoshould be double size than your normal logo. This will ensurethat your logo will look crystal sharp on retina devices. Default:none

4.1.3. Colors Section

Page 15: Leisure documentation

Background Color – Choose your background color. Default:#FFFFFF

Text Color – Choose your text color. Default: #667279

Link Color – Choose your link color. Default: #363D40

Primary Color – Choose your primary color:Default: #C0392B

4.1.4. Header Image Section

Leisure uses header images. The minimum size for the header imageis 1600 x 400 pixels. By default, the theme has no header image anduses the link color as background. This is a global setting and willaffect all pages. Alternatively, you can have more images and displaythem randomly.

Important: The global header images can be overridden byHeader Slider or by Individual Page Settings.

4.1.5. Header Slider Section

Before being able to set a header slider, you first need to create /import one from the Revolution Slider menu. After creating orimporting a slider, select the header slider from the Header Sliderfield. By default there is no header slider set.

Important: If you set-up a header slider, all header images willbe overridden except the individual page settings.

Page 16: Leisure documentation

view raw

view raw

view raw

4.1.6. Footer Section

Footer Columns – Choose the number of footer columns.Default: 6Footer Text Widget #1:

Leisure WP - Footer Text Widget #1 hosted with ❤ by GitHub

Footer Text Widget #2:

Leisure WP - Footer Text Widget #2 hosted with ❤ by GitHub

Copyright Text – Enter your copyright text. Default:

Leisure WP - Footer Text Widget hosted with ❤ by GitHub

4.1.7. Background Image Section

In this section, you can choose to upload a custom background imagefor your website. Default: none

4.1.8. Navigation Section

Main Navigation – Choose your main navigation. You cancreate one from Appearance > Menus. Default: all pageslisting

1234

[icon icon=map-marker] St Andrews Scotland, United King [icon icon=phone] +44 (0) 1334 837000[icon icon=mobile] +44 (0) 1334 837099

1 <img src="http://leisurewp.com/wp-content/uploads/2014/

1 Leisure - HTML Template. Designed with special care by <

Page 17: Leisure documentation

Secondary Navigation – Choose your secondary navigation.You can create one from Appearance > Menus. Default: none

Enable Main Menu Sticky – When you scroll down on a page, amenu will remain sticky at the top of the page

Enable Search in Main Menu – Choose this if you want thesearch icon to be placed as a last menu option in you mainnavigation

4.1.9. Widgets Section

From this section you can customize the theme widgets.

4.1.10. Static Front Page Section

Front Page Display – Choose how your front page should look.Available choices are: Your Latest Posts or A Static Page.Default: Your Latest Posts

Front Pages – Choose your front page. Default: none

Posts Page – Choose your posts page. Default: front-page

Page 18: Leisure documentation

5. Theme Options

Before you start to configure the theme’s options, you

should go to Appearance >Theme Options in the

WordPress Dashboard. Switch to default values by

clicking either the Quick Save button at the top right,

or the Save Options button at the bottom of the

page.

5.1. General Options

In the General section you can configure general options that applyto all pages such as:

Disable Animations: Use this slider to toggle between ananimated layout or not.Animations are active by default.

Hide Comments on Pages: The comments are by default activefor pages. Use this slider to toggle the comments for pages. Ifyou turn the slider on, the comments will be hidden for pages.

Description Excerpt Size: Type in the number of words to beused in the description excerpt for each article in the blog

Page 19: Leisure documentation

listing

Hide Author Box: Check this box to hide the author box for theblog articles.

Sharing Box Title: Here you can type in the text that willappear in the box next to the sharing buttons.

Hide Sharing Box on Pages: The sharing box is default for blogarticles. Use this slider to toggle the sharing box for normalpages. If you turn the slider on, the sharing box will be hiddenfor normal pages.

Hide Sharing Box on Posts: Check this box to hide the sharingbox for the blog articles.

Theme Forest Username: Here you can type in your ThemeForest Username in order to get automatic theme updates.

Theme Forest API Key: Here you can type in your ThemeForest API Key in order to get automatic theme updates. Togenerate an API key you need to login to your Theme Forestaccount, and go to Settings > API Keys. Enter a label (ex:theme update) and hit the Generate API Key button.

Google Analytics ID: Type in your Google Analytics ID.

Google Webmaster Tools Site Verification: Type in theverification code for the Google Webmaster Tools

Note: Both Theme Forest Username & API Key need to be filledin to get auto-updates for the theme.

Page 20: Leisure documentation

5.2. Header Options

In this section you can customize the website header using thefollowing options:

Header Height: Here you can choose the height of yourheader.

Header Alignment: Here you can choose the menu position.

Text Color: Here you can choose the text color for your header.

Background Color: Here you can choose the color shading foryour header.

Header Opacity: Use the slide bar to drag to the value for theopacity color shading header. Default is 15.

5.3. Typography

In this section you can customize the typography settings using thefollowing options:

General Typography: Select the general font family, font style,font variant and font size for the website.

Include Special Characters: If you wish to use a subset for

Page 21: Leisure documentation

special characters you can select one here. Make sure the fontsyou use on the website support these special characters.

H1 Typography: Select the font family, font style, font variantand font size for the H1 heading.

H2 Typography: Select the font family, font style, font variantand font size for the H2 heading.

H3 Typography: Select the font family, font style, font variantand font size for the H3 heading.

H4 Typography: Select the font family, font style, font variantand font size for the H4 heading.

H5 Typography: Select the font family, font style, font variantand font size for the H5 heading.

H6 Typography: Select the font family, font style, font variantand font size for the H6 heading.

Blockquote Typography: Select the font family, font style, fontvariant and font size for the blockquotes.

Menu Typography: Select the font family, font style, fontvariant and font size for the menu.

Secondary Menu Typography: Select the font family, fontstyle, font variant and font size for the secondary menu.

Page 22: Leisure documentation

5.4. Color Settings

In this section you can choose the general colors for your websiteand its elements like Text, Hyperlinks, Headings, Menu, Header,Social Icons, Absolute Menu, Footer or Absolute Footer.

The Primary Color option will affect major graphical websiteelements. You can go to Appearance > Customize for global colorchanges.

Page 23: Leisure documentation

5.5. Retina & Icons

In this section you can configure the following additional options:

Favicon: Upload an image from your computer to use it asa 16px * 16px favicon.

iPhone Icon Upload: Upload an image from your computer touse it as a 57px * 57px icon for iPhones.

iPad Icon Upload: Upload an image from your computer to useit as a 72px * 72px icon for iPads.

iPhone Retina Icon Upload: If you want to use an iPhoneretina icon, you can upload one here.The icon needs to be 114px * 114px.

iPad Retina Icon Upload: If you want to use an iPad retina icon,you can upload one here.The icon needs to be 144px * 144px.

Page 24: Leisure documentation

5.6. Custom Code

In this section you can configure some custom code:

Custom CSS: If you want to use additional code, you can inserthere your custom CSS code.

Code before closing head / body: If you want to use additionalcode, you can insert here your custom code, either beforeclosing the head or the body.

Page 25: Leisure documentation

5.7. Backup & Restore

In this section you can Backup & Restore your theme settings.

Export & Import – To backup your settings just copy to clipboardyou Export Options field and paste it somewhere safe. If you want torestore your options just paste any code previously exported.

Reset Options – You can reset your theme options by clicking ResetOptions

6. Setting up the Pages

To create pages for your website you should login to

your WordPress Dashboard and go to Pages > AddNew. It is strongly recommended to use a Page

Template for your pages, as you will take advantage of

the integrated features. For example, a Contact Page

Template will offer customized features for Contact

pages.

Page 26: Leisure documentation

Leisure WP Theme comes bundled with Visual Composer a greatand cool method build pages easy, fast and with a lot of features. Inconjunction with the Visual Composer you can use Shortcodes fordifferent features and CSS Classes for styling.

6.1. Shortcodes

6.1.1. Icon Shortcode

Use this shortcode to display a nice Font Awesome vector, crystalsharp icon.

[icon icon=home size=2x boxed=yes color=white background=red]

icon – All FontAwesome icon names. You can find the completeicon list available here: http://fortawesome.github.io/Font-Awesome/icons/ !

size – Choose the size of your icon. Available values are: 2x, 3x,4x, 5x. Default: none

boxed – Choose if you want your icon to be boxed. Availablevalues are: yes / no. Default: none

color – Enter the color name or color hex code for the iconcolor. Default: text color

background – Enter the color name or color hex code for theicon background color. Default: none

6.2. Quick CSS Classes

Here is a list of some CSS classes that you can use on your pages toget the look you are going for.

Page 27: Leisure documentation

6.2.1. Text Classes

text-left – Aligns the text to the left

text-center – Aligns the text to the center

text-right – Aligns the text to the right

text-justify – Aligns the text by justifying

text-uppercase – Converts the text to uppercase

text-lowercase – Converts the text to lowercase

text-capitalize – Capitalizes the text

6.2.2. Padding Classes

content-padding – Adds a top and bottom padding of 56pixels to the element

content-padding-none – Adds a top and bottom padding of 0pixels to the element

content-padding-xs – Adds a top and bottom padding of 32pixels to the element

content-padding-lg – Adds a top and bottom padding of 98pixels to the element

content-padding-xl – Adds a top and bottom padding of 140pixels to the element

content-padding-xxl – Adds a top and bottom padding of 154pixels to the element

content-padding-mobile-none – Adds a top and bottompadding of 0 pixels to the element on mobile devices

6.2.3. Background Classes

white-box – Adds a white background of 85% opacity. It has nopadding by default. In conjunction with classes content-padding and content-padding-xs it will add top bottom, left,and right padding of 56 pixels and 32 pixels respectively.

white-box-mobile – Adds a white background of 85% opacityfor mobile devices

background-none-mobile – Removes any background imagefor mobile devices

Page 28: Leisure documentation

6.3. Page Templates

When creating a page, you can choose the desired template from thePage Attributes menu, on the right.

Click on the select box Template to see all the page templatesavailable:

Default Template

Coming Soon Page

Contact Page

Contact Page 2

Page With Left Sidebar

Page With Left Right

Fullwidth Page

Select the Default Template option if you do not want to use a pagetemplate.

6.4. Setting up the Homepage

Go to Page Attributes > Template > Default Template to select thetemplate for your homepage. The Leisure - Hotel, Resort & SpaWordPress Theme comes with a pre-designed layout that can beused through shortcodes in a flexible manner, giving you a lot offreedom in building your homepage.

If you choose to use the pre-designed layout, you need to copy andpaste the home page demo code into the HTML (Text) Tab editor ofyour page. You can see the home page demo code of our pre-designed layout below. You can also use the shortcode icons inthe Visual Editor, see chapter Shortcodes for more details.

It is strongly recommended to take a look at the Individual PageSettings located under the page content area.

6.4.1. Choosing the Home Page

Page 29: Leisure documentation

After you create the page, you should configure it as your homepage.

Go to Settings > Reading and click on the A Static Page radio button.Click the Front Page select box and choose your home page.

The Posts Page select box is where you can choose the page for yourblog.

6.5. Setting up the Blog

Create a new page with a name of your choice and select the DefaultTemplate from the Page Attributes menu, on the right.

6.5.1. Create the Blog Page

Set the page as your blog by going to Settings > Reading and select itfrom the Posts Page select box.

After this, you are ready to start populating with blog posts.

To create a new post, go to Posts > Add New, type in a title andinsert the content in the designated field.

Page 30: Leisure documentation

6.5.2. Choosing the Category & Tags

Assign a category to your post using the Categories box on the right.Click on + Add New Category to create a new one.

You can assign one or more categories to a post by checking the boxnext to the Category name.

You can also assign tags by using the Tags box below. Insert the tags,separated with commas, in the dedicated field and click on Add.

6.5.3. Setting up a Featured Image

To set a Featured Image for your blog post click on Set featuredimage in the Featured Image box, below Tags. Choose an image fromthe Media Library or upload a file from your computer and click onSet featured image.

It is strongly recommended to take a look at the Individual PageSettings located under the page content area.

After you are happy with the title, post content, categories, tags,featured image and everything else, click Publish and your post willappear on your blog page.

Page 31: Leisure documentation

6.6. Setting up the Contact Page

Create a new page with a name of your choice and select the ContactPage Template, from the Page Attributes menu on the right. You canchoose the desired template from Contact Page Template.

6.6.1. Contact Details

Under the contact page content area you can configure the ContactDetails using the following options within the Individual PageSettings Box:

Side Content: The Side Content is the secondary column of thecontact page. You can insert content just like for the main page.

Map Coordinates Latitude / Longitude: Enter the latitude andlongitude coordinates so the map will show your desiredlocation.

Map Type: Choose one of the four map types available. Defaultis set to roadmap.

Map Height:Enter the height of the map in pixels. Default is setto 500.

Map Level Zoom: Enter the zoom level of the map. Default isset to 15

It is strongly recommended to take a look at the Individual PageSettings located under the page content area.

Page 32: Leisure documentation

6.7. Visual Composer

Visual Composer is a very unique plugin, it will help

you manage your content for the WordPress sites

and create stunning layouts, in a few minutes, without

coding. Nowadays, many websites have complex grid

layouts with columns, tabs, sliders etc. In the past, to

create that type of layouts you had to be a HTML

guru or a Shortcodes operator ninja.

Page 33: Leisure documentation

But not anymore! We have prepared a short video to

get you up and running in no time. See for yourself

how easy it is to create and manage complex layouts

combined with professionally designed plugins made

easy!

Visual Composer Documentation

Curly Themes Visual Composer Extension

The Curly Themes Visual Composer Extension consists in bringingmore options to the existing elements and register newelements that are located in the Curly Themes Extension tab, in theelements window. We have enhanced Visual Composer byeliminating some elements and parameters and added new ones.

The extended elements are: Row, Image Gallery, ImageCarousel, Tabs, while the new elements are: ServicesList, Testimonials Carousel, Services Carousel, IsotopeGrid, FontAwesome Icon, Booking Form, Ninja Form, Ninja ModalForm.

6.8. Revolution Slider

Page 34: Leisure documentation

Create a responsive (mobile friendly) or fullwidthslider with must-see effects while meanwhilekeeping or building your SEO optimization (allcontent always readable for search engines). Seethe heaps of custom transitions/animations foreach object on the page! Customize this slider withour convenient drag&drop backend to your veryneeds.

This plugin features tons of unique transition effects,

an image preloader, video embedding, autoplay that

stops on user interaction and lots of easy to set up

options to create your own effects.

Revolution Slider Documentation

6.9. Ninja Forms

Ninja Forms is the ultimate FREE form creation

solution for WordPress. Build WordPress Forms

within minutes using Ninja Forms powerful forms

creation page. It allows you to easily and quickly

design complex forms through a drag and drop

interface and absolutely no code. But for you

developers it has a ton of hooks and filters so you can

do absolutely anything with this powerful form

building framework.

Using Ninja Forms

FAQ & Troubleshooting !

Page 35: Leisure documentation

Installing/Updating Ninja Forms and Extensions !

Notifications (New In Version 2.8) !

Settings !

Shortcodes !

About Support !

6.10. Ninja Forms Extension

We have extended the great Ninja Forms plugin by adding newfeatures so that you will enjoy using it more. If you are looking foreven more extensions for Ninja Form they have a very cool extensionmarketplace, that you can visit here: Ninja Form Exntesions Marketplace !

6.10.1. Ninja Forms Layout Tab

We have created a new tab called Form Layout available for eachform. In this tab you can very easily arrange your form fields on up tofour columns. It works very simple. To arrange your form you need tofollow the next steps:

Step 1 – Each field has a sizing box on the right side of the box. Sizingworks like this:

1/1 is a full width box

1/2 is a half width box. Two 1/2 boxes will have room next toeach other

1/3 is a one third width box. Three 1/3 boxes will have roomnext to each other

2/3 is a two thirds width box. One 2/3 box will have room nextto a 1/3 box

1/4 is a one quarter width box. Four 1/4 boxes will have roomnext to each other. Two 1/4 boxes will have room next to a 1/2box

2/4 is a two quarters width box. Same size as the 1/2 box

3/4 is a three thirds width box. One 3/4 box will have roomnext to a 1/4 box

Page 36: Leisure documentation

Step 2 – Drag the fields around to arrange them how you want. Makesure they fit next to the items you want to place them

6.11. Simple Weather

Simple Weather is a beautiful weather plugin that displays theweather via shortcode or via widgets. Add a simple but very usefulfeature to your website with this stylish plugin. Your visitors willknow right away how to plan their schedule, happy to know theweather is on their side. Simple Weather is based onOpenWeatherMap.org.

6.12. Weather Shortcode

[simple-weather location="London, Uk" latitude="" longitude="" days="2" night="no" units="internal" date="l" ]

Location: Choose the location for the weather display

Latitude & Longitude: Coordinates of a location that cannot befound by name. Use decimal coordinates (ex: 43.343 &12.4543)

Days: Choose the number of days to forecast. Max 14

Page 37: Leisure documentation

Night: yes / no. Choose to display the night temperature or not.

Units: imperial / metric / internal. Default is internal (auto).Imperial = F, Metric = C

Date: Date format according to: http://php.net/manual/ro/function.date.php !

6.13. Weather Widget

Title: Choose widget title. If no title is entered, the location ofthe weather will be displayed.

Location Type: Choose the location type. Location /Coordinates

Location: Choose the location for the weather display

Latitude & Longitude: Coordinates of a location that cannot befound by name. Use decimal coordinates (ex: 43.343 &12.4543)

Units: imperial / metric

Days: Choose the number of days to forecast

Language: Choose the language of the weather description (ex:Mostly Cloudy)

Background Color: Choose the background color of the widget

Text Color: Choose the text color of the widget

¹ Available languages: English, Spanish, Italian, French, German,Russian, Ukrainian, Portuguese, Romanian, Dutch, Polish, Finnish,Turkish, Bulgarian, Swedish, Chinese Traditional, Chinese Simplified

7. Individual Page Settings

The Individual Page Settings box is a collection of

features that take customization to a new level. Our

Individual Page Settings box consists of: Contact

Details, Page Title, Header Options and Background.

Page 38: Leisure documentation

7.1. Contact Details

Under the contact page content area you can configure the ContactDetails using the following options within the Individual PageSettings Box:

Side Content: The Side Content is the secondary column of thecontact page. You can insert content just like for the main page.

Map Latitude & Longitude: Enter the latitude and longitudecoordinates so the map will show your desired location.

Map Type: Choose one of the four map types available. Defaultis set to roadmap.

Map Height:Enter the height of the map in pixels. Default is setto 500.

Map Level Zoom: Enter the zoom level of the map. Default isset to 15

Page 39: Leisure documentation

7.2. Page Title

Under your page content area you can configure the Page Title usingthe following options within the Individual Page Settings Box:

Page Subtitle: Enter the page subtitle. Default: none

Hide Page Title: Choose to hide the page title. Default:unchecked

Header Alignment: Choose how to align the header. Default:left

Page Title Color: Choose the page title color. Default: themedefault (white)

7.3. Header Options

Under any page or post content area you can configure the HeaderOptions using the following options within the Individual PageSettings Box:

Header Image – Choose your custom header image. Default:global image / slider

Header Slider – Choose your header slider. This will overrideany other header setting. Default: none

Header Height – Choose the header height. Available optionsare:

Default – Theme default height. Default: 370px

Match Image – Match the header image height

Page 40: Leisure documentation

Match Slider – Match the header slider height

Fixed Height – Fixed height

Fixed Header Height – Choose the header height

Header Background Color – Choose the header backgroundcolor

Header Background Color Opacity – Choose the backgroundcolor opacity

Note: Customization made in this section will only be applicableto this specific page or post. This option will override thegeneral website header options

7.4. Background Options

Under any page or post content area you can configurethe Background Options using the following options withinthe Individual Page Settings Box:

Background Color - The background color for your page / post

Background Image – The background image for your page /

Page 41: Leisure documentation

post

Background Position – The background image position;accepted values are standard CSS3 values; See details about CSS3 Background Position !

Background Repeat – The background image repeat method;accepted values are standard CSS3 values; See details about CSS3 Background Repeat !

Background Size – The background image size; acceptedvalues are standard CSS3 values; See details about CSS3 Background Size !

Background Attachment – The background attachmentattribute; accepted values are standard CSS3 values; Seedetails about CSS3 Background Attachment !

Note: Customization made in this section will only be applicableto this specific page or post. This option will override thegeneral website background options

8. Setting up the Sidebars

Page 42: Leisure documentation

The Leisure theme offers you the possibility to create

as many custom sidebars as you want, on any page, as

long as the page template allows sidebars.

All blog posts + blog pages support a sidebar. Also, Page with Left &Right Sidebar support a sidebar. To apply a sidebar to a page, go tothe Sidebar Box, below all the other meta boxes, and use the selectbox to choose the desired sidebar.

You can create a sidebar by going to Appearance > Sidebars andclicking on the + Add New Sidebar button. Type in the sidebar nameand click OK to save it. Next, you need to add widgets in the sidebarby going to Appearance > Widgets. The sidebar will appear on theright and you can drag and drop widgets from the left into thesidebar.

If you want to learn more about widgets, read section Widgets. Onceyou are done editing the widgets, you can add the sidebar to thedesired page.

9. Setting up the Menus

The Leisure theme allows you to create custom

menus, with up to three levels sub-menus depth. The

menus can be used in twowebsite areas: main menu

and secondary menu. If you have imported the demo

data, see chapter Import XML Demo Data for more

details.

It is recommended to create the pages, even if they are blank pages,before creating a new menu. Next, go to Appearance > Menus, clickthe + Tab, type in a name for your menu and click on the CreateMenu button. You can add pages to the menu by selecting them from

Page 43: Leisure documentation

the Pages box on the left. You can also use the Custom Links box toadd pages by typing in the page URL and in the Label field the page’sname in the menu.

You can manage the menu structure by dragging and dropping pagesin the menu box. To send a menu item a level deeper, drag the itembelow and slightly to the right of another menu item, that willbecome its parent section. After you are happy with your menu, fromthe Theme Locations Box, use the Main Menu select box to choosethe new menu. Click the Save button to record the changes.

9.1. Setting up the Secondary

Navigation

Leisure WP Theme has a nice Secondary Menu available throughoutthe site. The Secondary Menu is placed immediately below the mainmenu and is a beautiful 2 levels menu. Each of the level 1 menu itemshave the ability to have a nice big background picture for it’schildren. You can set this background by clicking on the ChooseImage link:

Also you may want to click Screen Option on the upper right cornerof the screen and then check Description; this will allow you to placea second row of text below each menu title.

Page 44: Leisure documentation

10. Plugin Integration

The Leisure theme is a modern state of the art theme,

ready for the most popular 3rd party plugins. Design

elements have already been set up. You only need to

install the plugin and it will be integrated in the

website by default. Leisure - Hotel, Resort & Spa

WordPress Theme is perfectly adapted for popular

plugins like:

10.1. WooCommerce

The most popular, easy to use plugin for e-commerce. All e-shoppages are adapted to the Leisure theme. To learn how to install theWoocommerce plugin go to WooCommerce ! and follow the

detailed instructions.

10.2. Contact Form 7

The simple but flexible plugin for contact forms. All contact formsare perfectly integrated in the Leisure theme, the graphics will lookgreat and natural. Go to Contact Form 7 ! to learn how to install

the Contact Form 7 plugin and other detailed information.

10.3. All in One SEO & Yoast SEO

Leisure theme is fully adapted to integrate popular SEO plugins likeAll in One SEO and Yoast SEO to help you boost your websiterankings. Learn how to install All in One SEO Pack ! and

Yoast SEO !

Page 45: Leisure documentation

10.4. Translation with WPML

The WordPress Multilingual Plugin is the most popular languagelocalization plugin. Leisure theme has custom design elementsintegrated for the WPML plugin. Learn more about the WPMLplugin by visiting the official website at WPML !

10.5. WP-PageNavi

You can use the WP-PageNavi plugin for a more advanced pagingnavigation interface. After installing it, the Leisure theme willautomatically replace the default options with the WP-PageNavioptions, no programming needed. Go to WP-PageNavi ! to learn

how to install the WP-PageNavi plugin and other detailedinformation.

10.6. Breadcrumb NavXT

Use the Breadcrumb NavXT plugin to change the breadcrumbsdesign of the theme. After installing it, the Leisure theme willautomatically replace the default options with the BreadcrumbNavXT options, no programming needed. Go to Breadcrumb NavXT ! to learn how to install the Breadcrumb

NavXT plugin and other detailed information.

10.7. MailChimp

Use the Mail Chimp plugin to activate the newsletter on the bottomright of the screen. After installing it, the Leisure theme willautomatically apply the styles. Go to Mail Chimp ! to learn how to

install the Mailchimp plugin and other detailed information.

10.8. bbPress

Page 46: Leisure documentation

Use the bbPress plugin to add new community features to yourtheme. bbPress is a forum software with a twist, from the creators ofWordPress. Makes setting up discussion forums inside yourWordPress.org powered site an easy job. Go to the bbPress website ! to learn how to install and use bbPress.

11. CSS & JS Files

CSS Files: You can find below a list with all the CSS files locatedat Leisure > CSS. If you want to insert your own custom CSS code,you can use the Custom CSS field, located at Appearance >Theme Options > Advanced Options. Do not make changes to theCSS files below. A theme update will overwrite all changes made.Insert all your custom CSS only in the Custom CSS field. It willoverride the all.css file and the changes will not be affected by anupdate.

Javascript Files: You can find below a list with all the Javascript fileslocated at Leisure > JS. It is strongly recommended to avoid makingany changes. If you consider you have the necessary knowledge andwish to edit them, we strongly recommend making a copy before.

12. Child Theme

A great solution to keep all your customized options safe whenupdating is to create a child theme. In short, this is a WordPresstheme, running alongside the original theme, with somecustomization overriding some original functions, without alteringthe original theme itself in any way.

You can create a child theme by uploading the leisure-child folder(unzip from download package) next to the leisure folder in the wp-themes folder.

Page 47: Leisure documentation

Customizations made in the child theme folder will override theoriginal theme. Files with the same names from the child folder willoverride the same files from the original theme. (ie. header.php in leisure-child will completely override header.php from leisure)

If you want to learn more about the child theme customization,please follow this link ! to read a comprehensible article.

13. Translating the Theme

The most comfortable and safe way to translate your

theme is by using the popular WPML plugin.

Install WPML Translation Plugin !

If you choose to translate your theme without any translation plugin,the first thing you should do is to download and install Poedit ! .

Alternatively you can translate your theme without any externalsoftware, just by installing the Codestyling Localization ! Plugin.

13.1. CodeStyling Translation

The easiest way to translate your theme is by installing the Codestyling Localization ! plugin. Install and activate the plugin

and go to Tools > Localization (shown in your language), then followthe instructions ! on how to translate the theme.

13.2. Poedit Translation

To translate the theme using Poedit you need to follow the nextsteps:

Open the en_EN.po in Poedit

Save as your new language. The filename of your .po is crucial.

Page 48: Leisure documentation

Gettext uses the ISO 639 standard for language abbreviationsand ISO 3166 for locales. If your translation is written inAmerican English for example, your file name will look like en-US.po. Capitalization is also important here. For a full list oflanguage and country codes, check out these two links: Gettext language codes ! and Gettext country codes !

Once you save, POEdit by default automatically creates a .mofile alongside your .po file. It is recommended to keep both filestogether.

Place the .mo and .po files in the languages folder located in theLeisure folder

13.2.1. Setting up the translation inWordPress

The final step is to tell WordPress which translation file to use foryour website. To do so you need to edit wp-config.php located in theroot folder of your WordPress installation. When you open the wp-config.php file it should look like this:

/** * WordPress Localized Language, defaults to English. * * Change this to localize WordPress. A corresponding MO file for the chosen * language must be installed to wp-content/languages. For example, install * de_DE.mo to wp-content/languages and set WPLANG to 'de_DE' to enable German * language support. */ define('WPLANG', '');

Your file should already contain define(‘WPLANG’, ”); but if it doesnot, you can add it in. You simply need to add your language andlocale code into the define.If you were to translate your theme intoGerman, you would have this:

define('WPLANG', 'de_DE');

Page 49: Leisure documentation

For more details about WordPress localization please visit theWordPress Codex: WordPress in Your Language !

Last Documentation Update: Wednesday, October 8, 2014