Thank you for purchasing the Avis Coming Soon template and the confidence you have placed in Dart Simple Solutions.

In this document, you will find an in-depth description of all the template's features and functionality. If you have any questions not attended to by our template documentation, please contact us so our team can assist you. If you like our template, please leave your feedback and join us on Facebook or your other favorite social network! We are looking forward to hearing back from you, and to improving further this and many other templates in our portfolio.

Online documentation is updated regularly and is available online to you free of charge on our website at http://doc.dartsimple.com

Developer website: http://www.dartsimple.com

Customer service: http://www.dartsimple.com/contact-us/



Key Features

  • Based On 1170px Grid System
  • MailChimp Integrated
  • Send email script integrated
  • Free Subscribe Email Management Tool
  • Free Google Fonts
  • Retina Ready
  • Unique Design & Super Clean Layout
  • All Files Are Well Commented
  • Built With Bootstrap 3x
  • Coded With Care Valid HTML5 / CSS3
  • Fully Responsive Layout
  • Over 580 Icons With Font Awesome 4
  • Beautiful CSS3 Animation
  • W3C Valid Code
  • Carefully Handpicked Google Fonts
  • Clean Source Code
  • Easy Installation & Updates
  • Easy To Customize


What you will Get with this Template

  • 1 Html File
  • 1 Homepage Layout
  • 1 Navigation Types
  • 1 About Us Layput
  • 1 Our Mission Layout
  • 1Team Layout
  • 1 Contact Us Layout


Email Management Tool

Template includes custom-developed subscriber email management tool that saves and keeps track of all subscriber emails on your Coming Soon website. You can use a separate dashboard to review and export this email data to CSV and to your MailChimp account.


How to Use

Step 1: Set your password

The tool is saved in folder Admin. In this folder, you will find the file "settings.ini". Please open this file with notepad and locate fields Login, Password, and save your username and password to be used to log in to the admin panel with email subscriber data. If integrating with MailChimp, please also locate the field "list_id" in the "settings.ini" file, and set its value to your MailChimp API Key (Please refer to MailChimp user manual for further details at developer.mailchimp.com/documentation/mailchimp/ ). Your email management tool is now ready to use.

Step 2:  Log in to Email Management Tool

Your tool will be available for login as soon as you upload it to your server. Login form will appear at the address yourdomain.com/admin. Once you load the form, please log in using the username and password set in Step 1. Upon logging in, you can review, edit, delete and export subscriber email data to CSV and to MailChimp.

Step 3: Savings Data is Automatic

The tool is integrated with your Coming Soon front-end HTML by default, and will be saving subscriber email data to your admin panel and to the subscribers.txt file automatically.


About the Theme

Avis Coming Soon Template is a fully responsive HTML template with clean, unique modern design and integrated animated countdown. Countdown lets your users know when the site will be launched. Also included in an easy-to-use subscriber email management tool with MailChimp integration and integrated send email script that will connect to your smtp server and send emails from your users. Each web page is 100% W3C compliant with clean, well-commented and fully valid code.


Folder Structure

Project structure was carefully thought all throughout early on in the planning stage to ensure  logical flow of all parts. Complete list of all project-related folders, files and documents can be found below.

├── Documentation/
├── TemplateAvis/
│   └── admin/
│       └── css/
│           └── *.css
│       └── img/
│           └── favicons/
│               └── *.jpg, *.png, *.ico
│           └── *.jpg, *.png, *.ico
│       └── js/
│           └── *.js
│       └── index.php
│       └── login.html
│       └── settings.ini
│       └── subscribers.txt
│       └── template.html
│   └── assets/
│       └── plugins/
│           └── bootstrap/
│           └── font-awesome/
│           └── jQuery/
│           └── flexslider/
│           └── slick/
│   └──css/
│       └── *.css
│   └── images/
│└── *.jpg, *.png
│       └── custom/
│           └── *.png
│       └── favicon/
│           └── *.jpg, *.png, *.ico
│       └── item-bg/
│           └── *.jpg
│       └── svg/
│           └── *.svg
│   └── js/
│   └── videos/ 
│   └── *.mp4
│  └── email.php
│   └── index.html


Project Folder Description

Folder Name



Main directory


Contains documentation about template, dependencies and short description

Template Avis

Main layout dirrectory


Contains mailchimp integration files and admin panel layout


Contains styles for admin panel


Contains images for admin panel


Contains javascript code for admin panel


Contains third party plugins


Contains main layout style files


Contains main layout omages


Contains favicon images and bookmark description


Contains background images for different screens


Contains svg icons


Contains javascript files of layout, plagins initiations and custom script


Contains access code to social networks and prepate posts from


Sendmail, used to send emails from the contact form.


HTML Structure

Markup Customization

The HTML structure of all our projects is split in logically organized sections that are easy to navigate. Below you will find listed each HTML section, starting from Header and ending with Footer, referencing the list of customizable settings available for each of them. In cases where additional options or settings are not provided by any given section's customization concept - HTML code and its structure is somewhat simplified. Given intuitive and logical flow of our code, you will be able to further adjust and customize it further with basic knowledge of HTML, CSS, JS.

Avis Template follows an easy-to-use method of customization via HTML data attributes placed in the <body> tag, so you can quickly tweak the code and adjust the appearance of your website. All customizable elements and relevant attributes are listed below for your convenience.

Sample code:

  data-deadline="30 May 2017 20:30:30 GMT-0400"
  data-email="[email protected] "
  data-text_counter="#87eafb, #2f5d94"
  data-flip_colors="#4c7fbe, #3868a2, #2d5381, #1e406a">


Data Attributes

Available Settings



Any date in provided format

Sets the date of project launch


facebook, twitter, instagram, pinterest

Setting social nework


1, 2, 3, 4

Setting counter type


SlideUp, SlideUp-3D, SlideUp-3D-Transparent, SlideRight,


Setting slide effect


videos/World.mp4, videos/Electronics.mp4,


videos/Colors.mp4, or some path to else video file

Setting background video for homepage slide







Setting base color for elements and background


HEX color in provided format

Color for counter gradient (start)


HEX color in provided format

Color for counter gradient (end)


HEX color in provided format

Color for background


HEX color in provided format

Color for counter text


HEX color in provided format

Color for flip counter




When customizing the template, you will be able to utilize a number of predefined color schemes. To do so, please add the CSS file with different color scheme under the template.css file to change the color theme of the template:

<link rel="stylesheet" href="css/template.css">

CSS Customization

You are often able to further customize the template by enabling or disabling many of the Avis'  stylesheets as necessary. You can do so by commenting out the code or deleting relevant lines altogether. List of stylesheets available in Avis template follows below:

In this template no such files that you can exclude.



In each page’s head section you will see a comprehensive list of meta tags that may come in handy down the road in helping Google crawlers make sense of your web-pages, thus improving your pages' relevance and consequently helping your website rank better in search results. Please uncomment those meta tags that you deem relevant and applicable to your website.

<!-- Personal Meta tags -->
<meta name="Tauri - Premium template" content="">

<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1">

<!-- Meta descriptions -->
<meta name="keywords" content="tauri, premium template, HTML template, Dart Simple" />
<meta name="description" content="Tauri - Premium template by Dart Simple">

<!-- Url of your website (without extra pages) -->
<link rel="canonical" href="http://yoursite.com/" />

<!-- Restrict google from scanning info from Dmoz or YahooDir -->
<meta name="robots" content="noodp,noydir"/>

<!-- Author markup -->
<meta name="author" content="Dart Simple - Premium HTML templates">
<meta name="copyright" content="Dart Simple">


Grid Markup

To ensure our templates are 100% responsive, we use Bootstrap grid and framework (http://getbootstrap.com/css/).


CSS Structure

Our projects maintain extended file structure with intuitive hierarchy of CSS documents and Avis is no exception to this rule. Full list of stylesheet files is available below for your review.

File Name



Bootstrap framework styles


Main template Styles


File for custom/addition styles


Stylesheet Structure

For large CSS documents we use a library with specific titles and subtitles designed for each specific section and subsection to simplify your searches throughout the code. To find any specific part of the code, please do a search for any of the titles and subtitles, which are listed below in-full for your convenience.


Avis - Premium template by Dart Simple 
Copyright 2017

Table of contents

01. Fonts
02. Main Layout
03. Slider
04. Modals
05. Customizer
06. Main slider
07. Counter
08. Validation
09. Responsive



Framework used

Twitter Bootstrap v3.3.7


jQuery v2.2.1


Slick v1.6.0



JavaScript Structure

When designing a theme or a template, we rely both on our own code, as well as on open-source plugins developed by third-parties. In this section, you will find detailed information on relevant plugins and their functions.

Plugins are initialized and can be edited in the lower part of the code for each HTML file as follows:

<!-- jQuery -->
<script type="text/javascript" src="assets/plugins/jQuery/jquery.min.js"></script>
<!-- Theme Plugins -->
<script type="text/javascript" src="js/wg-plugins.min.js"></script>
<!-- Theme scripts -->
<script type="text/javascript" src="js/wg-scripts.min.js"></script>
<!-- Theme Custom Scripts -->
<script type="text/javascript" src="js/wg-custom.js"></script>


JavaScript folder structure and contents

│   └── wg-scripts.min.js
│   └── wg-plugins.min.js
│   └── wg-custom.min.js


JavaScript Plugins Initialization

Below we provide the code used to initialize JavaScript plugins used in the template.


    dots: true,
    infinite: true,
centerMode: true,
slidesToShow: 3,
slidesToScroll: 3, 
    responsive: [{
        breakpoint: 750,
        settings: {
slidesToShow: 1


Callback Functions

Listed below are available callback functions and their relevant settings.

// Go to the next item

//Init slider



JavaScript Plugins and Credits


Used for carousel realization



Used for Grid, Modals, Main fetures style





Demo Video

  • Pixbay.com