Chatriq Documentation v1.0.0
Thank you so much to see our template. This document is for the HTML version We are trying to explain about chatriq, if you have any questions about chatriq, please feel free to contact us.
Introduction
A Chatriq Taskmanager is modern and clean Bootstrap 4 based template. It is build using HTML, CSS3, JavaScript. We are using we are using CSS pre-processor SCSS. It is super easy to customize and 100% responsive. It can be used for most type of live chat, discussion and messenger type app templates, Live Chat, Also, you can create a social networking web app with a profile page, newsfeed and messenger.
It uses most of the helper/utilities classes which are reusable class that makes the page faster and increases the speed of page time load. This part of the doc will help you to quick start your project and will give you a basic idea about how this template work. For you to get start open the template download package. We have used gulp task runner so you can run and manager your application shorter, simpler and faster.
Files Structure
- chatriq
- demos
- LTR
- default-dark
- assets
- fonts/
- images/
- vendors/
- dist
- css/
- theme/
- js
- css/
- scss/
- index.html
- assets
- default-light
- assets
- fonts/
- images/
- vendors/
- dist
- css/
- theme/
- js
- css/
- scss/
- index.html
- assets
- default-dark
- RTL/
- LTR
- development
- app
- assets
- fonts
- images
- vendors
- dist
- css/
- theme/
- js
- css/
- scss/
- index.html
- assets
- gulpfile.js
- package.json
- app
- documentations
- demos
Setup Development Environment
-
Install NodeJS
Before installing gulp and sass first you must have NodeJs installed, NodeJS will have npm (node packaged modules). Download and install Node.js from nodejs.org/en/download/
-
Gulp Setup
Before installing gulp first you must have NodeJs installed, NodeJS will have npm (node packaged modules).Download and install Gulp JS from https://gulpjs.com/
Gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.
npm install --global gulp-cli
If you have previously installed a version of gulp globally, please run npm rm --global gulp to make sure your old version doesn't collide with gulp-cli.
npm rm --global gulp
Verify that gulp in successfully installed, and version of installed gulp will appear.
gulp --version
-
Install dependencies.
You're moments away to see the dashboard template up and running in your local machine. First, go to the root folder where the package.json located. In your download package it should be in the root folder. Please run the following command below.
npm install
This will download all dependencies defined in package.json file. Once it finished running the command, it will generate a folder name node_modules/ where you see downloaded files.
-
Running in Browser
Now you're good to go in running the template and preview it in browser by running the command below.
gulp default
This should automatically open up a browser window with the website running. Once the development server is up and running any changes you make to the HTML & JS & SASS files will be auto updated in your browser window.
Change Skin
-
Link CSS File
All theme CSS file are placed in dist/css/theme folder. Select a theme you wish to apply and link above close
<head>
tagChange class in body tag
List of pre-built theme class
.default-theme
.default-dark-theme
RTL Layout
-
Link RTL CSS File
RTL CSS file are placed in dist/css/ folder.
Change class in body tag
List of pre-built theme class
.default-theme .rtl
.default-dark-theme .rtl
References
We are using some JS and CSS plugins for creating chatriq Messaging Platform template.
Plugins/Libray Name | Link |
---|---|
jQuery | https://jquery.com/ |
Bootstrap | https://getbootstrap.com/ |
Material Floating Button | https://github.com/nobitagit/material-floating-button |
Perfect Scrollbar | https://github.com/mdbootstrap/perfect-scrollbar |
Slick | https://kenwheeler.github.io/slick/ |
Sortable | https://sortablejs.github.io/Sortable/ |
Material Design Icons | https://materialdesignicons.com/ |
SVG Icons | https://www.flaticon.com/ |
Customer Support
Our support generally operates from 9AM – 7PM GMT+5.30time from Monday –Friday.The support response time is 24-48 hours but normally we tend to settle thequestions as earlier as possible (even earlier than 24 hours).