Django формы - отображение HTML <pre>фрагментов кода внутри рендеринга {{ form.text }}
У меня есть блог, настроенный на Django, который я использую для публикации некоторых своих заметок и личных рекомендаций. У меня есть модель articles
, которая получает данные из form
, отображаемого в template
. Приложение отображает мои статьи, размещенные динамически в шаблоне. Моя цель - включить фрагменты кода в виде <pre> tag
в данные формы, которые я размещаю, написав при этом как можно меньше HTML.
models.py
from django.db import models
from django.contrib.auth import get_user_model
from django.db import models
from django.urls import reverse
class Article(models.Model):
title = models.CharField(max_length=100)
body = models.TextField()
date = models.DateTimeField(auto_now_add=True)
author = models.ForeignKey(
get_user_model(),
on_delete=models.CASCADE,
)
def __str__(self):
return self.title
def get_absolute_url(self):
return reverse('article_detail', args=[str(self.id)])
views.py
from django.shortcuts import render
from django.contrib.auth.mixins import LoginRequiredMixin, UserPassesTestMixin
from django.views.generic import ListView, DetailView
from django.views.generic.edit import UpdateView, DeleteView, CreateView
from django.urls import reverse_lazy
from .models import Article
class ArticleListView(LoginRequiredMixin, ListView):
model = Article
template_name = 'article_list.html'
class ArticleCreateView(LoginRequiredMixin, CreateView):
model = Article
template_name = 'article_new.html'
fields = ('title', 'body',)
def form_valid(self, form):
form.instance.author = self.request.user
return super().form_valid(form)
templates/article_new.html
{% extends 'base.html' %}
{% block title %}New article{% endblock title %}
{% block content %}
<h1>New article</h1>
<form action='' method='post'>
{% csrf_token %}
{{ form.as_p }}
<button class='btn btn-success ml-2' type='submit'>Save</button>
</form>
{% endblock content %}
templates/article_list.html
{% extends 'base.html' %}
{% block title %}Articles{% endblock title %}
{% block content %}
<br/>
<div class='row'>
<div class='col-8'>
{% for article in object_list %}
<div class='card' style='background: #292b2c'>
<div class='card-header' style='background: #292b2c;'>
<span class='font-weight-bold'>{{ article.title }}</span> ·
<span class='text-muted'>by {{ article.author }} | {{ article.date }}</span>
</div>
<div class='card-body' style='background: #1a1a1a;'>
<p>{{ article.body|linebreaks }}</p>
<a href="{% url 'article_edit' article.pk %}">edit<a> | <a href="{% url 'article_delete' article.pk %}">Delete</a>
</div>
<div class='card-footer' style='background: #292b2c'>
{% for comment in article.comments.all %}
<p class='font-weight-bold'>
<span class='font-weight-bold'>{{ comment.author }} ·</span>
{{ comment }}
</p>
{% endfor %}
</div>
</div>
<br />
{% endfor %}
Есть ли способ отобразить фрагменты кода в виде тега <pre>
внутри формы, которую я разместил для обучающих целей?
Я пробовал обернуть {{ articles.body }}
в теги <pre>
внутри самого шаблона, но это просто превратит весь текст в <pre>
. Я успешно сохранил пробельные символы из моей оригинальной записи, используя {{ articles.body|linebreaks }}
Я не обязательно хочу использовать RichTextField(), потому что хочу сохранить его простым, но я буду использовать, если придется.
Если вы хотите, чтобы все было просто и коротко, вы можете добавить в тело шаблона тег safe
. Это позволит вам выводить HTML из вводимых данных:
https://docs.djangoproject.com/en/4.1/ref/templates/builtins/#safe
...
<div class='card-body' style='background: #1a1a1a;'>
<p>{{ article.body|safe|linebreaks }}</p>
...
</div>
...
Затем, когда вы пишете блог, вы можете обернуть код внутри тега <pre>
:
Hello this is my tutorial
This is a piece of code:
<pre>my_function()</pre>
Hope you enjoyed it!
И это будет отображено.