Creative
Introduction Features Installation Folder Structure Dependencies Template Structure Fonts Icons References Support

Thank you very much for your purchase!

If you have any questions that are beyond the scope of this documentation, please feel free to email or contact us via my page.

Introduction

Template Name: Creative - Multipurpose Template

Version: 1.0.0

Created On: 30 May 2020

Author: LettStartThemes

Email: support@LettStartThemes.com

Creative - Multipurpose template is the complete package that was built to help you create a custom and unique user interface for your project.

With Creative - Multipurpose template you’re not limited to creating a single web page. You’ll have over many pre-built page templates to choose from, covering many popular scenarios and content types. All the page templates are highly customizable.

Creative - Multipurpose template comes with 14 different templates. Creative is a responsive HTML template that is based on the CSS framework Bootstrap 4 and it is built with preprocessor SCSS. SCSS compiler makes it easier to code and customize. If you are unfamiliar with Bootstrap or SCSS, visit their website and read through the documentation. All of Bootstrap components have been modified to fit the style of creative and provide a consistent look throughout the template.

Before you start working with the template, we suggest you go through the pages that are bundled with the theme.

Creative - Multipurpose template is packed with pages that come complete with documented code to simplify the customization process.

Thank you so much for choosing this template. Your comments and ratings would be highly appreciated. You have purchased this template so, you will get full support from us. We will update this template time to time and we want to hear from you for the future updates or for complete new templates. If you have any questions that are beyond the scope of this document, feel free to email at support@LettStartThemes.com

Template Features

  • HTML5 & SCSS
  • Bootstrap 4
  • jQuery
  • Gulp
  • 14 Homepage
  • Responsive Design
  • Contact Us integrated with PHP
  • All form with validation
  • Best Coding Standard followed
  • Pixel Perfect Design
  • Clean Code & Unique Design
  • Easy to Customize
  • Line Icons
  • Google Font's

Installation

After unzip the download pack, you'll found a Template Folder(DIST) with all the files (HTML Files + Assets).

You can view this Template in any browser, you can display or edit the Template without an internet connection.(May not works fonts).

After change in any files or you add any assets like javascript, css, images. You need to upload on the server. To upload file on server open your cpanel/controlpanel or open filezilla and upload the content/assets of the Template on your server's root directory.

Once the files are done uploading go to www.yourdomainname.com/index.html

Folder Structure

You can directly use the compiled and ready-to-use the version of the template. But in case you plan to customize the template extensively the template allows you to do so.

Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:

  • APP ├──
    • Dist ├──
      • ├── Assets/
        • ├── css
        • ├── js
        • ├── images
        • ├── fonts
        • ├── vendors
      • ├── HTML FIles
    • Documentation ├──
  • gulpfile.js
  • package.json

Gulp Installation and SASS Compilation

You need to install SASS and Gulp as Dependencies for this project if you want to customize it. To do this, you must have Node in your computer. We have setup GULP and Package file in the folder just you need to follow the steps.

Follow below steps after node/npm installation:-

1. Navigate to root folder where package.json placed.

2. Run command npm install. It will install all the dependencies in your current project.

3. To compile SASS file run command Gulp Watch. It will compile the scss file and watch the scss file also.

4. To combine/concate all js file into one run command CONCATJS.

5. To combine/concate all css file into one run command CONCATCSS.

Template Structure

All information within the main content area is nested within a body tag. The general template structure is pretty the same throughout the all template's. Here is the general structure of all the pages.

                                    
<!DOCTYPE html>
<html lang="en">

<head>
</head>

<body>

    <!--Header -->
    <header>
        <div class="container">
        </div>
    </header>
    <!-- Header End -->
    <!--Main -->
    <main>
        <!-- home intro -->
        <section class="creative-banner full-height-banner" id="home" data-scroll-index="0"></section>
        <!-- home intro end -->
        
        <!-- about us -->
        <section class="section-spacer" id="aboutUs" data-scroll-index="1"></section>
        <!-- about us end -->
        
        <!-- service -->
        <section class="pt-120 pb-90 bg-light" data-scroll-index="1"></section>
        <!-- service end -->
        
        <!-- counters -->
        <section class="counter-bg position-relative pt-100 pb-80" data-scroll-index="1"></section>
        <!-- counters end -->
        
        <!-- works -->
        <section class="section-spacer" data-scroll-index="2"></section>
        <!-- works end -->
        
        <!-- teams -->
        <section class="pt-120 pb-90 bg-light" data-scroll-index="3"></section>
        <!-- teams end -->
        
        <!-- pricing -->
        <section class="section-spacer mb-30" data-scroll-index="4"></section>
        <!-- pricing end -->
        
        <!-- testimonial -->
        <section class="section-spacer bg-light" id="testimonial" data-scroll-index="4"></section>
        <!-- testimonial end -->
        
        <!-- blog -->
        <section class="pt-120 pb-90" data-scroll-index="5"></section>
        <!-- blog end -->
        
        <!-- contact -->
        <section class="contact-map-section" data-scroll-index="6"></section>
        <!-- contact end -->
    </main>
    <!--Main end -->
    <!--Footer -->
    <footer></footer>
    <!--Footer end -->
    <!-- javascript -->
    <script src="assets/js/plugins.js"></script>
	<script src="assets/vendors/jquery-parallax/js/jquery-parallax-min.js"></script>
	<script src="assets/vendors/fancy-box/js/jquery.fancybox.min.js"></script>
	<script src="assets/vendors/slider/js/imagesloaded.pkgd.min.js"></script>
	<script src="assets/vendors/charming/js/charming.min.js"></script>
	<script src="assets/js/cursor.min.js"></script>
	<script src="assets/js/custom.js"></script>

</body>

</html>
                                    
                                
CSS
File Description
bootstrap.min.css creative uses the bootstrap v4.3.1. The core bootstrap file is being used in all the pages.
style.css This file is containing all common styles for all the pages.
JS
File Description
custom.js This is a main js file. It contains the custom JS code needed for features including layout, sidebar, etc.

Fonts

By default, the template loads this font from Google Web Font Services, you can change the font with the one that suits you best.

                                    
                                        @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900|Poppins:200,400,500,600,700");
                                    
                                

Body Fonts: Poppins

Heading Font: Roboto

Remember to change the font into variable.scss If you are using SCSS. Without using SCSS change in style.css

Icons

Line Icons: <i class="lni lni-eye"></i>

Font Awesome Icons: <i class="fa fa-eye"></i>

References

Term Website
jQuery http://jquery.com/
Bootstrap https://getbootstrap.com
Google Fonts https://fonts.google.com/
Magnific Popup https://dimsemenov.com/plugins/magnific-popup/documentation.html
jQuery Validation https://jqueryvalidation.org/
Owl Carousel 2 https://owlcarousel2.github.io/OwlCarousel2/index.html
Scroll It http://www.bytemuse.com/scrollIt.js/
Pixabay https://pixabay.com/
Unsplash https://unsplash.com/

All images is used to show demo. Please use your own images

This Template is not WordPress Theme, and can’t be installed in WordPress.

Support

Once again thank you for your purchase. I'll be happy to answer the the questions you have related to the theme. In case if you have any suggestion or feature, request please feel free to contact me, I'll try to implement it and will release as part of future updates.

You can generate ticket on support or send me mail at support@LettStartThemes.com . Reply times can be up to 12 / 24 hours Monday to Sunday. Please be patient when posting an issue as i work (IST+00:00) time zone.