Introduction

• Fadmin Admin Template - Empowering Your Dashboard Experience
• Welcome to Fadmin, a sophisticated admin template meticulously crafted with Bootstrap 5.3.2 and powered by Gulp for seamless workflow management. Fadmin is designed to elevate your admin dashboard experience with a focus on simplicity, flexibility, and performance.
• You are important for us and so please feel free to get back to me with any question or feedback.

Key Features:

• Django 5.0:
• Leverage Django's built-in features for rapid development and clean, pragmatic design.

• Allauth
• Leverage Alluath's user management and social authentication features.

• Crispy forms
• Simplifies form rendering by providing a concise syntax for defining form layouts using Python classes or templates.

• Bootstrap 5.3.2:
• Leverage the latest advancements in web development with the robust foundation of Bootstrap, ensuring a responsive and modern interface.

• Gulp Integration:
• Streamline your development process with Gulp, facilitating efficient task automation and enhancing your workflow.

• Interactive Charts with Echarts and Apexchart
• Fadmin incorporates powerful charting libraries - Echarts and Apexchart, enabling you to visualize data in a compelling and dynamic manner.

• Light and Dark Theme Support:
• Choose between a light and dark theme according to your preferences or seamlessly switch between them to adapt to different environments.

• Layout Options:
• Fixed Layout: Opt for a stable and unchanging layout for a consistent user experience.
• Collapsible Sidebar Layout: Maximize screen real estate by collapsing the sidebar, offering a clean and focused view.

Why Fadmin ?

• User-Friendly Interface:
• Fadmin is designed with user experience in mind, ensuring a user-friendly interface for administrators and developers alike.

• Customizable and Extendable:
• Tailor Fadmin to your specific needs with its easily customizable and extendable structure, allowing you to adapt the template to your unique requirements.

• Responsive Design:
• Elevate your admin dashboard to new heights with Fadmin - where simplicity meets sophistication, and flexibility meets performance. Get started today and unlock the full potential of your administration tasks.

Getting Started Guide

This guide will walk you through the installation process and prerequisites to get your admin dashboard up and running smoothly.

• Prerequisites
• Before you begin, make sure you have the following prerequisites installed on your system:

• Node.js:
• Ensure that you have Node.js installed. You can download it fromnodejs.org.

• Gulp CLI:
• If you haven't installed Gulp globally, you can do so by running the following command:

• Git:
• Make sure to have Git installed globally & running on your computer. If you already have installed git on your computer, you can skip this step.

Installation Steps

Follow these simple steps to install and set up Fadmin Admin Template:

• Python:
• Install Python on your machine. You can download it from python.org.

• Check Pip version:
• Check pip version py -m pip --version
  Upgrade pip version upgread pip
  Install pip py -m pip install --upgrade pip
  
• Virtualenv:
• Create virtual env py -m venv virtualenv_name
  
• Activate virtual env virtualenv_name\Scripts\activate.bat
  
• Django install:
• pip install django
  
• Install python dependencies:
• pip install django-allauth
pip install django-crispy-forms
pip install crispy-bootstrap5
  

• Step 1: Unzip
  Unzip The Downloaded Folder and open it in vscode or any other code editor you use.

• Step 2: Navigate to the Project Directory
  Run the command cd ./Admin in the Terminal

• Step 3: Install Js Dependencies And Build Assets
  Run the following command to install the project dependencies:
  npm install
gulp

• Step 5: Migrations
  Run the following command to create all the required database tables and make sure you have activated virtual env:
  py manage.py makemigrations
py manage.py migrate

• Step 5: Run project
  Run the following command to start django server and enjoy development with Fadmin:
  py manage.py runserver

Visit http://localhost:8000 in your browser to view your Fadmin Admin Template.

• Customization
• Fadmin is highly customizable. Explore the project structure and configuration files to tailor the template to your specific needs. Key configuration files include:
• fadmin/settings.py:
• Customize all configurations of django here.
• Gulpfile.js:
• Customize Gulp tasks as needed.
• For More Customization use different files mention bellow in folder struction. please visit that section

Structure

I have tried my best to have standards and modular structure while developing the theme. Following sections are explaining the theme File & Folder, structure, html file struture and plugins.

Folder Structure

---

I have tried to follow the standards and modular structure while developing the theme. Let's take a look at the package structure:

Admin/
├── components/
│        └── App for components.
├── dashboards/
│       └── App for dashboards.
├── fadmin/
│       └── setting.py
│                       └── All django settings here.
├── pages/
│       └── App for extra pages.
├── public/
│       └── Built assets are here.
├── src/
│         └── All assets, scss, js and plugins are here.
└── templates/
        └── All html files are here.

 Documentation/
	└── index.html - documentation file for documentation.
    

HTML Structure

---

{% load static %}
{% include 'partials/main.html' with layout="vertical" %}
 <head>
    {% include 'partials/title-meta.html' %}
    {% include 'partials/head-css.html' %}
        
    {% block page_css %}
    {% endblock page_css %}
 </head>

 <body>
    {% include 'partials/navbar.html' %}

    {% block sidebar %}
    {% endblock sidebar %}

    <!-- Page Content -->
    <div class="page-content" >
        <!-- Page Inner -- >
        <div class="page-inner" >
            {% block content %}
            {% endblock content %}
        </div >
        <!-- footer -- >
        {% include 'partials/footer.html' %}
        <!-- right sidebar -- >
        {% include 'partials/right-sidebar.html' %}
    </div >
    {% include 'partials/vendor-scripts.html' %}

    {% block page_js %}
    {% endblock page_js %}
        
</body >

</html >
                    

CSS

---

Files are explained below:

File	Description
style.css	This file is containing all common styles for all the pages.

SCSS

---

Install Live Sass Compiler extention in your Visual Code Editor. Click the Watch Sass button at the right side footer of visual studio code.

Javascript

---

Files are explained below:

File	Description
custom.js	This is a main js file. It contains the custom JS code needed for features including layout, sidebar, etc.

Credits & Official Documentation

I've used the following resources as listed. These are some awesome creation and I am really thankful to the respective community.

File	Source / Link
Django	django 5.0
Django Allauth	django-allauth 0.61.0
Crispy Forms	django-crispy-forms 2.1
Crispy Bootstrap5	crispy-bootstrap5 2023.10
Bootstrap	bootstrap v5.3.2
Jquery	jquery v3.6.3
Simplebar	simplebar v6.2.5
Materialdesign Icons	materialdesignicons v7.4.47
Ionic Icons	ionicons v7.1.0
Font Awesome	fontawesome v6.5.1
Feathericons	feathericons v4.29.0
Themify Icons	themify-icons
Typicons	typicons v2.1.2
Drip icons	dripicons v2
Apex Chart	apexcharts
Echarts	echartsjs v4.0
Magnific-Popup	Magnific-Popup

Support

Once again thank you for purchasing the theme. I am always avaialble to help you. If you have any suggestion or feature to make it more better, I am requesting you to contact me, I'll try my best to add them in future updates.

Best,

ThemeBoss

Changelog

Version 1.0.0 - 13 Aug 2024

• Initial released