1. Theme Installation
Via WordPress- Log in to the WordPress Administration Panels.
- Go to the Appearance > Themes.
- Click Add New.
- In Search themes… type ‘reef’.
- When ‘reef’ appears click Install button.
- After Installing the theme Click Activate button.
- Use your FTP software to browse to wp-content/themes folder.
- Extract reef.zip and upload the folder.
- Once it’s uploaded, go to your WordPress Admin, browse to Appearance > Themes.
- Click the Activate link.
2. Adding Contents
Posts
To create post on your site, it’s easy. Follow the below listed methods.
- Go to Administration Panels.
- Go to Posts and Click on Add New.
- Give the title of the post and add the content.
- Set the featured image for the post from right corner.
- Set that post on the Category.
- Click on Publish Button.
- Add more post like the above methods.
Pages
To create page on your site, it’s easy. Follow the below listed methods.
- Go to Administration Panels.
- Go to Page and Click on Add New.
- Give the title of the page and add the content.
- Set the featured image for the post from right corner.
- Click on Publish Button.
- Add more page like the above methods.
Categories
To create categories, follow the below steps.
- Go to Administration Panels
- Go to Posts > Categories
- Give the title of the category
- Click on Save
- The added category will appeared on the Add Post Page.
3. Widgets
Reef comes with Added Custom Widget for About Author and Highlighted Post. You can use Reef About Sidebar for showing detail about site Author and Reef Highlighted Posts for selecting a Category Post which you want to highlight on the sidebars. You have a custom widget's area for the different widgets to place on the sidebar and footer.Reef About Sidebar
Add this available widget on any of the added widget area. Widget Title: Title for the Widget Select Page: Add page you want to show as Author Description Sub Title: Add your Job post or taglineReef Highlighted Posts
Add this available widget on any of the added widget area. Widget Title: Title for the Widget Select Category: Add Category to Highlight their posts Number of posts: Set the number of posts4. Site Title, Tagline & Logo
Go to Appearance > Customize > Site Identity- Click on Select Logo.
- Select the logo.
- Add Site Title and Tagline.
5. How to manage Colors?
Go to Appearance > Customize > Colors Select the required color for;- Background
- Site Title
- Site Tagline
- Site Primary
6. How to manage Background Image?
Go to Appearance > Customize > Background Image- Select the best image for the site background.
7. How to manage Menus?
This theme comes with three menu locations. Primary Menu and Social Links Menu and Alternative ( Off canvas ) Menu.Primary Menu
This menu will appear on the Main menu for the site below the logo section.- Create a menu and add the items on the menu.
- Set the menu on the Primary Menu.
- Save the Menu
Social Menu
Social Menu will appear on the Right Side of the Primary Menu(As in Demo)- Add the link for social Menu(Use Custom Link to create this menu)
- In custom link, add link for Facebook Menu(www.facebook.com/username)
- Add the menu and follow the same steps for Twitter, Instagram, Pinterest, WordPress and Youtube.
- Select the Social Menu for this.
- If preview is fine, Click on Save & Publish to save the changes.
Alternative Menu
Alternative Menu will appear on the Right Side of the Social Menu with three lines button. It has modern Off Canvas effect to open.- Create a menu and add the items on the menu.
- Set the menu on the Alternative Menu.
- Save the Menu
8. How to Setup Slider / Banner?
The image below shows customizer options for the sections shown above :Slider
- From Customize section, go to Home Page.
- Go to Slider.
- Under Choose Post Option, select Slider.
- Under Select Category, select a category you want to use as a slider. The posts which falls under this category will be treated as slider.
- Check Auto Play option for automatic slide.
- Provide the time in second.
- Click Save & Publish.
Banner
- From Customize section, go to Home Page.
- Go to Slider.
- Go to Single Banner.
- Under Choose Post Option, select Slider.
- Under Select Post, select a post you want to use as a banner.
Note: Slider will use the post's featured images. Dummy image will be used if a post does not have featured image.
br>
Control Section
- From Customize section, go to Home Page.
- Go to Slider.
- Check Show Control to activate it.
- Click Save & Publish.
Note: Control section is available only for Slider not for Single Banner.
Video Section
- From Customize section, go to Home Page.
- Go to Slider.
- Select a page udner Youtube Video Url.
- Click Save & Publish.
Note: The page you selected must contain a link of youtube video inorder to activate it.
9. How to manage Highlighted Posts?
Go to Appearance > Customize > Highlighted Posts- Select posts
- Hide/Show Highlighted Posts Section
10. How to Manage Testimonials?
Go to Appearance > Customize > Testimonial
- Select Pages
Available Options;
- Hide/Show Testimonial Section
If preview is fine, Click on Save & Publish to save the changes.
11. How to manage Page Templates?
Go to Appearance > Customize > Page Templates
Service Page Template
- Select Pages
If preview is fine, Click on Save & Publish to save the changes.
FAQ Page Template
- Select Pages
If preview is fine, Click on Save & Publish to save the changes.
Contact
- Select Pages
Add Contact Form 7 Shortcode to activate form in your theme. If preview is fine, Click on Save & Publish to save the changes.
Please add following markups in your Contact Form to get better design and effect.
<div class="kt-contact-form-area"> <div class="kt-contact-form-area"> <div class="form-group"> [text* your-name id:cf-username class:form-control placeholder "Name *"] <label for="cf-username">Name <sup>*</sup></label> </div> <div class="form-group"> [email* your-email id:cf-email class:form-control placeholder "Email *"] <label for="cf-email">Email <sup>*</sup></label> </div> <div class="form-group"> [text* your-subject id:cf-subject class:form-control placeholder "Subject *"] <label for="cf-subject">Subject <sup>*</sup></label> </div> <div class="form-group"> [textarea* your-message id:cf-message class:form-control placeholder "Message *"] <label for="cf-message">Message <sup>*</sup></label> </div> <div class="form-group"> [submit id:cf-send class:form-control "Send Message"]<span class="ajax-loader"></span><button type="reset" class="cleaner">clear form <i class="fa fa-close"></i></button> </div> </div> </div>
12. How to manage Theme Options?
Go to Appearance > Customize > Theme Option
Available Options;
- Hide/Show Alternative Menu
- Hide/Show Sticky Sidebar
- Hide/Show Scroll top in mobile
- Inner Banner Image change option
If preview is fine, Click on Save & Publish to save the changes.