We are pleased that you have chosen Chatzy template for your site and we will not disappoint you with your choice. Chatzy is an excellent template develop with a concise approach. The code written is a clean and well structured.
Chatzy is the most powerful & responsive template with all the modules and functions involved with an attractive design.
Chatzy template template is build focusing on HTML CSS3 SCSS & PUG works perfectly fine in all the browsers and it is powered by jQuery.
Chatzy template include 3 in 1 (chat app, landing-page & email template), 20+ inner pages
We request to have a look at our Chatzy manual to know brief about the template! We have compromised each and every detail for you in the manual that you will need.
If we are unable to answer your queries beyond our documentation, you are free to contact us through the themeforest support page with your site. We will be happy to cater you and will get back to you in no time.
Read the manual before jumping to start!
When you unpack downloaded archive from ThemeForest.net you'll get folder containing 2 folders.
First, you must download and install node.js. NPM stands for node packaged modules and is a way to manage development dependencies through Node.js.
Download the Node.js source code or a pre-built installer for your platform, and start developing, you can download it from nodejs.org
You can check it in your terminal window using these commands
node --version and npm --version.
Web pack is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.
Navigate to the root main/directory,default
Then use $ npm i command (install node js)
npm run build command (for run project)
Go to webpack.config.js
proxy: "localhost/Your project name"
If you want RTl template,just add RTL class to body tag.
If you want DARK template,just add dark class to body tag.
Chatzy include 6 color option, You need to change style css.
<link rel="stylesheet" type="text/css"
href="../assets/css/style1.css" >
<link rel="stylesheet" type="text/css"
href="../assets/css/style2.css" > <link rel="stylesheet" type="text/css"
href="../assets/css/style3.css" > <link rel="stylesheet" type="text/css"
href="../assets/css/style4.css" > <link rel="stylesheet" type="text/css"
href="../assets/css/style5.css" > <link rel="stylesheet" type="text/css"
href="../assets/css/style6.css" > ... as on
If you want to use another color, change $theme-deafult variable in style scss
$Primary color: #1c9dea;
<!--Google font-->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,600&display=swap"rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i&display=swap"rel="stylesheet">
<!-- Brand Logo -->
<div class="brand-logo">
<a href="messenger.html"> <img src="../assets/images/icon/icon.png" class="img-fluid" alt=""></a>
</div>
<!-- footer logo -->
<div class="footer-logo">
<img src="../assets/images/icon/icon.png" alt="">
</div>
...
<!--Chatzy-left-sidebar-->
<ul id="sub-menu" class="sm pixelstrap sm-vertical ">
...
</ul>
<!--chat-content-->
<ul id="sub-menu" class="sm pixelstrap sm-vertical ">
...
</ul>
<!--Chatzy-right-sidebar-->
<ul id="sub-menu" class="sm pixelstrap sm-vertical ">
...
</ul>
Chatzy template include 2 types of buttons
<a href="#" class="btn btn-solid">Login</a>
<a href="#" class="btn btn-outline">Logout</a>
<div class="footer-end">
<p><i class="fa fa-copyright" aria-hidden="true"></i> 2024-25 template forest powered by pixelstrap</p>
</div>
if you do not want second image in page, remove Back div
<!--swipe Right-sidebar-->
<div class="front">
<a href="blog-page(no-sidebar).html"></a>
</div>