Работа с шаблонами
Переходим в конфигурационный файл, и находим параметр TEMPLATES, проверяем пути наших шаблонов 'DIRS': [BASE_DIR / 'templates'].
BASE_DIR - это папка нашего проекта Django.
templates - это папка с нашими шаблонами, где мы будем работать с html файлами для вывода контента.
Создадим файл main.html в корневой папке шаблонов, общий путь будет templates/main.html:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Блог 2.0</title>
</head>
<body>
{% block content %}
{% endblock %}
</body>
</html>
Я думаю что вы помните, что {% block content %} отвечает за вывод определенного контента, когда мы наследуем главную страницу в других шаблонах с помощью {% extends 'template_name.html' %}, этот тег обязательно необходимо закрыть с помощью {% endblock %}
Внутри корневой папки templates создадим папку blog, в которой добавим файл post_list.html со следующим содержимым:
{% extends 'main.html' %}
{% block content %}
{% for post in posts %}
<img src={{ post.thumbnail.url }} alt={{ post.title }} width="150"/>
<strong>{{ post.title }}</strong>
<p>{{ post.description }}</p>
<small>{{ post.create }}</small>
<hr>
<span>{{ post.category.title }}</span>
<br>
{% endfor %}
{% endblock %}
Теперь нам все это необходимо проверить, давайте запустим сервер и добавим первую запись в наш блог. Для этого перейдем в админ панель и заполним необходимые поля:
Теперь перейдем на главную страницу нашего блога:
Если мы посмотрим нашу файловую структуру:
Мы видим что наши изображения превью хранятся не совсем правильно, когда у нас будет много постов, то количество файлов в данной папке будет очень много. И найти нужный файл или обслуживать проект будет не легко. Мы можем это улучшить, а именно разложить изображения по датам, чтобы мы могли знать, в какую дату было загружено изображение на наш сайт.
Поэтому внутри модели Post, в файле apps/blog/models.py мы изменим поле thumbnail, а именно параметр upload_to:
upload_to='images/thumbnails/%Y/%m/%d/',
Добавив /%Y/%m/%d/, это обозначает, что мы хотим сохранить изображение в по дате, например images/thumbnails/2023/10/28.
Теперь если мы удалим у той записи изображение, и добавим новое, то наша файловая структура будет выглядеть следующим образом:
Работа с заголовком
Также нам необходимо сделать получение заголовка страницы из нашего класса. Для этого в шаблоне main.html изменим тег title на следующий:
<title>{{ title }}</title>
А в класс PostListView добавим функцию обработки:
from django.views.generic import ListView
from .models import Post
class PostListView(ListView):
model = Post
template_name = 'blog/post_list.html'
context_object_name = 'posts'
def get_context_data(self, **kwargs):
context = super().get_context_data(**kwargs)
context['title'] = 'Главная страница'
return context
Функция get_context_data может использоваться для передачи содержимого или параметров вне модели в шаблон, что очень полезно. Например, в нашем случае мы передаем значение заголовка страницы.
Теперь если мы перейдем по адресу http://127.0.0.1:8000, мы увидим наш заголовок страницы.
Также у нас есть еще небольшая проблема, а именно то что нам приходится в ручную записывать slug для постов. Исправим её в следующем разделе и добавим возможность обработки кириллицы.