FAQS
How to Change Font Style ?
Step 1:
Go To _fonts.scss (assets/scss/custom/fonts/_fonts.scss )
if you want to change another font-family Go to the site Google Fonts And Slect One font Family and import In to style.css file
How to Select font Family
Example:
Step 2:
And paste Your Selected font-family in _fonts.scss
Example:
@import url('https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400;500;600;700;800&display=swap');
Step 3:
And add the Your Selected font-family in _bootstrap-styles.scss(assets/scss/bootstrap/_bootstrap-styles.scss)
Example:
body {
margin: 0;
font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 1.5;
color: #263871;
text-align: left;
background: #f1f4fb;
min-height: 100vh;
flex-direction: column;
justify-content: flex-start;
position: relative;
overflow-y: scroll;
}
How to Change Logo ?
Go To "assets/images/brand" folder and replace your logo with Previous Logos within in image size. note: Please don't increase logo sizes. Replace your logo within given image size. otherwise the logo will not fit in particular place it disturbs the template design.
How to Enable Darktheme?
open custom.js file go to SWITCHER-toggle and remove comments for dark-mode to enable dark-mode style as shown in below
/*Theme Layouts*/
//$('body').addClass('dark-mode');
dark-mode as shown below
/*Theme Layouts*/
$('body').addClass('dark-mode');
How to Enable Color-header?
open custom.js file go to Header Styles. and remove comments for color-header to enable color-header style as shown in below
/*Header Styles*/
//$('body').addClass('color-header')
color-header as shown below
/*Header Styles*/
$('body').addClass('color-header')
How to Enable Dark-header?
open custom.js file go to Header Styles. and remove comments for dark-header to enable dark-header style as shown in below
/*Header Styles*/
//$('body').addClass('dark-header');
dark-header as shown below
/*Header Styles*/
$('body').addClass('dark-header');
How to Enable Light-header?
open custom.js file go to Header Styles. and remove comments for light-header to enable light-header style as shown in below
/*Header Styles*/
//$('body').addClass('light-header');
light-header as shown below
/*Header Styles*/
$('body').addClass('light-header');
How to Enable Gradient-header?
open custom.js file go to Header Styles. and remove comments for gradient-header to enable gradient-header style as shown in below
/*Header Styles*/
//$('body').addClass('gradient-header');
gradient-header as shown below
/*Header Styles*/
$('body').addClass('gradient-header');
How to Enable Horizontalmenu light?
open custom.js file go to Horizontal-menu Styles. and remove comments for light-hormenu to enable light-hormenu style as shown in below
/*Horizontal-menu Styles*/
//$('body').addClass('light-hormenu');
light-hormenu as shown below
/*Horizontal-menu Styles*/
$('body').addClass('light-hormenu');
How to Enable Horizontalmenu Color?
open custom.js file go to Horizontal-menu Styles. and remove comments for color-hormenu to enable color-hormenu style as shown in below
/*Horizontal-menu Styles*/
//$('body').addClass('color-hormenu');
color-hormenu as shown below
/*Horizontal-menu Styles*/
$('body').addClass('color-hormenu');
How to Enable Horizontalmenu Dark?
open custom.js file go to Horizontal-menu Styles. and remove comments for dark-hormenu to enable dark-hormenu style as shown in below
/*Horizontal-menu Styles*/
//$('body').addClass('dark-hormenu');
dark-hormenu as shown below
/*Horizontal-menu Styles*/
$('body').addClass('dark-hormenu');
How to Enable Horizontalmenu Gradient?
open custom.js file go to Horizontal-menu Styles. and remove comments for gradient-hormenu to enable gradient-hormenu style as shown in below
/*Horizontal-menu Styles*/
//$('body').addClass('gradient-hormenu');
gradient-hormenu as shown below
/*Horizontal-menu Styles*/
$('body').addClass('gradient-hormenu');
How to Enable Verticalmenu light?
open custom.js file go to Left-menu Styles. and remove comments for light-menu to enable light-menu style as shown in below
/*Left-menu Styles*/
//$('body').addClass('light-menu');
light-menu as shown below
/*Left-menu Styles*/
$('body').addClass('light-menu');
How to Enable Verticalmenu Color?
open custom.js file go to Left-menu Styles. and remove comments for color-menu to enable color-menu style as shown in below
/*Left-menu Styles*/
//$('body').addClass('color-menu');
color-menu as shown below
/*Left-menu Styles*/
$('body').addClass('color-menu');
How to Enable Verticalmenu Dark?
open custom.jsfile go to Leftmenu Style. and remove comments for dark-menu to enable dark-menu style as shown in below
/*Leftmenu Styles*/
//$('body').addClass('dark-menu');
dark-menu as shown below
/*Leftmenu Styles*/
$('body').addClass('dark-menu');
How to Enable Verticalmenu Gradient?
open custom.jsfile go to Leftmenu Style. and remove comments for gradient-menu to enable gradient-menu style as shown in below
/*Leftmenu Styles*/
//$('body').addClass('gradient-menu');
gradient-menu as shown below
/*Leftmenu Styles*/
$('body').addClass('gradient-menu');
How to Enable boxed layout?
open custom.jsfile go to Boxed Layout. and remove comments for boxed to enable Boxed Layout as shown in below
/*Boxed Layout Start*/
// $('body').addClass('boxed');
Boxed Layout as shown below
/*Leftmenu Styles*/
$('body').addClass('boxed');
How to Enable closed-menu?
open custom.js file and remove comments for Closed Sidemenu to enable closed menu style as shown in below
/*Closed Sidemenu Start*/
// $('body').addClass('closed');
// $('body').addClass('sidenav-toggled');
/*Closed Sidemenu End*/
Closed Sidemenu as shown below
/*Closed Sidemenu Start*/
$('body').addClass('closed');
$('body').addClass('sidenav-toggled');
/*Closed Sidemenu End*/
How to Enable Hover-submenu?
open custom.js file and remove comments for Hover-submenu to enable Hover-submenu-style style as shown in below
/*Hover Submenu Start*/
// $('body').addClass('hover-submenu');
// $('body').addClass('sidenav-toggled');
/*Hover Submenu Start*/
hover-submenu as shown below
/*Hover Submenu Start*/
$('body').addClass('hover-submenu');
$('body').addClass('sidenav-toggled');
/*Hover Submenu Start*/
How to Enable Hover-submenu-style1?
open custom.js file and remove comments for Hover-submenu1 to enable Hover-submenu-style1 style as shown in below
/*Hover Submenu1 Start*/
// $('body').addClass('hover-submenu1');
// $('body').addClass('sidenav-toggled');
/*Hover Submenu Start*/
hover-submenu1 as shown below
/*Hover Submenu1 Start*/
$('body').addClass('hover-submenu1');
$('body').addClass('sidenav-toggled');
/*Hover Submenu Start*/
How to Enable Icon-overlay?
open custom.js file and remove comments for Icon-overlay to enable Icon-overlay style as shown in below
/*Icon-overlay Start*/
// $('body').addClass('icon-overlay');
// $('body').addClass('sidenav-toggled');
/*Icon-overlay Start*/
Icon-overlay as shown below
/*Icon-overlay Start*/
$('body').addClass('icon-overlay');
$('body').addClass('sidenav-toggled');
/*Icon-overlay Start*/
How to Enable Icon-text?
open custom.js file and remove comments for Icon-text to enable Icon-text style as shown in below
/*Icon-text Start*/
// $('body').addClass('icon-text');
// $('body').addClass('sidenav-toggled');
/*Icon-text Start*/
Icon-text as shown below
/*Icon-text Start*/
$('body').addClass('icon-text');
$('body').addClass('sidenav-toggled');
/*Icon-text Start*/
How to Enable RTL version?
open custom.js file and remove comments for RTL version to enable RTL version style as shown in below
/*RTL Layout Style*/
// $('body').addClass('rtl');
/*RTL Layout Style End*/
rtl as shown below
/*RTL Layout Style*/
$('body').addClass('rtl');
/*RTL Layout Style End*/