Cosine

Training, Coaching & Business WordPress Theme/h2>

---

• Demo: LineThemes
• Email: support@linethemes.com
• Support: LineThemes Support

Requirements

• PHP 5.3 or higher
• MySQL 5.0 or higher
• GD Library
• Self-Hosted WordPress 4.x

Support

Recommend

We recommend the plugins listed below to provide fully functionalities in use:

• nProjects by LineThemes
• WPBakery Visual Composer
• Shortcodes by LineThemes
• Revolution Slider
• Contact Form 7
• Woocommerce
• MailChimp for WordPress
• Breadcrumb Trail
• Slider comparison image before and after

Once you've downloaded the installation file on ThemeForest, extract it and locate a file called Cosine.zip. You can install the theme by using one of two installation methods:

Install by WordPress Theme Manager

This is probably the simplest way for most users. Here are 6 steps you need to take:

1. Login to your Admin page.
2. Navigate to Appearance > Themes.
3. Click Add New
   
4. Then click Upload Theme
   
5. Next, browse to the zip file and click Install now so the theme can be uploaded and installed.
   
6. After done installing, click Activate to publish the theme
   

Install through FTP upload

If you want to install via FTP, here are 3 steps you need to take:

1. Using FTP client, login to the server where your WordPress website is hosted
2. Using FTP client, navigate to the /wp-content/themes/ directory under your WordPress website's root directory
3. Using FTP client, upload the Cosine directory to themes directory on remote server

Once installation is complete, your Cosine theme will be ready to use.

Install Plugins

We recommend you to install the following plugins to provide more functionalities in use:

If you want to make your website look exactly like our demo, go to Appearance > Sample Data, on the next page, click Install Sample Data button.

To start customizing Cosine theme, in the Admin page please go to Appearance > Customize

Note:
Please remember to click Save & Publish button after done customizing to save the changes
These are global settings so its effect is site-wide. These settings can be overridden in single post or page

General

1. Site Information

   • Site Name: Your site name
   • Site Tagline: A few words to describe your site

2. Static Front Page

   • Static Front Page: This option allows you to switch between Static Page and Blog Page that will appear on the home page
   • Front Page: Select the page that you want to display as home page of your site
   • Posts Page: Select the page that will display blog posts

3. Misc

   • Enable Go Top Button: Turn on/off the go to top button
   • Tracking Code: Input your Google Analytics ID or script to track your site on Google
   • Custom Favicon: You can select or upload your custom favicon
   • Social Links: Just click to the icon and input the URL that you want to display on header or footer

Header

To setup header layout, please navigate to Appearance > Customize > Header section and choose one of available layouts. You can setup some other options that we listed below:

1. Custom Logo

   • Use Logo Image: When this option was turned on, the logo on header will be use as a custom image instead of your site name
   • Display Site Tagline: Turn on this option to show site tagline below logo on the header
   • Logo: The custom logo image
   • Logo Size: Input your logo dimension
   • Logo Margin: Input the top/bottom margin for logo

2. Navigator

   • Primary Menu: In the dropdown box, choose a menu that will be used as main menu.
   • Top Menu: In the dropdown box, choose a menu that will be shown on the top bar.

3. Header Options

   • Enable Sticky Header: Enable this option to stick the header on top of the page when scrolling down
   • Show Search Menu: Enable this option to show search icon on the primary menu

4. Topbar

   • Enable Topbar: Turn on/off to show/hide the topbar
   • Content: Enter the content that you want to display on the topbar
   • Enable Social Links: Turn on/off to show/hide social links on the topbar (The social links are configured on general section)

Footer

Footer was divided into 3 different sections: Content Bottom Widgets, Footer Widgets and Copyright & Social icons. The screenshot below will give you an explanation of these sections:

1. Content Bottom Widgets

   • Enable Content Bottom Widgets: Turn on/off to show/hide the footer widgets area
   • Widgets Layout: You can select how many areas will be displayed on footer widgets section. To customize areas layout, just drag it to match your wish

2. Footer Widgets

   • Enable Footer Widgets: Turn on/off to show/hide the footer widgets area
   • Widgets Layout: You can select how many areas will be displayed on footer widgets section. To customize areas layout, just drag it to match your wish
   • Widgets Background: Customize background for this section, it can be a solid color, image pattern or custom image
   • Text Color: Select the text color for this section

3. Custom Footer

   • Enable Social Links: Turn on/off to show/hide the social links on this section
   • Copyright: Just type the text that you want to display on footer copyright area

Layout & Styles

In the section Layout & Styles, we provide some options to customize the theme layout and styles.

1. Scheme Color

   With this option, you can change unlimitedly the accent color in your site

2. Layout

   • Display Style: You can choose between Boxed and Full width layouts
   • Boxed Background: With the boxed layout, you can modify page background with this option
   • Content Width: Maximum width of the content area

3. Sidebar

   • Sidebar Position: Select the position of the sidebar that will be displayed on page
   • Default Sidebar: In the dropdown box, select the sidebar that you want to display at the Sidebar Position selected above

4. Page Title

   • Enable Page Title: Turn on/off to show/hide the page title
   • Background: You can modify background of the page title with a solid color, image pattern or custom image
   • Eable Parallax Effect: Switch to ON to show parallax background effect for the page title
   • Text Color: Select the text color that will be displayed on page title

5. Breadcrumb

   • Enable Breadcrumbs: Turn on/off to show/hide the breadcrumbs
   • Breadcrumb Prefix: Enter prefix text for the breadcrumb
   • Breadcrumb Separator: Enter the character that you want to use as the separator of the breadcrumb

Typography

1. Body Font: You can select the font family, color, size or weight for the body text
2. Headings Font: You can select the font family, color, size or weight for the heading text
3. Menu Font: You can select the font family, color, size or weight for the menu text
4. Font Subsets: Turn ON to load subsets such as Cyrillic, Greek, Vietnamese, Latin, Devanagari when use Google fonts in some special languages

Blog

1. Blog List

   • List Sidebar Position: Select sidebar position on the posts page
   • Blog List Sidebar: In the dropdown box, select the sidebar that you want to display on posts page
   • Auto Post Excepts: When you turn on this option, the post's content will be truncated automatically on posts page
   • Post Excepts Length: This option is only available when you turn on "Auto Post Excepts". It use to limit the content length that is shown on posts page
   • Show Post Meta: Turn on/off to show/hide the post meta
   • Show Read More: Turn on/off to show/hide Read more button
   • Read More Text: You can modify the text of Read more button
   • Pagination Style: Select the style of pagination links on posts page
   • Posts Per Page: Enter the number of posts that will be displayed on posts page

2. Blog Single

   • Single Sidebar Position: Select sidebar position on the single blog post
   • Blog Single Sidebar: In the dropdown box, select the sidebar you want to display on single blog post
   • Show Post Navigator: Turn on/off to show/hide the post navigator
   • Post Navigator Sticky: Turn on this option to make the post navigator is sticky
   • Show Author Box: Turn on to show the author box below the post content
   • Show Related Posts: Turn ON to show the related posts box
   • Related Posts Style: Select style for the related posts box
   • Columns Of Related Posts: Select how many columns of the posts that will be displayed on the related posts box
   • Number Of Related Posts: Enter the number of posts you want to display on the related posts box

Projects

1. General

   • Projects Page: Select page you want to display on general Project page
   • Category Permalink Base: gallery-category
   • Tag Permalink Base: gallery-tag

2. Project Archive

   • List Sidebar Position: Select position for Sidebaron Portfolio page (No Sidebar/Left/Right)
   • Portfolio List Sidebar: Select which sidebar will be displayed on the Portfolio page
   • List Layout: Select layout style for Portfolio page (Grid/Masonry/Gallery/Justify)
   • Grid Columns: Select how many columns will be display on Portfolio page
   • Show Items Filter: Turn on/off to show/hide Project Filter
   • Pagination Style: Choose style for Pagination (Pager/Numeric/Page & Numeric/Readmore)
   • Post Per Page: Choose how many posts will be displayed on each Project page

3. Project Single

   • List Sidebar Position: Select position for Sidebar on Single Portfolio page (No Sidebar/Left/Right)
   • Single Project Sidebar: Select which sidebar will be displayed on Single Portfolio page
   • Gallery Type: Select layout style for Single Portfolio page (List/Grid)
   • Gallery Columns: Select how many columns will be display on Single Portfolio page
   • Show Featured Image In Header: Turn on/off to show/hide Featured image
   • Show Single Navigator: Turn on/off to show/hide Single Navigator

4. Related Projects

   • Show Related Projects : Turn on/off to show/hide Related Projects
   • Widget Title: Input title for Widget
   • Show Related Items Based On: Choose Related items base on Tag/Category/Random/Recent
   • Related Project Style: Choose style Grid/Grid Masonry/Grid No Margin for Related project
   • Columns Count: Select how many columns will be displayed on Related Projects
   • Number Of Related Projects: Input how many Related Projects will be displayed

WooCommerce

1. Products Listing

   • Sidebar Position: Select position for Sidebar on Products Listing page (No Sidebar/Left/Right)
   • Products Per Page: Enter the number of products which will be displayed on each Products Listing page

2. Product Details

   • Sidebar Position: Select position for Sidebar on Products Details page (No Sidebar/Left/Right)
   • Show Related Products: Turn On/Off to Show/Hide Related Products
   • Number Of Related Products: Enter the number of Related Products you want to display on the Related Products box

Under Construction

1. Enable Under Construction: Turn ON this option to enable the under construction mode
2. Under Construction Page: In the dropdown box, select the page you want to use as under construction page
3. Allowed Access by Roles: Select the role which has permission to access your site while it is in the under contruction mode

Menus

This section can be used to edit/add/reorder Menus

Widgets

This section can be used to edit/add/reorder Widgets

To create a new blog post, go to Posts > Add New on the admin panel.

1. Enter a title for your post in the text field near the top.
2. Next, on the right side of your screen, there is a section called Format, please choose a format for your blog post. Now, let's go over the available options:
   • Standard: This is the default blog format. You can start adding content with the Visual Editor.
   • Gallery: When you select this format, an image slider will be created on top of the page. All images of this slider must be added to the field "Gallery Images" in box "Post Options"
   • Link: When you select this format, the post title will be linked to the URL you input in the field "External Link" in the box "Post Options"
   • Quote: This format will make the post is presented as a quote
   • Video: When you select this format, a video player will be created on top of the page. The video URL must be added to the field "Video URL" in box "Post Options"
   • Audio: When you select this format, an audio player will be created on top of the page. The audio URL must be added to the field "Audio URL" in box "Post Options"

Now it's time to categorize this post.

1. Under Format section, there is a section called Categories, select the category that you want to assign to this post. Morover, if you'd like to create a new category, click on "+ Add New Category" A text field will unfold where you can enter a name for the category.
2. Then click on "Add New Category".
3. Once selected the category you want, click the "Publish button".
4. Under the Categories section are the Tags and Featured Image sections. Here you can add some tags to your post, and upload an image that will be displayed as the Featured Image (the representative image) of the post in the blog list pages.

Now, you've finished the setting for your blog post.

Creating your own page has been never so easy. To make the first step please go to Pages > Add new. At first sight, everything looks just like in default WordPress. But when you look at Visual/HTML area you will see some Page options or on Page Attribute panel, you will see some Page templates that we will explain below.

Page Templates

When creating a new page, one of the first things you might want to do is to assign a suitable template for it. To do this, please find the Page Attributes section on the right of the page editor. It comes with a variety of templates to choose:

1. Default Template: Choose this one if you want to create a standard page
2. Blog: Choose this one if you want to create a page for listing blog posts
3. Page - Blank: Choose this one if you want to create a page without header and footer
4. Project: Choose this one if you want to create a page for listing projects

Page Options

Beside the variety page templates, we offer a number of options to customize each page easily such as: sidebar position, page title, page header background, breadcrumb options. These options will override the global options of the theme in Appearance > Customize settings.

1. SideBar: When enable this option, you can override the Sidebar settings
2. Page Title: When enable this option, you can override the page title settings
3. Breadcrumbs: Select the Breadcrumb state (enable/disable)
4. Top Bar: Select the Top Bar state (enable/disable)
5. Primary Menu: Assign a menu to the primary menu location of this page
6. Top Menu: Assign a menu to the top menu location of this page

Cosine is built with several custom shortcodes that will make life easier when creating content. To use these custom shortcodes, just open the visual composer and add the elements you need to use.

This theme support 10 widgets areas listed below:

1. Primary Sidebar widget: This is the default sidebar, it will be displayed on the left or right of your page depend on the sidebar position you choose.
2. Header widget: This area will be used to display header widgets (Now, it displays Call Us Now, Opening Times, Request a Quote in header)
3. Footer widget #1 to #4: This areas will be used to display footer widgets
4. Content Bottom widget #1 to #4: This areas will be used to display content bottom widgets

Beside the built-in sidebar areas, we provide a feature called "Custom Sidebar". With this feature, you can create unlimited sidebar areas. To create a custom sidebar, just navigate to Appearance > Widgets you will see the box "Create Widget Area" on the right. Please enter the sidebar title as you want and click to "Create" button, a custom sidebar will be created.

To remove a custom sidebar, in Appearance > Widgets please open the sidebar that you want to remove. Click button "remove this are"

Cosine theme provides a special section which allow you to add custom CSS and Javascript into the theme quickly. Just navigate to Appearance > Advanced and start adding your custom code. This code will be stored in your database.

Contact form is not a built-in feature because there are variety choices of available third-party plugins. The free one we recommend is Contact Form 7 which can be used to add forms anywhere in your site!

Images

• Photos: The images used on the demo site are for demonstration purposes only and are not included in the download file.
• Icons Font
  • Font-Awesome (http://fontawesome.io/)
• Javascript
  • jQuery (http://jquery.com/)
  • jQuery UI (http://jqueryui.com/)
  • jQuery Countdown (http://rendro.github.io/countdown/)
  • jQuery CounterUp (https://github.com/bfintal/Counter-Up)
  • Flexslider (http://flexslider.woothemes.com)
  • Isotope (http://isotope.metafizzy.co/)
  • WayPoints (http://imakewebthings.com/jquery-waypoints/)
  • PrettyPhoto (http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/)
  • Images Loaded (http://desandro.github.io/imagesloaded/)
  • FitVids (http://fitvidsjs.com/)
  • OWL Carousel (http://owlgraphic.com/owlcarousel/)