Skip to content

Commit 493b766

Browse files
committed
UPD Django Soft Design - App & Theme
1 parent d358821 commit 493b766

File tree

2 files changed

+231
-349
lines changed

2 files changed

+231
-349
lines changed
Lines changed: 148 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,148 @@
1+
---
2+
title: Django Theme Soft Design - Open-Source UI LIbrary
3+
sidebar_label: Django Theme Soft Design
4+
---
5+
6+
# [Django Theme Soft Design](https://appseed.us/product/soft-ui-design/django/)
7+
8+
<SubHeading> Open-source Theme for Django styled with Soft UI Design (free version)</SubHeading>
9+
10+
Modern Theme for **Django** that covers authentication pages (registration included) crafted on top of **[Soft UI Design](https://appseed.us/product/soft-ui-design/django/)**,
11+
an open-source `Bootstrap 5` design from [Creative-Tim](https://www.creative-tim.com/?AFFILIATE=128200).
12+
13+
**Links & Resources**
14+
15+
- [Django Soft Design](/products/django-apps/soft-ui-design/) - `Product` that uses the library
16+
- `Features`: Fully-configured, `CI/CD` via Render
17+
- UI Kit: [Soft Design System](https://www.creative-tim.com/product/soft-ui-design-system?AFFILIATE=128200) (Bootstrap 5) by `Creative-Tim`
18+
- **Sections Covered**:
19+
- `All pages` managed by `Django.contrib.AUTH`
20+
- `Registration` page
21+
- `Misc pages`: colors, icons, typography, blank-page
22+
23+
24+
![Soft UI Design - Full-Stack Starter generated by AppSeed.](https://user-images.githubusercontent.com/51070104/168812602-e35bad42-823f-4d3e-9d13-87a6c06c5a63.png)
25+
26+
27+
## How to use it
28+
29+
> **Install the package** via `PIP`
30+
31+
```bash
32+
$ pip install django-theme-soft-design
33+
// OR
34+
$ pip install git+https://github.com/app-generator/django-theme-soft-design.git
35+
```
36+
37+
> Add `theme_soft_design` application to the `INSTALLED_APPS` setting of your Django project `settings.py`:
38+
39+
```python
40+
INSTALLED_APPS = [
41+
"django.contrib.admin",
42+
"django.contrib.auth",
43+
"django.contrib.contenttypes",
44+
"django.contrib.sessions",
45+
"django.contrib.messages",
46+
"django.contrib.staticfiles",
47+
48+
'theme_soft_design', # <-- NEW
49+
]
50+
```
51+
52+
53+
> Add `LOGIN_REDIRECT_URL` and `EMAIL_BACKEND` of your Django project `settings.py` file:
54+
55+
```python
56+
LOGIN_REDIRECT_URL = '/'
57+
# EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
58+
EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
59+
```
60+
61+
62+
> Add `theme_soft_design` urls in your Django Project `urls.py` file.
63+
64+
```python
65+
from django.urls import path, include # <-- UPD with 'include' directive
66+
67+
urlpatterns = [
68+
...
69+
path('', include('theme_soft_design.urls')), # <-- NEW
70+
]
71+
```
72+
73+
74+
> **Collect static** if you are in `production environment`:
75+
76+
```bash
77+
$ python manage.py collectstatic
78+
```
79+
80+
> **Start the app**
81+
82+
```bash
83+
$ # Set up the database
84+
$ python manage.py makemigrations
85+
$ python manage.py migrate
86+
$
87+
$ # Create the superuser
88+
$ python manage.py createsuperuser
89+
$
90+
$ # Start the application (development mode)
91+
$ python manage.py runserver # default port 8000
92+
```
93+
94+
Access the `admin` section in the browser: `http://127.0.0.1:8000/`
95+
96+
97+
## How to Customize
98+
99+
When a template file is loaded, `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.
100+
The theme used to style this starter provides the following files:
101+
102+
```bash
103+
# This exists in ENV: LIB/theme_soft_design
104+
< UI_LIBRARY_ROOT >
105+
|
106+
|-- templates/ # Root Templates Folder
107+
| |
108+
| |-- accounts/
109+
| | |-- sign-in.html # Sign IN Page
110+
| | |-- sign-up.html # Sign UP Page
111+
| |
112+
| |-- includes/
113+
| | |-- footer.html # Footer component
114+
| | |-- navigation.html # Navigation Bar
115+
| | |-- scripts.html # Scripts Component
116+
| |
117+
| |-- layouts/
118+
| | |-- base.html # Masterpage
119+
| |
120+
| |-- pages/
121+
| |-- index.html # Dashboard Page
122+
| |-- author.html # Profile Page
123+
| |-- *.html # All other pages
124+
|
125+
|-- ************************************************************************
126+
```
127+
128+
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.
129+
130+
For instance, if we want to customize the `index.html` these are the steps:
131+
132+
- `Step 1`: create the `templates` DIRECTORY inside your app
133+
- `Step 2`: configure the project to use this new template directory
134+
- Edit `settings.py` TEMPLATES section
135+
- `Step 3`: copy the `index.html` from the original location (inside your ENV) and save it to the `YOUR_APP/templates` DIR
136+
- Source PATH: `<YOUR_ENV>/LIB/theme_soft_design/templates/pages/index.html`
137+
- Destination PATH: `YOUR_APP/templates/pages/index.html`
138+
- Edit the `index.html` (Destination PATH)
139+
140+
At this point, the default version of the `index.html` shipped in the library is ignored by Django.
141+
142+
In a similar way, all other files and components can be customized easily.
143+
144+
145+
## Resources
146+
147+
- 👉 [Django Material Kit](https://appseed.us/product/material-kit/django/) - `Product` that uses the library (fully configured)
148+
- 👉 Free [Support](https://appseed.us/support/) via Email & Discord

0 commit comments

Comments
 (0)