30 Jun, 2016

BeautySpa Premium Documentation

Weblizar Docs 0 Comment

Theme-Documentation

BeautySpa is a multi-purpose responsive theme coded & designed with a lot of care and love. You can use it for your business, portfolio, blogging or any type of site.

Try BeautySpa Premium Theme: DEMO HERE

Key Contents

1. Theme installation

2. Setup Home Page

2.1 General Settings

2.1.1 Enable Front Page
2.1.2 Add Logo
2.1.3 Add Favicon
2.1.4 Header Background Image
2.1.5 Google Analytic Code & Custom CSS Editor

3. BeautySpa slider

3.1 Customize BeautySpa Slider

4. BeautySpa Service

4.1 Customize BeautySpa Service

5. BeautySpa Portfolio

5.1 Customizing BeautySpa Portfolio

6. BeautySpa Blog

7. BeautySpa Testimonial

7.1 Customize BeautySpa Testimonial Section

8. BeautySpa Member

9. BeautySpa Clients

9.1 Customizing BeautySpa Client Section

10. Customize BeautySpa Team

11.BeautySpa Facts and Skills

11.1 Customizing BeautySpa Facts and Skills

12. Contact Setting

13. Appointment Setting

14. Callout Setting

15. Skin Layout Setting

16. Social Icon Setting

17. Footer Setting

17.1 Widget Area

17.2 Custom Footer Bar

18 Home Page Manager Setting

19. Custom URL Setting

20. Theme Templates

21. Maintanance Mode Setting

21.1 Slider Type

21.1.1 Add Background Image

21.1.2 Welcome Video Background

22. Short-codes

22.1 Accordion

22.2 Collapse

22.3 Alert

22.4 Button

22.5 Column

22.6 Drop-Caps

22.7 Heading

22.8 Panel

22.9 Popover

22.10 Progress Bar

22.11 Tabs

22.12 Tool Tip

22.13 Portfolio

22.14 Blog

Now, we are going through installation, configuration and publish theme. Follow the step by step guide:

1. Theme Installation

First, download your theme package from your Weblizar Amember Account.

Upload Theme package zip folder using theme installer wordPress option Otherwise Any FTP (FillZilla)

We recommend you upload theme zip package using FTP( FillZill/Bitwise), In your host-server-directory\wp-content\themes\

After that Activate theme into WordPress site Admin Dashboard -> Appearance ->themes.

Now the theme is successfully installed on our site, step up to the next step.

2. Setup Home Page

Our theme home page has 9 different sections. These sections can be customized with the theme options page.

You can access theme options page at Admin Dashboard → Appearance → Theme Options.

A look of Theme Options page is Here.

Now all settings are explained one by one.

2.1 General Settings

In this section, you can enable front-page, add a logo , add a background image to breadcrumbs, add custom CSS, add google analytic code etc.

Please go to Admin Dashboard → Appearance → Theme Options → Home Options →General Settings.

Please refer below image for Quick Settings.

2.1.1 Enable Front-page

To Enable front-page go to Admin Dashboard → Appearance → Theme Options → Home Options →General Settings.

And slide Home-Page or Custom Page to ON.

2.1.2 Add Logo

To add Logo go to Admin Dashboard → Appearance → Theme Options → Home Options →General Settings.

Now click on Custom Logo Button and upload your logo image or select from Media Library.

Follow image

You can further customize the logo’s height and width from Logo Height and Logo Width settings.

NOTE : Logo height is Set to 60px for fixed header, if fixed header is enabled and when you scroll the page, Logo will set to 60px height in fixed menu.

2.1.3 Add Favicon

To add Favicon go to Admin Dashboard → Appearance → Theme Options → Home Options →General Settings.

Now click on Favicon Icon Button and upload your logo image or select from Media Library.

To add Header Background Image go to Admin Dashboard → Appearance → Theme Options → Home Options →General Settings.

And Click on Upload image in Header Background Image setting.

Theme Support Custom Header functionality.

To add Background Image via Custom Header, slide Custom Header Background button to ON save the changes.

Now go to Admin Dashboard → Appearance → Customize→Header Image and customize header image.

Theme supports Fixed Header functionality.

To add Fixed Header via Custom Header, slide Fixed Header button to ON save the changes.

Theme supports Show Search Bar in Header functionality.

To add Search Bar in Header via Custom Header, slide Show Search Bar in Header button to ON save the changes.

2.1.5 Google Analytic Code & Custom CSS Editor

Google Analytic Code and custom CSS can be added to theme using Theme’s General Settings.

Note:Please add Google Analytic Code without script tag. Please don’t use >, < like symbol in custom CSS editor.

3. BeautySpa Slider

To add a slide to BeautySpa Slider.

Go to Admin Dashboard →BeautySpa Slider →Add New Slide and fill related details.

For a quick view, please follow below image.

3.1 Customize BeautySpa Slider

Theme Slider have two types.

1. Slider Type

2. Welcome Video Background

3.1.1 Slider Type

You can customize BeautySpa Slider in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options →Slider Settings.

In Slider Settings, you can set

Auto-play ON/OFF
Enable Pause On Hover.
Set interval time.
Set slider to rotate all slides.

3.1.2 Welcome Video Background

You can customize BeautySpa Slider in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options → Slider Settings → Slider Type.

In Slider Settings, you can set

Auto-play ON/OFF
Enable Pause On Hover.
Set interval time.
Set slider to rotate all slides.

Common Settings-

Set slider Title Animation,
Set Sub Title Animation,
Set Button Animation.

3.1.2.1 How To Add Embedded Video Url

For a quick view, please follow below image.

Please add this video code into video embedded URL.

4. BeautySpa Services

To add Service to BeautySpa Services.

Go to Admin Dashboard → BeautySpa Services → Add New Service and fill related details.

For a quick view, please follow below image.

Note: To show services on the homepage you have to add either font awesome icon or feature image if you do not add this field, Service will not show on homepage.

4.1 Customize BeautySpa Services

You can customize BeautySpa Services in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options → Service Settings.

In Service Settings, you can set

Service Heading
Service Description
Service Template
Service Column

Please follow below image for Quick Service Settings.

5. BeautySpa Portfolio

To add Portfolio to BeautySpa Portfolios.

Go to Admin Dashboard → BeautySpa Portfolios→ Add New Portfolio and fill related details.

For a quick view, please follow below image.

5.1 Customize BeautySpa Portfolio

You can customize Portfolio in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options → Portfolio Settings.

In Portfolio Settings, you can set

Portfolio Section Title
Portfolio Section Description
Portfolio Column Layout
Set Portfolio Template

Please follow below image for Quick Portfolio Settings.

6. BeautySpa Blog

You can customize Blog in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options → Blog Settings.

In Blog Settings, you can set

Blog Section Title
Blog Section Description
Blog Column Layout
Set Blog Column
Set AutoPlay
Set Rotation
Set Category

Please follow below image for Quick Blog Settings.

7. BeautySpa Testimonials

To add Testimonial to BeautySpa Testimonials.

Go to Admin Dashboard → BeautySpa Testimonials → Add New Testimonial and fill related details.

For a quick view, please follow below image.

7.1 Customize BeautySpa Testimonial Section

You can customize BeautySpa Testimonial Section in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options →Testimonial Settings.

In Testimonial Settings you can set

Testimonial Section Title
Testimonial Description
Testimonials Background
Set AutoPlay
Set Time Interval

Please follow below image for Quick Testimonial Settings.

8. BeautySpa Members

To add Member to BeautySpa Members.

Go to Admin Dashboard →BeautySpa Members →Add New Member and fill related details.

For a quick view, please follow below image.

9. BeautySpa Client

To add Member to BeautySpa Client.

Go to Admin Dashboard →BeautySpa Client →Add New Client and fill related details.

For a quick view, please follow below image.

9.1 Customize BeautySpa Client Section

You can customize BeautySpa Client Section in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options →Client Settings.

In Client Settings, you can set

Client Section Title
Client Description
Set Rotation

Please follow below image for Quick Client Settings.

10. Customize BeautySpa Team

You can customize Team in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Home Options →Team Settings.

In Team Settings, you can set

Team Section Title
Team Section Description
Set Team Background

Please follow below image for Quick Team Settings.

11. BeautySpa Facts and Skills

You can customize Facts And Skills in Theme Options Settings.

Go to Admin Dashboard →BeautySpa Facts And Skills → Add New Facts And Skills and fill related details.

For a quick view, please follow below image.

11.1 Customize BeautySpa Facts And Skills Section

You can customize Facts And Skills in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Facts And Skills Settings.

In Facts And Skills Settings, you can set

Facts And Skills Section Title
Facts And Skills Section Description

Please follow below image for Quick Facts And Skills Settings.

12. Contact Setting

You can customize Contact in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Contact Settings.

In Contact Settings, you can set

Add Mail
Set Contact Form Title
Set Contact URL
Add Placeholder Setting
Add Contact Details

Please follow below image for Quick Team Settings.

Note: All mails, of contact us templates and Home Contact section, are mailed to the mail id that you set in contact mail option.

13. Appointment Setting

You can customize Appointment in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Appointment Settings.

In Appointment Settings, you can set

Add Appointment Contact Title
Add Appointment Description
Set Appointment in Footer
Set Appointment Contact Background

Please follow below image for Quick Appointment Settings.

14. Callout Setting

You can customize Callout in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Callout Settings.

In Callout Settings, you can set

Add Callout icon
Add Callout Title
Set Callout Span Title
Set Callout Description
Set Callout Button Text
Set Callout Button Link
Add Callout Background

Please follow below image for Quick Callout Settings.

15. Skin Layout Setting

You can customize Skin Layout Setting in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Skin Layout Settings.

In Skin Layout Setting, you can set

Set Switcher
Set Theme Color
Set Theme Layout
Set Custom Background On/Off
Set Background Image

Please follow below image for Quick Skin Layout Settings.

You can customize Social Icon Setting in Theme Options Settings.

Go to Admin Dashboard → Appearance → Theme Options → Social Icon Settings.

In Social Icon Settings, you can set

Set Icon On Header
Set Icon On Footer
Social Icon Link Setting

Please follow below image for Quick Social Icon Settings.

Note: All social icon are set to open in new tab.

Theme Footer have two Parts.

Widget Area
Custom Footer Bar

17.1 Widget Area

Theme Footer Widget Area have default Widgets.

Please go to Admin Dashboard → Appearance → Widgets.

And Drag-Drop Widget to Footer Widget Area to add Footer Widget Area.

Please follow below image for Quick Settings.

17.2 Custom Footer Bar

In custom Footer Bar there is two part

Social Icons: Social Icon Can be Customize from Social Media Options.
Credit Text: This Part can customize from Footer Options.

Please go to Admin Dashboard → Appearance → Theme Options → Footer Options.

In Footer Options Settings, following settings can be customized

Set Footer Text
Set Footer Link’s Text
Set Footer Link

Please follow below image for Quick Footer Settings.

footer options

18. Home Page Manager Setting

Using Home Page Manager settings, sections on Home Page can be remove and move.

BeautySpa slider is always on the Top.

To access Home Page Manager go to Admin Dashboard → Appearance → Theme Options → Home Page Manager.

Here section can be enabled/disable and move using DRAG N DROP.

Please follow below image for Quick Settings.

home page manager

19. Custom URL Setting

BeautySpa provides an option to use your own custom URL for custom post types.

You can use custom URLs at Admin Dashboard → Appearance → Theme Options →Custom URL’s Options.

You have to refresh Permalinks to apply these changes. Please change your URLs here, save the change. Then go to Admin Dashboard → Settings→ Permalinks.

Here change the permalink to another format and save. Now revert to your permalink type and again save.

In Custom Settings, you can set

Add Service Custom URL
Add Portfolio Custom URL
Add Member Custom URL

Please follow below image for Quick Settings.

custom URL

Note: After changing custom URL you have to re-save permalink setting. To re-save permalink setting please go to Admin Dashboard >> Settings >> Permalinks and click on save button.