“Interface Pro” WordPress ThemeTheme Instruction

1) Installation

a) Through Dashboard

• Log in to the WordPress Dashboard.
• Go to Appearance->Themes.
• Click on Add New at the top.
• Click on Upload Theme
• Browse the zip file of Interface Pro
• Then Click on Install Now to install the theme.

b) Manual Installation using FTP

• Download the Interface Pro from your account
• Unzip interface-pro.zip to your Desktop.
• Using an FTP client to access your host web server. Go to /wp-content/themes/
• Upload Interface Pro theme to /wp-content/themes/.
• Go to Appearance->Themes and activate Interface Pro theme from Dashboard.

---

2) Custom Menus

Interface Pro supports custom menu you can set it through following steps.

• Go to Appearance->Menus.
• Give your menu a name and build it up using little widgets on the right.
• You can add pages, categories or custom URL’s.
• Now simply select the theme location(Primary Menu in our case) for your newly created menus using a widget on the left. Afterwards, click Save.

See Menu Help for more information.

---

3) Customizing sidebar with widgets

As you may have probably noticed, after installing the theme, your left sidebar, right sidebar, Business Page Section, Business Page Our Clients Section, Contact page sidebar, Footer-Column 1, Footer-Column 2, Footer-Column 3, Testimonial Page Section, Services Page Section and Our Team Page Section is empty. We have provided you with an opportunity to completely customizing it to your liking with the use of WordPress Widgets

• Go to Appearance->Widgets.
• You can drag and drop widgets in each of positions.
• See Widget Help for more information.

Note: This theme has some extra widget with the theme i.e. Theme Horse:Custom Tag Cloud, Theme Horse: Featured Image, Theme Horse: Featured Recent Work , Theme Horse: PromoBox, Theme Horse: Services, Theme Horse: Testimonial and Theme Horse: Our Team.

---

4) Custom Header

Interface Pro supports Custom Header Feature.

a) Header Image

• Go to Appearance->Header.
• Browse image from your computer and upload the image.
• Crop the Image according to your will.
• Click on Crop and Publish.
• Your website’s Header Image is now set.

---

5) Custom Background

Interface Pro supports Custom Background Feature.

• Go to Appearance->Background.
• You can either set the image or color as background.
• You can see the background preview on the same setting page.
• Click on Save Changes.

Note:The background effect will only seen if you set site layout option in the Customize/Theme Options to be Narrow Layout instead of Wide Layout.

---

6) Default Layout Configuration

There are different layouts and you can set any layout to be your default layout. Every page, post that don’t have their specific layout will follow have this default layout. Archives(i.e. category pages) will also follow this default layout. You can choose the default layout by following the instructions given below.

a) No Sidebar, Full Width/No Sidebar, Left Sidebar/Right Sidebar

• Go to Appearance->Customize/Theme Options->Layout Options->Content Layout.
• Check on the No Sidebar, Full Width/No Sidebar, Left Sidebar/Right Sidebar layout.
• Click on Save all Changes.

---

7) Specific Layout Per Post/Page Configuration

This theme allows you to choose the specific layout for every post display and every page display. You can do so by following the steps give below.

• Go to Posts/Pages->All Posts/All Pages.
• Click on any Post/Page.
• You will see a box named Select layout for this specific Post only. in belower part below the text editor box. Note:If you don’t find it, you will see Screen Options, click on it and check the Select layout for this specific Post only.
• If your select Default Layout set in Theme Settings
  , the layout set in the Default Layout Configuration will be layout for this post as well.
• You can select from No Sidebar, Full Width/No Sidebar, Left Sidebar/Right Sidebar to be this post’s specific layout.
• Update the post to save the changes.

---

8) Set up Homepage Slider

• Go to Appearance->Customize/Theme Options->Featured Posts/Pages slider->slider options
• Set the number of sliders and other transition effects.
• Then go to featured post/page slider options below slider options
• Fill each input box with the Post/Page ID of the post/page which you want to use as slider.
• You can view Post ID by clicking Posts/Pages->All posts/pages in your Dashboard. Hover the Edit link on individual Post/Page there you can see the digit value of the Post ID.
• Remember that each post whose post/page id you are using for slider must have featured image minimum of size 1038(width in px) for narrow-layout and 1440(width in px) for wide layout and height according to your choice for slider image to show properly(Note:: Better to use all images of same size.)
• After filling all input box with Post/Page ID click save.

Note: Slider works for the home page and static front page.

---

9) Custom CSS

If you want to edit some CSS, you can follow the instructions below, your custom CSS will overwrite the theme’s CSS.

• In the dashboard. Go to Appearance->Customize/Theme Options->Design Options->Custom CSS input field.
• Write your custom CSS there.
• Click on Save All Changes.

---

10) Business Layout

You can show your homepage as business layout format as in our demo.

• Create a page name Business Template and choose Business Template from Template drop down.

  

• Go to Settings > Reading settings

  

• Choose Front Page Display ->A static Page->Front page-> Choose this page from dropdown.
• We have five custom widget especially designed for business layout home page Theme Horse: Featured Image, Theme Horse: Featured Recent Work , Theme Horse: PromoBox, Theme Horse: Services and Theme Horse: Testimonial
• Go toAppearance-> Widget.
• Drag and Drop any widget from below four widget (Theme Horse:Services, Theme Horse:Featured Recent Work, Theme Horse: Testimonial, and Theme Horse: Promo Box) to Business Page Section
• Drag and Drop Theme Horse: Featured Image to Business Page Our Clients Section
• Click Save

a) Theme Horse: Services Widget

Theme Horse: Services Widget can be used to showcase your services.

• Create Page, give a Title, Description
• Upload Featured image i.e. service logo ( recommended size 100*100px ).
• Repeat step 1 and 2 for creating other service pages.
• Go to Appearance->Widget->Theme Horse: Services
• Drag and Drop this widget to Business Page Section / Services Page Template
• Now select the service pages you created from the drop down

b) Theme Horse: Featured Recent Work Widget

Theme Horse: Featured Recent Work Widget can be used to showcase your Recent work, Portfolio or anyway you like.

• Create Page, give a Title, Description
• Upload Featured image
• Repeat step 1 and 2 for creating other Featured pages.
• Go to Appearance->Widget->Theme Horse: Featured Recent Work
• Drag and Drop this widget to Business Page Sidebar
• Give Title, Description, redirect Text and Redirect Url
• Now select the pages you want to show from the drop down

c) Theme Horse: Testimonial Widget

Use Theme Horse: Testimonial Widget to showcase your testimonials.

• Go to Appearance->Widget->Theme Horse: Featured Testimonial
• Drag and Drop this widget to Business Page Section / Testimonial page Template
• Fill Title, Image (recommendation size 168 * 168), Testimonial Description,Name and Designation in the widget
• Click Save

d) Theme Horse: PromoBox Widget

Use Theme Horse: PromoBox Widget to showcase your PromoBox.

• Go to Appearance->Widget->Theme Horse: PromoBox
• Drag and Drop this widget to Business Page Section
• Fill Primary Promotional, Secondary Promotional, Redirect Text and Redirect Url in the widget
• Click Save

e) Theme Horse: Featured Image Widget

Use Theme Horse: Featured Image Widget to showcase your Featured Image.

• Go to Appearance->Widget->Theme Horse: Featured Image
• Drag and Drop this widget to Business Page Our Clients Section
• Fill Title, Number of Images, Add Image and Redirect Url in the widget
• Click Save

f) Theme Horse: Our Team

Use Theme Horse: Featured Image Widget to showcase Our Team.

• Go to Appearance->Widget->Theme Horse: Our Team
• Drag and Drop this widget to Our Team page section
• Fill Title, Number of Testimonial, Add Image, Description, Name, Designation, Company Name and Comapany Url in the widget
• Click Save

---

11) How to disable Page Comments

• Go to the particular page on which you want to turn off the comments from dashboard.
• Look for the Discussion box somewhere below the editor box.
• If you don’t see it, click on the screen options in the right top part and check on the discussion checkbox. Then discussion box will appear below page editor
• Uncheck Allow Comments in the Discussion box
• Click on Update.

---

12) How to setup contact us page

We support Contact Form 7. You can download it here.

• Create a new page and select “Contact Page Template” page template for the contact us form to show up.
• Paste the shortcode provided by Contact Form 7 plugin
• Click on Save All Changes.
• Contact Page template has its own sidebar registered. You can drag and drop any widget in Contact Page Sidebar

---

13) Recommended Image Sizes

This theme depends heavily on Featured Images per post. Read more about Featured Images.

a. Slider Image size for Wide Layout

Width: 1440px
Height: 500px

b. Slider Image size for Narrow Layout

Width: 1038px
Height: 500px

c. Featured Image per post for Blog Image Medium Template

Width: 230px
Height: 230px

d. Featured Image per post for Blog Image Large Template

Width: 670px
Height: 300px

e. Image size for icon used in Business Layout

Width: 100px
Height: 100px

f. Image size for Testimonials used in Business Layout / Testimonials Template

Width: 168px
Height: 168px

g. Image size for Our Team Template

Width: 222px
Height: 222px

Note: If you are switching from another theme, you will want to install and run the Regenerate Thumbnails WordPress plugin to resize your existing images.

---

14) How to setup Blog page

You can show your Blog page in three different ways. They are large image with excerpt content, Medium image with excerpt content and full content display. You can have a look here in our demo Blog demo

• Create a new page, give it a name for example “Blog” and select page template from Template dropdown.
• Choose “Blog Image Large” for large image with excerpt text, “Blog Image Medium” for medium image with excerpt text and “Blog Full Content Display” for showing Full content.

  

• Click on Publish.
• Now all your posts will be shown as per your template selection.
• Remember the images for each of the post shown in blog layout are featured image for that particular post.

---

15) Set up Custom Gallery

• Go to Galleries->Add New in your dashboard.
• Add Title which will be Image title.
• Add featured image for this post.
• Click on Publish.
• If you have multiple images(other images too) to be shown. Repeat the first four steps again.
• After you are done with adding the posts in Galleries.
• Create a Page, give it title.
• On the right hand-side, click on template dropdown.
• From the dropdow, select any of from three template ( Gallery four column template, Gallery three column template, Gallery two column template )
• Click Publish button.
• Now choose this page as menu.

---