Rogan - Creative Multi-Purpose HTML Template v1.1

Thank you


First of all, thank you for purchasing the Rogan HTML Template. You can find the detailed information about the template in this document. If there is anything you cannot find in this document, you can send an e-mail via the profile page.

ROGAN IN A BRIEF

Rogan is a multi-purpose, powerful, beautiful and high-performance website template.
We have devided this template into two categories. In download folder you will find two folder:


Two templates are contained different home pages and inner pages. In element section, there are some common shortcode style and some are different. Remember, when you want to use the shortcode in any pages you need to adjust the section spacing by giving margin or padding. Don't get panic if you messed up anything when you edit the template. We are always available to support our customer.
You can contact our developer directly by email or in Fiverr. or in Upwork or in PPH

1Installation

Follow the steps below to setup your site template:

  1. Unzip the downloaded package and open the Template folder to find all the template files. You wil get rogan-b and rogan-c folder in there. Both are containing html folder. You will need to upload you desire template to your hosting web server using FTP in order to use it on your website.
  2. Below is the folder structure and needs to be uploaded to your website root directory:
    • html/css - Stylesheet files
    • html/fonts - Icon/fonts files
    • html/images - Image files
    • html/inc - contact from file
    • html/js - js files
    • html/vendor - plugins files
  3. You need to upload all or specific HTML files as per your need.
  4. And now you are ready to go to generate your webiste with this awesome template.

2HTML Structure

We are used Bootstrap4 framework in this template.
The general template structure is the same throughout the template. Here is the general structure.

The code block above is powered by SyntaxHighlighter.

3Favicon Settings

Favicon Will be found in head section.

        
        <link rel="icon" type="image/png" sizes="56x56" href="images/fav-icon/icon.png">

4Logo Settings

The Logo will be found in the Theme Main Menu section.

        <div class="logo"><a href="index.html"><img src="images/logo/logo.svg" alt=""></a></div>

You can replace any .jpg .png .svg logo.

5Fonts Settings

In rogan-b (Rogan- Business Agency Template) we use google fonts Roboto and one offline font gilroy
You can change both fonts form css/style.css file: 

            @import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700');
            @import url('../fonts/gilroy/fonts.css');

In rogan-c(Rogan- Creative Multi-Purpose Template) we use google fonts Lato , Playfair Display and one offline font circular-std
You can change both fonts form css/style.css file: 

            @import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,900,700|Playfair+Display:700');
            @import url('../fonts/circular-std/css/circular-std.css');

Activeted PHP Contact Form

You can edit your form simply and quickly. Open contact.php in inc folder and change following area


    <?php
/*
 *  CONFIGURE EVERYTHING HERE
 */

// an email address that will be in the From field of the email.
$from = 'Demo contact form ';

// an email address that will receive the email with the output of the form
$sendTo = 'Demo contact form '; // Add Your email here

// subject of the email
$subject = 'New message from contact form';

// form field names and their translations.
// array variable name => Text to appear in the email
$fields = array('sub' => 'Subject', 'email' => 'Email', 'message' => 'Message'); 

// message that will be displayed when everything is OK :)
$okMessage = 'Contact form successfully submitted. Thank you, I will get back to you soon!';

// If something goes wrong, we will display this message.
$errorMessage = 'There was an error while submitting the form. Please try again later';

?>

6CSS Structure

The style.css file contains all of the specific stylings for the page. The file is separated into sections using:

                	
/* EVENTR CSS 

    /*   01 - Loading Transition  */
/*   02 - Global style  */
/*   03 - Prefix  */
/*   04 - Theme button */
/*   05 - Transition */
/*   06 - Theme Color File  */
/*   07 - Theme Title  */
/*   08 - Theme Pagination  */
/*   09 - Theme Main Menu  */
    /*SASS MENU*/
    /*Theme Main Menu Two*/
    /*Theme Main Menu Three*/
    /*APP Menu*/
    /*Sticky Menu*/

/*   10 - Theme Main Banner One  */
/*   11 - Theme Main Banner Two  */
/*   12 - Theme Main Banner Three  */
/*   13 - Theme Main Banner Four  */
/*   14 - Theme Main Banne Five   */
/*   15 - What We Do/Agency  */
/*   16 - What We Do/SEO  */
/*   17 - About Us  */
/*   18 - Theme Counter  */
/*   19 - Our Gallery   */
/*   20 - Our Pricing/ Agency */
/*   21 - Pricing / APP */
/*   22 - Our Pricing/ SEO */
/*   23 - Testimonial  */
/*   24 - Testimonial/Portfolio  */
/*   25 - Testimonial/SASS  */
/*   26 - Testimonial/Apps */
/*   27 - Home Blog  */
/*   28 - Contact Banner/Agency   */
/*   29 - Contact Banner/SEO   */
/*   30 - Contact Banner/SASS   */
/*   31 - Theme Footer One   */
/*   32 - Our Goal   */
/*   33 - Our Service/SEO   */
/*   34 - Our Service/SASS   */
/*   35 - Our Service/APP   */
/*   36 - Work Progress/SEO   */
/*   37 - Home Portfolio   */
/*   38 - About Me / Portfolio   */
/*   39 - My SKill Section/Portfolio   */
/*   40 - Our Service/Portfolio   */
/*   41 - Our Project/Portfolio   */
/*   42 - Footer/Portfolio   */
/*   43 - Trsuted Partners/ SASS   */
/*   44 - Our Feature/SASS   */
/*   45 - Our Feature/APP   */
/*   46 - Our Pricing/SASS   */
/*   47 - FAQ Section/SASS   */
/*   48 - Why Choose Us/APP   */
/*   49 - Newsletter Section   */
/*   50 - Theme E-Commerce Menu   */
/*   51 - E-Commerce Home Page   */
/*   52 - Sidebar Menu   */
/*   53 - E-Commerce Hero Section   */
/*   54 - Product Filter Area/Sidebar   */
/*   55 - Product Showcase   */
/*   56 - Cart Page   */
/*   57 - CheckOut Page  */
/*   58 - Theme Solid Inner Banner  */
/*   59 - Shop Details   */
/*   60 - FAQ Page   */
/*   61 - Our Team Standard   */
/*   62 - Our Team Buisness   */
/*   63 - Our Team Classic   */
/*   64 - About Us Standard   */
/*   65 - Theme Counter Two   */
/*   66 - Video Action Banner One   */
/*   67 - Video Action Banner Two   */
/*   68 - Our Service Minimal   */
/*   69 - Our Service Standard   */
/*   70 - Our Service Creative   */
/*   71 - Our Service Modren   */
/*   72 - Our Project   */
/*   73 - Gallery Sidebar   */
/*   74 - Project Details   */
/*   75 - Our Blog   */
/*   76 - Blog Details   */
/*   77 - Contact us   */
/*   78 - Error Page   */
/*   79 - Shortcode style   */
    /*Accordion*/
    /*Breadcrumbs*/
    /*Counter*/
    /*List Item*/
 
 */

7JavaScripts

8Language Settings:

Go and find your language code from here : Languages Supported in Google Translate. Replace the language code in the html markup showing in image below:

9Mailchimp Settings:

Enter your subscription list url here:

10Credits