“Clean Retina Pro” WordPress ThemeTheme Instruction

1) Installation

a) Through Dashboard

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

b) Manual Installation using FTP

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

---

2) Custom Menus

Clean Retina 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 side sidebar and footer sidebar 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 one extra widget with the theme i.e. Theme Horse:Custom Tag Cloud. It is used to show tag clouds with beautiful button design. Try it you may like it.

---

4) Custom Header

Clean Retina 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.

Note: If you use small image(as logo) it will appear at just right side of the header text. So, better use small image(as logo) or header text, only one of at a time, for beautiful look. But if you using big image as header image(big and not logo/small image), it will appear just below the header text. So, if you are using big image you can use both header text and image.

b) Header Text

• Go to Appearance->Header.
• You can show/hide Header Text(i.e. Site Title and Site Description).
• You can also set the Header Text Color from Text Color Option.
• Click on Save Changes at last.

---

5) Footer Editor

Clean Retina Pro has footer editor option to edit the copyright information. You can add custom HTML and/or shortcodes, which will be automatically inserted into your theme.
Some shorcodes:

• [the-year] displays the current year
• [site-link] displays your site link
• [wp-link] displays WordPress site link
• [th-link] displays Theme Horse link,

---

6) Homepage Layout Configuration

There are different layouts for the home page. You can choose the homepage layout by following the instructions given Below.

a. Normal Layouts for Home Page

You can select No Sidebar/No Sidebar, Full Width/No Sidebar, One Column/Left Sidebar/Right Sidebar according to your choice.

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

Note:You have to check on Your latest posts instead of static page. in Reading Settings sub-menu page of the Settings main menu.

b. Latest Posts listing display type on Home Page

You can select any of these above mentioned layouts, all these mentioned layouts show the latest posts in the content area. Now, you can also choose the display type for these posts(i.e. the content area-posts listing part). The display type are mentioned below one bye one.

i. Excerpt Display Type 1

• Go to Appearance->Customize/Theme Options->Design Options->Home Page Layout Options.
• Check on the Excerpt Display Type 1 layout.
• Click on Save all Changes.

Note:This display type shows the repective featured image, title, post meta information and excerpt of every posts. The size of the featured image shown is 700*290(width*height) in pixels.

ii. Excerpt Display Type 2

• Go to Appearance->Customize/Theme Options->Design Options->Home Page Layout Options
• Check on the Excerpt Display Type 2 layout.
• Click on Save all Changes.

Note:This display type shows the repective featured image, title, post meta information and excerpt of every posts. The size of the featured image shown is 330*330(width*height) in pixels.

iii. Full Content Display

• Go to Appearance->Customize/Theme Options->Design Options->Home Page Layout Options
• Check on the Full Content Display layout.
• Click on Save all Changes.

Note:This display type shows the title, post meta information and the whole content of the every posts. This way you can embed images and videos in the content and display them on the homepage.

c. Corporate Layout for Home Page

Our Theme offers one unique homepage layout named as Corporate Layout. Below is the instruction to set Corporate Layout for the homepage.

• Go to Appearance->Customize/Theme Options->Design Options->Home Page Layout Options.
• Check on the Corporate Layout and click on Save all Changes.
• After you choose the Corporate Layout, you can add the corporate layout content from Home’s Corporate Type Layout Options under Advanced Options Tab.
• There are input field to enter the image, redirect link, title and description. Upload an image, enter a title and description and give the redirect link. Note: You can add any link that could link outside of the website or link to pages,post, categories of the same website.
• After adding click on Save all Changes.

Note:You have to check on Your latest posts instead of static page in Reading Settings sub-menu page of the Settings main menu.

d. Static Page as Home Page

You can set any of your static page as home page.

• Go to Settings->Reading.
• Check on A static page in the Front page displays option.
• Select the Front page: just below fromt he drop down option.
• Click on Save Changes

---

7) 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/No Sidebar, Full Width/No Sidebar, One Column/Left Sidebar/Right Sidebar

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

---

8) 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/No Sidebar, Full Width/No Sidebar, One Column/Left Sidebar/Right Sidebar to be this post’s specific layout.
• Update the post to save the changes.

---

9) Set up Homepage Slider

• Go to Appearance->Customize/Theme Options->Slider Options->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. The ID for each post/pages will be shown in right most side of screen.
• Remember that each post whose post/page id you are using for slider must have featured image minimum of size 962(width in px) 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.

---

10) 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.

---

11) Plugin Support

a. Contact Form 7 Plugin Support

Our theme supports Contact Form 7 Plugin i.e. there is already css written for the Contact Form 7 which would show you contact form in very simple and beautiful design. You can view the demo here.

b. WP-PageNavi Plugin Support

Our theme supports WP-PageNavi Plugin to show pagination. The theme already has the wp_pagenavi() function coded within the theme. The theme also has written css in the style.css file that would show the WP-PageNavi pagination in a very beautiful way. So, just install the WP-PageNavi plugin and turn off the pagenavi plugin CSS from the backend in the WP-PageNavi Setting page. You can view the demo here.

c. Breadcrumb NavXt Plugin Support

Our theme supports Breadcrumb NavXt plugin. This plugin generates locational breadcrumb trails for your WordPress blog. These represent the hierarchy leading up to the current page rather than the actual path taken to arrive at the current page. The theme has the bcn_display() function coded within the theme. You can view the demo here.

---

12) 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.

---

13) Hide Title on Page

• Go to the particular Page editor from Dashboard.
• Scroll down and search for Page option
• Check the Page Title Hide checkbox.
• Click on Update.

---

14) 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 checkbox in the Discussion box
• Click on Update.

---

15) How to change Readmore and Continue Reading

By default Readmore appears below post excerpt and Continue Reading appears in slider excerpt. You can change this

• Go to Appearance->Customize/Theme Options->Advance Options->Excerpt Options
• Change the Slider more text for changing Continue Reading below slider
• Change the Post Excerpt More Text for changing Readmore that appear below post excerpt.
• Click on Save All Changes.

---

16) 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
• Click on Save All Changes.
• Contact Page template has its own sidebar registered. You can drag and drop any widget in Contact Page Sidebar

---

17) Recommended Image Sizes

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

a. Slider Image

Width: 962px
Height: 390px

b. Featured Image per post for Blog Image Medium Template

Width: 330px
Height: 330px

c. Featured Image per post for Blog Image Large Template

Width: 700px
Height: 290px

d. Featured Image per gallery post for Gallery Three/Four Column Template

Width: 330px
Height: 230px

e. Featured Image per gallery post for Gallery Two Column Template

Width: 462px
Height: 322px

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.

---

18) Corporate Page Template Setup

• Create a page.
• Look for the ‘Page Attribute’ option box and select the Corporate Template for it from the template drop down option. Then click on ‘Publish’ button.
• Now, to add the Corporate Page Template content, go to Appearance->Customize/Theme Options->Advance Options Tab->Corporate Page Template options.
• For the Top section:
  • Set the number of pages (Note:If you want more pages first input it and click on save all changes, this will give you more pages drop down option)
  • Choose the respective pages that you want from the pages drop down option.
  • You need to set the featured image (Recommended size is 140px (width) * 140px (height)) for the pages that you add for the top section if you want to show the images for the added pages.
• For the Middle section:
  • Set the title. Eg: ‘Recent Work’ or as you wish.
  • Set the number of pages (Note:If you want more pages first input it and click on save all changes, this will give you more pages drop down option)
  • Choose the respective pages that you want from the pages drop down option.
  • You need to set the featured image (Recommended size is 330px (width) * 230px (height)) for the pages that you add for the middle section if you want to show the images for the added pages.
• For the Bottom/Testimonial section:
  • Set the title. Eg: ‘What Our Client Say’ or as you wish.
  • Add the testimonial ids. To add this testimonial id, you need to create the testimonial first.
  • So, go to Testimonials->Add New.
    Fill out the testimonial with Title(Name), content and other testimonial details just below the main editor box. Publish it. Now, go to Testimonails->All Testimonails. You will see the respective id of all testimonials at the last column. This is the id that you need.
  • Add the testimonials id in the Corporate Page Template options.
• Click on ‘Save all Changes’ button.
• After you setup all these your template will look like Clean Retina Pro

---

19) How to setup Blog page Templates

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”, look for the ‘Page Attributes’ option box 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.

---