01Getting started

This is the Spacious Pro theme instruction page. We have tried our best to keep it as simple as possible. If you think it can be made even simpler let us know we will be glad to change it. Let’s start! On the right side you can see the table of contents of this documentation. Jump to the section you want, or read it all through – your choice. Let’s move on!

02Installation

Installing your theme is pretty easy! After downloading you should have a spacious-pro.zip file. This is a compressed file containing all of the required templates and images required for the theme to function properly.

Upload the theme

1. Go to Appearance > Themes in the WordPress Dashboard
2. Click on the Add New button
3. Click on the Upload link
4. Select the spacious-pro.zip file
5. Click Install Now

Activate the theme

1. Go to Appearance > Themes in the WordPress menu
2. Hover over the theme thumbnail and press the Activate button

03Custom Menu

By default, the menus will fallback to Pages. That means just after activation of theme you will see all the pages as menus. If you want selective menus with combination of links, pages, categories then custom menu is what you should be looking for.

Set up Custom Menu

1. Go to Appearance > Menus in the WordPress menu
2. Click on Create a new menu link
3. Give a name to your menu in Menu Name and click Create Menu button
4. Now choose the pages, categories, custom links from the righside of your screen by selecting the checkbox and click on Add Menu
5. Click Save Menu after adding required pages, categories in the menu

04Home Page Slider

This theme supports the home page image slider. To use it follow the below steps.

1. In the dashboard, go to Appearnace->Theme Options.
2. Head on over to the Slider Tab.
3. To use the slider, first check on the Check to activate slider to activate the slider.
4. Upload the image # 1 for the first slider. Similary, add the correspondind slider title, slider description and redirect link. You can link to a link within your site or outside of your site.
5. Repeat the above step for your other slides.
6. Then click on Save Changes. That’s it, open your home page and it should be there. 🙂

05Add custom logo

Yes, this theme supports custom logo. To use it, follow the below steps.

1. In the dashboard, go to Appearance->Theme Options->Header Tab.
2. Upload the cusotm logo.
3. Also, the Show logo only or Show both checkbox need to be checked to show the logo in header.
4. Click Save Changes.

06Header Image

To set the header image follow below steps.

1. In the dashboard, go to Appearance->Header.
2. Click on Browse to add your image. Then click on Upload button.
3. Crop the Image to your liking. The recommended width is 1500px for the header image.
4. Click Save Changes.

Note: You can choose the header image to be shown above the header text or belov it.

1. In the dashboard, go to Appearance->Theme Options->Header Tab.
2. Scroll a bit below and check on the Position Above or Position Below as your like for the Header Image Position opiton.
3. Click Save Changes.

07Setup Business Template

First Step

1. In the dashboard, add a new page.
2. In the Page Attributes option box, choose the Business Template in the Templatedropdown option.
3. Publish the page. Yes, that’s it for the first step.

Second StepThe Business template has four widget areas within it. Have a look here in this image. Click on the image for better view

1. Buisness Top Sidebar
2. Business Middle Left Sidebar
3. Business Middle Right Sidebar
4. Business Bottom Sidebar

You just need to add some widgets to these sidebar to setup the business tell.

Third StepBelow are some widgets provided by the theme that you use to make you business template look Awesome.

1. TG: ServicesAdd this widget to Business Top/Bottom Sidebar. In this widget, select any of your pages in the drop down option. There are six page dropdown options within it. The title, description and featured image of that same pages that you select will be shown.
2. TG: Call to ActionAdd this widget to Business Top/Bottom Sidebar. In this widget, add the first and second title line, button text, button redirect link and all is done.
3. TG: TestimonialsAdd this widget to any Business Sidebar. In this widgets, add the title, text, name, byline and all is done.
4. TG: Featured Single PageAdd this widget to Business Middle Left/Right Sidebar. In this widget, select any of your page in the drop down option. The title, description and featured image of that same page that you select will be shown.
5. TG: Featured WidgetAdd this widget to Business Top/Bottom Sidebar. In this widget, add the title and description. select any of your page in the drop down option. There are three page dropdown options within it. The featured image of that same page that you select will be shown.

If you set everything right you can create the business template as in our demo hereBusiness Template

08How to Setup Blog page?

You can choose to show blog in 6 different ways via 6 different blog template.

1. First create a new page called “Blog” or give it a any name you wish.
2. Now select the appropriate blog template from right hand side of the page editor.
3. Choose Blog Image Large for large image with excerpt text.
4. Choose Blog Image Medium for medium image with excerpt text.
5. Choose Blog Full Content for showing full content without the featured images and readmore
6. Choose Blog Image Alternate Medium for medium image with excerpt text but images appear in alternate fashion right, left.
7. Choose Blog Image Round Medium for medium round image with excerpt text.
8. Choose Blog Image Round Alternate Medium for round medium image with excerpt text but in alternate fashion.
9. Click publish
10. Now go to Appearance->Menu and select the blog page you created in step 1 as menu
11. See all templates demo here Demo

09Contact Us Page

Plugin Installation

1. Download Contact Form 7 plugin from here Download then install and activate it
2. Then go to plugin’s page and set it. Here is a detail on that Docs

Contact us page template

1. Go to dashboard, then create a page. Give it a name “Contact” or “Contact us” as you wish.
2. Now on the right hand side you can see Template Dropdown. Select Contact Page Template
3. Copy the contact form 7 shortcode and paste it in this page.
4. Click on Publish.

10Quick Specs

All measurements are recommended and in pixels.

Slider Image

• 1400 X 500 if site layout option is set to wide layout.
• 1268 X 452 if site layout option is set to boxed layout (content width 1218).
• 1038 X 370 if site layout option is set to boxed layout (content width 1038).

TG: Widgets

• TG: Services widget: Width – 346.
• TG: Featured Single Page: Width – 594.
• TG: Featured Widget: Width – 270, Height – 270.
• TG: Our Clients: Width – 200.
• TG: Featured Posts
  • For medium image view: Width – 270, Height – 270
  • For large image view: Width – 594, Height – 277

Blog Page Featured Images

• If site layout option is set to wide layout 1218 or boxed layout 1218
  • For medium image view: Width – 270, Height – 270
  • For large image view: Width – 750, Height – 350
• If site layout option is set to wide layout 978 or boxed layout 978
  • For medium image view: Width – 230, Height – 230
  • For large image view: Width – 642, Height – 300