Skip to content

Commit c5dd4ab

Browse files
app-generatorapp-generator
committed
Django Volt Theme - DOCS Update
1 parent fac3cf9 commit c5dd4ab

File tree

3 files changed

+93
-32
lines changed

3 files changed

+93
-32
lines changed

‎docs/boilerplate-code/django-templates/argon-dashboard.mdx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
---
2-
sidebar_position: 2
32
description: >-
43
Open-source template for Django admin section styled with Argon Dashboard
54
Design (free version)

‎docs/boilerplate-code/django-templates/material-dashboard.mdx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
---
2-
sidebar_position: 3
32
description: >-
43
Open-source template for Django admin section styled with Material Dashboard
54
Design (free version)

‎docs/boilerplate-code/django-templates/volt-dashboard.mdx‎

Lines changed: 93 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,79 @@
11
---
2-
sidebar_position: 1
2+
title: Django Admin Volt - Open-Source Template
33
sidebar_label: Django Template Volt
4-
description: >-
5-
Open-source template for Django admin section styled with Volt Dashboard
6-
Design (free version)
74
---
85

9-
# Django Template Volt
6+
# [Django Admin Volt](https://appseed.us/product/volt-dashboard/django/)
107

11-
<SubHeading> Open-source template for Django admin section styled with Volt Dashboard Design (free version)</SubHeading>
8+
<SubHeading> Open-source Library for Django admin section styled with Volt Dashboard Design (free version)</SubHeading>
129

13-
Modern template for **Django admin interface** coded on top of Volt Dashboard (free version) from **Themesberg**. Volt Dashboard is a free and open-source Bootstrap 5 Admin Dashboard featuring over 100 components, 11 example pages, and 3 plugins with Vanilla JS.
10+
Modern template for **Django** that covers `Admin Section`, all authentication pages (registration included) crafted on top of **[Volt Dashboard](https://appseed.us/product/volt-dashboard/django/)**, an open-source `Bootstrap 5` design from `Themesberg`.
1411

15-
- [Django Template Volt](https://pypi.org/project/django-admin-volt/) - PyPi Page
16-
- [Django Volt Dashboard](https://appseed.us/product/volt-dashboard/django/) - Open-source starter that uses the same UI Kit
17-
- [Django Volt Dashboard](https://django-volt-dashboard.appseed-srv1.com) - LIVE Demo
12+
**Links & Resources**
1813

19-
## Why `Django Admin Volt`
14+
- [Django Admin Volt](https://github.com/app-generator/django-admin-volt) - `Source Code`
15+
- [Django Volt Dashboard](https://appseed.us/product/volt-dashboard/django/) - `Product` that uses the library (fully configured)
16+
- `Features`: Fully-configured, `CI/CD` via Render
17+
- UI Kit: Volt Dashboard BS5 `v1.4.1` by Themesberg
18+
- **Sections Covered**:
19+
- `Admin Section`, reserved for `superusers`
20+
- `All pages` managed by `Django.contrib.AUTH`
21+
- `Registration` page
22+
- `Misc pages`: colors, icons, typography, blank-page
23+
2024

21-
- Modern `Bootstrap 5` Design
22-
- `Responsive Interface`
23-
- `Minimal Template` overriding
24-
- `Easy integration`
25+
![Volt Dashboard - Full-Stack Starter generated by AppSeed.](https://user-images.githubusercontent.com/51070104/168843604-b026fd94-5969-4be7-81ac-5887cf0958e5.png)
2526

26-
![Django Admin Volt - Open-source Boostrap 5 Design (mobile view).](https://user-images.githubusercontent.com/51070104/196727476-d12f8ddc-4b41-412b-9b95-df3ee3c01ad4.png)
2727

28-
## Installation
28+
## How to use it
2929

30-
```
30+
> **Install the package** via `PIP`
31+
32+
```bash
3133
$ pip install django-admin-volt
3234
// OR
3335
$ pip install git+https://github.com/app-generator/django-admin-volt.git
3436
```
3537

36-
Add `admin_volt` application to the `INSTALLED_APPS` settings of your Django project `settings.py` file (note it should be before `django.contrib.admin`):
38+
> Add `admin_volt` application to the `INSTALLED_APPS` setting of your Django project `settings.py` file (note it should be before `django.contrib.admin`):
3739
38-
```
40+
```python
3941
INSTALLED_APPS = (
4042
...
4143
'admin_volt.apps.AdminVoltConfig',
4244
'django.contrib.admin',
4345
)
4446
```
4547

46-
> Collect static if you are in production environment:
48+
49+
> Add `LOGIN_REDIRECT_URL` and `EMAIL_BACKEND` of your Django project `settings.py` file:
50+
51+
```python
52+
LOGIN_REDIRECT_URL = '/'
53+
# EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
54+
EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
55+
```
56+
57+
58+
> Add `admin_volt` urls in your Django Project `urls.py` file
59+
60+
```python
61+
from django.urls import path, include
62+
63+
urlpatterns = [
64+
...
65+
path('', include('admin_volt.urls')),
66+
]
67+
```
68+
69+
70+
> **Collect static** if you are in `production environment`:
4771
4872
```bash
4973
$ python manage.py collectstatic
5074
```
5175

52-
> Start the app
76+
> **Start the app**
5377
5478
```bash
5579
$ # Set up the database
@@ -65,18 +89,57 @@ $ python manage.py runserver # default port 8000
6589

6690
Access the `admin` section in the browser: `http://127.0.0.1:8000/`
6791

68-
\
6992

70-
## Screenshots
93+
## How to Customize
94+
95+
When a template file is loaded in the controller, `Django` scans all template directories starting from the ones defined by the user, and returns the first match or an error in case the template is not found.
96+
The theme used to style this starter provides the following files:
7197

72-
> **Volt Theme** - `Admin Section`
98+
```bash
99+
< LIBRARY_ROOT > # This exists in ENV: LIB/admin_volt
100+
|
101+
|-- templates/ # Root Templates Folder
102+
| |
103+
| |-- accounts/
104+
| | |-- sign-in.html # Sign IN Page
105+
| | |-- sign-up.html # Sign UP Page
106+
| |
107+
| |-- includes/
108+
| | |-- footer.html # Footer component
109+
| | |-- sidebar.html # Sidebar component
110+
| | |-- navigation.html # Navigation Bar
111+
| | |-- scripts.html # Scripts Component
112+
| |
113+
| |-- layouts/
114+
| | |-- base.html # Masterpage
115+
| | |-- base-auth.html # Masterpage for Auth Pages
116+
| |
117+
| |-- pages/
118+
| |-- index.html # Index Page (presentation)
119+
| |-- settings.html # Settings Page
120+
| |-- dashboard.html # Dashboard page
121+
| |-- *.html # All other pages
122+
|
123+
|-- ************************************************************************
124+
```
73125

74-
![Django Admin Volt - Main Django Dashboard screen.](https://user-images.githubusercontent.com/51070104/136143245-85cd8af7-43ea-4956-8fcd-45e307171943.png)
126+
When the project requires customization, we need to copy the original file that needs an update (from the virtual environment) and place it in the template folder using the same path.
75127

76-
> **Volt Theme** - `Dashboard`
128+
For instance, if we want to customize the `footer.html` these are the steps:
77129

78-
![Django Admin Volt - Template project for Django provided by AppSeed.](https://user-images.githubusercontent.com/51070104/132288100-0c65159f-71a6-41f0-9f55-9544916385ae.jpg)
130+
- `Step 1`: create the `templates` DIRECTORY inside your app
131+
- `Step 2`: configure the project to use this new template directory
132+
- Edit `settings.py` TEMPLATES section
133+
- `Step 3`: copy the `footer.html` from the original location (inside your ENV) and save it to the `YOUR_APP/templates` DIR
134+
- Source PATH: `<YOUR_ENV>/LIB/admin_volt/includes/footer.html`
135+
- Destination PATH: `YOUR_APP/templates/includes/footer.html`
136+
- Edit the footer (Destination PATH)
79137

80-
---
138+
At this point, the default version of the `footer.html` shipped in the library is ignored by Django.
139+
140+
In a similar way, all other files and components can be customized easily.
141+
142+
## Resources
81143

82-
[**Django Admin Volt**](https://github.com/app-generator/django-admin-volt) - Modern Admin Interface provided by [**AppSeed**](https://appseed.us/)
144+
- 👉 [Django Volt Dashboard](https://appseed.us/product/volt-dashboard/django/) - `Product` that uses the library (fully configured)
145+
- 👉 Free [Support](https://appseed.us/support/) via Email & Discord

0 commit comments

Comments
 (0)