Insoand - Startup and Technology Website HTML5 Template.
Insoand - Startup and Technology Website HTML5 Template.
Thank you for choosing our Template! Your support is greatly appreciated.
This document provides comprehensive instructions for installing and utilizing this Template. It
also addresses common problems and issues that you may encounter. If you have any questions or
concerns beyond what is covered in this document, please don't hesitate to reach out to us at
contact@insomniacafe.org Thank you for your continued support!
Template Features
Specialy Designed for Agency and Sass Website
Clean & Simple Design
HTML5 & CSS3
Bootstrap Latest
26+ Html Pages
Fully Responsive Design
PHP/Ajax Powered Working Contact Form
Easily Convert to any cms like Wordpress, Joomla and other popular cms.
All files are well commented
Cross Browser Compatible with IE11+, Firefox, Safari, Opera, Chrome
Animated Mouse Cursor Effect
Extensive Documentation
Insoand - Startup and Technology Website HTML5 Template
Installing Template.
After unzip the download pack, you'll found a Template Folder with all the files.
You can view this Template in any browser, you can display or edit the Template without an
internet connection.(May
not wotrk fonts).
The only section that will not work is the Contact Section which contains PHP code and
requires a server environment for send messages.
Now go to your cpanel or open your FTP Client (like
Filezilla) and
upload the content of the Template on your server root.
Once the files are done uploading go to www.yourdomainname.com/index.html
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 template. Here is the general structure of main page (index.html).
CSS Files and Structure
These are the css files that are loaded into templates in
Head Section.
Google Web 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.
These are the list of Javascript files that are loaded into templates in end of the
Body Section.
Install Sass
If you want to use Sass with Node.js, you'll typically use a package manager like npm (Node Package
Manager) to install the necessary Sass packages. Here's a step-by-step process to set up Sass using
Node.js
1. Install Node.js:
Ensure you have Node.js installed on your system. You can download it from the official website:
https://nodejs.org/ 2. Create a New Node.js Project:
Open a terminal and navigate to the directory where you want to set up your project. Then, run the
following command to initialize a new Node.js project:
npm init -y
3. Install Sass as a Dependency:
Install Sass as a dependency in your project using npm:
npm install --save-dev node-sass
4. Compile Sass to Css
Create a script in your package.json to compile your Sass files to CSS. Open your package.json file
and add a script like this:
Please use this code in your package.json
5. Compile Sass to CSS using npm script:
Run the script to compile Sass to CSS using the following command:
npm run dev
Contact Form
This is a PHP Script for sending messages to your email, you should replace
youremail@gmail.com to your email to start receive messages.
if ($_SERVER["REQUEST_METHOD"] == "POST") {
# FIX: Replace this email with recipient email
$mail_to = "contact@insomniacafe.org";
How can i Change Logo?
1. Please open (index.html) file.
First you change your mobile menu offcanvase-menu logo.
Please go to line number 62. please add your own logo link. thanks
For Homepage One
2. Please goto Line Header Line No113 please add your own logo link.
For Homepage Two
2.1. Please goto Line Header Line No110 please add your own logo link.
For Hompage Three
2.2. Please goto Line Header Line No110 please add your own logo link.
For Hompage Four
2.2. Please goto Line Header Line No62 please add your own logo link.
How can i Change Video?
1. Please open (index.html) file and go to Hero area.
Go to line line number 205 and find a attribute name data-video-id="" Please put your youtube video link. I mentioned and arrow symbol indicate in screenshot below.
How can i Change Slider?
1. Please open (index.html) file and go to Hero Slider and finds slider images link the code mentioned by the arrow symbol in screenshot below.
How can i Change Section Title?
Please open (index.html) file and go to any section area and you can find two html block label elements one is h6 and one is h3.
Please Remember: H6 used for sub-title of sub-heading of any section, and h3 used for section title.
Please See the screenshot Below.
How can i Change Team?
Please open (index.html) file and go to Team Section col-xl-3 col-lg-6 col-md-6 area and you can
find to change team image and team member name and her designation. follow screenshot below:
How can i Change Project?
Please open (index.html) file and go to any col-lg-4 col-md-4 area and you can find project image link and Project Title. Please follow the screenshot below:
How can i Change Breadcrumb?
Please open Any sub-pages without (index.html) file and go to breadcrumb area and you can find your solutions.
or follow screenshot below:
How can i Change Footer Logo?
Homepage one
Please open (index.html) file and go to footer area and go to line Number 541. and find your footer-logo change code. or follow screenshot below:
Homepage two
Please open (index-2.html) file and go to footer area and go to line Number 938. and find your footer-logo change code. or follow screenshot below:
Homepage three
Please open (index-3.html) file and go to footer area and go to line Number 800. and find your footer-logo change code. or follow screenshot below:
Homepage four
Please open (index-4.html) file and go to footer area and go to line Number 1164. and find your footer-logo change code. or follow screenshot below: