The Django Admin Ultimate Guide_Stripe API Integration copy.png

Django.tar.gz

django

django-lesson1

django-faker

django-rebranding

django-user-management

django-rebranding-changelist

django-migrations

django-add-view-index

empty

django-rebranding-old

In this course, you will learn the basics of the Django Admin interface, a great tool to build a powerful admin interface quickly for your Django project. 

First, you will learn how to automatically generate the admin interface for your Django models, how to populate fake data, and then search or filter data with some advice to improve performance. 

Next, you will see how to extend the functionalities of the admin interface such as adding custom fields, add intermediate pages, or creating custom actions like exporting data in CSV format.

After that, you will also explore basic and advanced UI customization such as adding charts or modifying the index page.Finally, you will have a look at the Django admin rights permission management.

The Django Admin for Web Developers

## Rebranding `base.html`

You are going to learn how to rebrand the `base.html` file and use the site layout of the template [SB ADMIN](https://startbootstrap.com/theme/sb-admin-2).

First, you are going to deal with static assets such as CSS, javascript, etcetera. In your `sample_app` directory, you will create a `static/admin` folder.

```
mkdir sample_app/static
mkdir sample_app/static/admin
```
Next, you will copy all the directories from **SB ADMIN** of the downloaded templates in your new `static/admin` directory:


Then you will modify your `settings.py` to define `STATIC_ROOT`

```python
STATIC_ROOT = 'static'
```
After this, you will launch a `collectstatic` command.

```cmd
python manage.py collectstatic
```

At this stage, you will have two folders. Your custom `sample_app/static/admin/` will contain the assets of the downloaded SB ADMIN template and your `/static/` folder in your main directory which will contain the default Django admin assets.


The difficult part will begin now. You will  study the structure of the Django Admin `base.html` file and the structure of the `index.html` of the SB Admin template. You  will migrate piece by piece the code of the SB template to your `base.html` file.

You will copy/paste the content of the `index.html` file of the **SB ADMIN** into the `base.html` file in `/sample_app/templates/admin/`.


Starting with the easy part, you will change the `<head>` of your `base.html` and include the new CSS and javascript. You can see the final changes highlighted in the code widget below (lines 10 - 45).

Scroll down to the end of your `base.html` file and replace the default assets with the static SB Admin assets (lines 286 - 303).


After implementing the changes explained above, everything about your Django Admin page will be lost. Every UI element will now be found in the new SB ADMIN template. The models have disappeared.


Hence you will make changes to get your models back on the Admin page. 

As the first step, you will replace the title of the admin with the real title (lines 60 - 64):

```html

<a class="sidebar-brand d-flex align-items-center justify-contentcenter" href="index.html">
  <div class="sidebar-brand-text mx-3">
    {{ site_header|default:_('Django administration') }}
  </div>
</a>
```

Now you will remove the user information part in the SB template, to include the Django user information. Fortunately, the HTML code is commented, so you can find the
`` and make changes accordingly. You can see the updated code in lines 159 - 210 of `base.html` present in the code widget below.


You will also have to set the title of the Admin in place of the Dashboard message. You will locate this word (in the Page heading section) and replace it with the correct code (line 219 - 229).

After the changes stated above, your admin page will look something like this:

# Rebranding `base.html`

You are going to learn how to rebrand the `base.html` file and use the site layout of the template [SB ADMIN](https://startbootstrap.com/theme/sb-admin-2).

First, you are going to deal with static assets such as CSS, javascript, etcetera. In your `sample_app` directory, you will create a `static/admin` folder.

```
mkdir sample_app/static
mkdir sample_app/static/admin
```
Next, you will copy all the directories from **SB ADMIN** of the downloaded templates in your new `static/admin` directory:


Then you will modify your `settings.py` to define `STATIC_ROOT`

```python
STATIC_ROOT = 'static'
```
After this, you will launch a `collectstatic` command.

```cmd
python manage.py collectstatic
```

At this stage, you will have two folders. Your custom `sample_app/static/admin/` will contain the assets of the downloaded SB ADMIN template and your `/static/` folder in your main directory which will contain the default Django admin assets.


The difficult part will begin now. You will  study the structure of the Django Admin `base.html` file and the structure of the `index.html` of the SB Admin template. You  will migrate piece by piece the code of the SB template to your `base.html` file.

You will copy/paste the content of the `index.html` file of the **SB ADMIN** into the `base.html` file in `/sample_app/templates/admin/`.


Starting with the easy part, you will change the `<head>` of your `base.html` and include the new CSS and javascript. You can see the final changes highlighted in the code widget below (lines 10 - 45).

Scroll down to the end of your `base.html` file and replace the default assets with the static SB Admin assets (lines 286 - 303).


After implementing the changes explained above, everything about your Django Admin page will be lost. Every UI element will now be found in the new SB ADMIN template. The models have disappeared.


Hence you will make changes to get your models back on the Admin page. 

As the first step, you will replace the title of the admin with the real title (lines 60 - 64):

```html

<a class="sidebar-brand d-flex align-items-center justify-contentcenter" href="index.html">
  <div class="sidebar-brand-text mx-3">
    {{ site_header|default:_('Django administration') }}
  </div>
</a>
```

Now you will remove the user information part in the SB template, to include the Django user information. Fortunately, the HTML code is commented, so you can find the
`` and make changes accordingly. You can see the updated code in lines 159 - 210 of `base.html` present in the code widget below.


You will also have to set the title of the Admin in place of the Dashboard message. You will locate this word (in the Page heading section) and replace it with the correct code (line 219 - 229).

After the changes stated above, your admin page will look something like this:

# Rebranding `base.html`

You are going to learn how to rebrand the `base.html` file and use the site layout of the template [SB ADMIN](https://startbootstrap.com/theme/sb-admin-2).

First, you are going to deal with static assets such as CSS, javascript, etcetera. In your `sample_app` directory, you will create a `static/admin` folder.

```
mkdir sample_app/static
mkdir sample_app/static/admin
```
Next, you will copy all the directories from **SB ADMIN** of the downloaded templates in your new `static/admin` directory:


Then you will modify your `settings.py` to define `STATIC_ROOT`

```python
STATIC_ROOT = 'static'
```
After this, you will launch a `collectstatic` command.

```cmd
python manage.py collectstatic
```

At this stage, you will have two folders. Your custom `sample_app/static/admin/` will contain the assets of the downloaded SB ADMIN template and your `/static/` folder in your main directory which will contain the default Django admin assets.


The difficult part will begin now. You will  study the structure of the Django Admin `base.html` file and the structure of the `index.html` of the SB Admin template. You  will migrate piece by piece the code of the SB template to your `base.html` file.

You will copy/paste the content of the `index.html` file of the **SB ADMIN** into the `base.html` file in `/sample_app/templates/admin/`.


Starting with the easy part, you will change the `<head>` of your `base.html` and include the new CSS and javascript. You can see the final changes highlighted in the code widget below (lines 10 - 45).

Scroll down to the end of your `base.html` file and replace the default assets with the static SB Admin assets (lines 286 - 303).


After implementing the changes explained above, everything about your Django Admin page will be lost. Every UI element will now be found in the new SB ADMIN template. The models have disappeared.


Hence you will make changes to get your models back on the Admin page. 

As the first step, you will replace the title of the admin with the real title (lines 60 - 64):

```html

<a href="index.html">
  <div>
    {{ site_header|default:_('Django administration') }}
  </div>
</a>
```

Now you will remove the user information part in the SB template, to include the Django user information. Fortunately, the HTML code is commented, so you can find the
`` and make changes accordingly. You can see the updated code in lines 159 - 210 of `base.html` present in the code widget below.


You will also have to set the title of the Admin in place of the Dashboard message. You will locate this word (in the Page heading section) and replace it with the correct code (line 219 - 229).

After the changes stated above, your admin page will look something like this:

Learn to customize the base.html file which is the  template for all pages in html.

Getting Started

Design Customization

Advanced Customization

Access and Rights Management

Conclusion

Rebrand base.html

Rebranding `base.html`