First of all, thank you for purchasing the Jano
HTML5 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.
Jano is a multi-purpose, powerful, beautiful and high-performance website template which is Designed for Business and Corporate websites.
In download folder you will find Three folder:
Documentation
(Documentation for main template)Template
(Main Template)Figma file
(Free Figma File Download link)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. Follow the steps below to setup your site template:
Template
folder to find all the template files. You wil get Jano
folder in there. You need to upload this folder to your hosting web server using FTP or cPanel in order to use it on your website.Jano/css
- Stylesheet filesJano/fonts
- Icon/fonts filesJano/images
- Image filesJano/inc
- contact from fileJano/js
- js filesJano/vendor
- plugins filesWe are used Bootstrapv5.1.3
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.
Favicon Will be found in head
section.
<link rel="icon" type="image/png" sizes="56x56" href="images/fav-icon/icon.png">
The Logo will be found in the Theme Main Menu
section.
<div class="logo order-lg-0"><a href="index.html" class="d-block"><img src="images/logo/logo_01.png" alt="" width="95"></a></div>
You can replace any .jpg
.png
.svg
logo. And set the width
according to your logo size.
In Jano
we use gordita
and recoleta
font.
You can change both fonts form css/style.css
file:
@import url('../fonts/gordita/stylesheet.css'); @import url('../fonts/recoleta/stylesheet.css');
You can edit your form simply and quickly. Open contact.php
from inc
folder and add your email into $sendTo
field
<?php
/*
* CONFIGURE EVERYTHING HERE
*/
// an email address that will be in the From field of the email.
$from = 'Jano <demo@domain.com>';
// an email address that will receive the email with the output of the form
$sendTo = 'Jano contact form <demo@domain.com>'; // Add Your emnail here
// subject of the email
$subject = 'New message from Jano';
// form field names and their translations.
// array variable name => Text to appear in the email
$fields = array('name' => 'Name', 'email' => 'Email', 'message' => 'Message');
// message that will be displayed when everything is OK :)
$okMessage = 'Thank you, We 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';
?>
The style.css
file contains all of the specific stylings for the page. The file is separated into sections using:
This file includes core bootstrap styles
SourceThis file contains bootstrap icon library
Source
<i class="bi bi-person"></i>
This file contains styles about Fontawesome icon library
Source
<i class="fab fa-facebook-square"></i>
This file contains styles about fancybox
animate.css
is a bunch of cool, fun, and cross-browser animations for you to use in projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
<div class="wow fadeInUp">
...
</div>
This file contains styles about slick carousel plugin
SourceAll styles about template
jQuery is a fast, small, and feature-rich JavaScript library.
SourceCore bootstrap js file
SourcejQuery carousel plugin from Slick
SourceA lightweight script to animate scrolling.Reveal Animations When You Scroll.
SourcefancyBox is a tool that offers a nice and elegant way to add zooming functionality for images, html content and multi-media on your webpages.
SourceThis file contains all script about site.
dd/mm/yy
________________________________ ----- (15/08/2022) ------ Page Added: -About Us for agency -Service for agency -Contact Us for agency -Feature for Sass Product -Pricing for Sass Product -Hosting Plans + comparison -Hosting Technology -Contact Us for Hosting -About Us for Lead Generation -Contact Us for Lead Generation
________________________________ ----- (27/07/2022) ------ First Published