Setup PHP

Introduction

Skote – PHP is a simple and beautiful admin template built with Bootstrap 5.1.3 and PHP. It has 7+ different layouts and 3 modes ( Dark, Light & RTL ). It has working auth and email functionality. You can simply change to any layouts or modes by changing a couple of lines code. You can start small and large projects or update design in your existing project using Skote PHP. It is very quick and easy as it is beautiful, adroit, and delivers the ultimate user experience.

📁 Folder & Files Structure

PHP

├── Admin
├── Admin-Starterkit
├── php-auth-1
├── php-auth-2

├── Admin
    ├── assets directory
        ├── css
        ├── fonts
        ├── images
        ├── js
        ├── lang
        └── libs
    ├── layouts directory
    ├── vendor directory
    ├── skote_php.sql
    └── All php pages
Server Requirements

Please use the PHP version 7.0.33 or the latest one.

Installation

To setup the admin template, you can simply run as other PHP projects.

Description
Create a new database with name skote_php. Then import the skote_php.sql file in your database.
Configure the Database credentials in the config.php file.
You can test locally with signup as a new user to check all the pages.
How to use pre-built layouts?

For Vertical layout, Each of the layout options is provided below with steps you would need to perform in the layouts/body.php file:

image
Light Sidebar & Topbar Dark
Remove data attribute data-sidebar="dark" body element to have light sidebar. Add data attribute data-topbar="dark" body element to have a dark topbar.
image
Compact Sidebar
Keep your body element with data attribute data-sidebar-size="small" i.e. <body data-sidebar-size="small"> to have small sidebar.
image
Icon Sidebar
Keep your body element with class vertical-collpsed" i.e. <body class="vertical-collpsed"> to have icon sidebar.
image
Boxed Layout
Keep your body element with class vertical-collpsed and data attribute data-layout-size="boxed" data-keep-enlarged="true" i.e. <body class="vertical-collpsed" data-layout-size="boxed" data-keep-enlarged="true"> to have boxed layout with icon view sidebar.
image
Colored Sidebar
Keep your body element with data attribute data-topbar="colored" i.e. <body data-topbar="colored"> to have colored sidebar.
image
Scrollable
Keep your body element with data attribute data-layout-scrollable="true" i.e. <body data-layout-scrollable="true" > to have scrollable layout.
image
Preloader
In order to add pre-loader in your page, include following html after body element. <div id="preloader"> <div id="status"> <div class="spinner-chase"> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> </div> </div> </div>

For Horizontal layout, Please include include 'layouts/horizontal-menu.php'; in the layouts/menu.php
Each of the layout options is provided below with steps you would need to perform in the layouts/body.php file:

image
Topbar Light
Keep your body element with data attribute data-topbar="light" data-layout="horizontal" i.e. <body data-topbar="light" data-layout="horizontal"> to have light topbar and dark menubar.
image
Colored Header
Keep your body element with data attribute data-topbar="colored" data-layout="horizontal" i.e. <body data-topbar="colored" data-layout="horizontal"> to have colored topbar and dark menubar.
image
Boxed Layout
Keep your body element with data attribute data-layout-size="boxed" data-layout="horizontal" i.e. <body data-layout-size="boxed" data-layout="horizontal"> to have boxed layout.
image
Scrollable
Keep your body element with data attribute data-layout-scrollable="true" data-layout="horizontal" i.e. <body data-layout-scrollable="true" data-layout="horizontal" > to have scrollable layout.
image
Preloader
In order to add pre-loader in your page, include following html after body element. <div id="preloader"> <div id="status"> <div class="spinner-chase"> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> </div> </div> </div>
Multi-Language Settings
  1. Let's add a new language Italy.
    Create an it.php file in the assets/lang folder. And refer to the other languages to add or update the keys and values for translation.
  2. You need to add a new language in the topbar dropdown in the file layouts/topbar.php file and fin the class "language-switch". You can add a new language flag so it will be able to render in the topbar.
  3. You can use <?php echo $language["Forms"]; ?> in the view.
Email Settings

You can configure the email credentials in the config.php file.
NOTE: Manage your google account security with "Allow less secure apps" to ON. You check the setting from this link https://myaccount.google.com/lesssecureapps?gar=1.

Tips

CSS: We suggest you do not change any scss files from the assets/scss/custom folders because to get new updates will break your CSS changes if any you have made. We strongly suggest you create a new custom.css file and use that instead of overwriting any template's custom CSS files.

© Themesbrand.
Crafted with by Themesbrand