mod: Дизайн и вёрстка страниц для постов блога и вспомогательных страниц для мобильных устройств (адаптивность, скрытие картинки-обложки).

This commit is contained in:
2026-02-12 20:50:32 +03:00
parent 53e7e92248
commit d5cf3c0c8a
3 changed files with 13 additions and 13 deletions

View File

@@ -2,9 +2,10 @@
{% load static typograph_extras %}
{# --- SEO --- #}
{# В title и description НЕ используем escapejs, так как это HTML, а не JS #}
{% block title %}{% if page.seo_title %}{{ page.seo_title }}{% else %}{{ page.title|striptags|unescape|safe }}{% endif %} — ETPGRF{% endblock %}
{% block description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|striptags|unescape|safe|truncatechars:160 }}{% endif %}{% endblock %}
{% block keywords %}{% if page.seo_keywords %}{{ post.seo_keywords }}{% else %}типограф, типографика, блог типограф, онлайн типограф, подготовка текста для веба, html типограф, неразрывные пробелы, кавычки елочки, длинное тире, очистка текста от мусора, интернет верстка, муравьев, лебедев{% endif %}{% endblock %}
{% block description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|default:page.content|striptags|unescape|truncatechars:160 }}{% endif %}{% endblock %}
{% block keywords %}{% if page.seo_keywords %}{{ page.seo_keywords }}{% else %}типограф, типографика, блог типограф, онлайн типограф, подготовка текста для веба, html типограф, неразрывные пробелы, кавычки елочки, длинное тире, очистка текста от мусора, интернет верстка, муравьев, лебедев{% endif %}{% endblock %}
{# --- Schema.org --- #}
{% block schema %}<script type="application/ld+json">
@@ -28,25 +29,21 @@
</script>{% endblock %}
{% block og_title %}{% if page.seo_title %}{{ page.seo_title }}{% else %}{{ page.title|striptags|unescape|safe }}{% endif %}{% endblock %}
{% block og_description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|safe|striptags|unescape|truncatechars:160 }}{% endif %}{% endblock %}
{% block og_description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|default:page.content|striptags|unescape|truncatechars:160 }}{% endif %}{% endblock %}
{% block og_image %}{% if page.image %}{{ request.scheme }}://{{ request.get_host }}{{ page.image.url }}{% else %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/etpgrf-logo-for-fb-vk-x.gif' %}{% endif %}{% endblock %}
{% block twitter_title %}{% if page.seo_title %}{{ page.seo_title }}{% else %}{{ page.title|striptags|unescape|safe }}{% endif %}{% endblock %}
{% block twitter_description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|striptags|unescape|safe|truncatechars:160 }}{% endif %}{% endblock %}
{% block twitter_description %}{% if page.seo_description %}{{ page.seo_description }}{% else %}{{ page.excerpt|default:page.content|striptags|unescape|truncatechars:160 }}{% endif %}{% endblock %}
{% block twitter_image %}{% if page.image %}{{ request.scheme }}://{{ request.get_host }}{{ page.image.url }}{% else %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/etpgrf-logo-for-fb-vk-x.gif' %}{% endif %}{% endblock %}
{% block content %}
<div class="row">
{# Левая колонка: Дата и Картинка #}
<div class="col-lg-2 align-self-start text-end mb-4">
<p class="small align-self-end">
<small class="bg-secondary bg-opacity-10 p-2 text-nowrap">{{ page.published_at|date:"d.M.Y"|lower }}</small>
</p>
<p>{% if page.image %}
<img src="{{ page.image.url }}" class="w-100" alt="{{ page.image|striptags|unescape|safe }}"/>
{% else %}<img src="{% static 'img/etpgrf-logo-for-fb-vk-x.gif' %}" class="w-100" alt="{{ page.image|striptags|unescape|safe }}"/>
{% endif %}</p>
</div>
{% if page.image %}<p class="d-none d-lg-block"><img src="{{ page.image.url }}" class="w-100 rounded" alt="{{ page.title|striptags|unescape|safe }}" /></p>
{% endif %}</div>
{# Правая колонка: Контент #}
<div class="col-lg-10 border-start ps-lg-4 post-page-content">

View File

@@ -2,6 +2,7 @@
{% load static typograph_extras %}
{# --- SEO --- #}
{# В title и description НЕ используем escapejs, так как это HTML, а не JS #}
{% block title %}{% if post.seo_title %}{{ post.seo_title }}{% else %}{{ post.title|striptags|unescape|safe }}{% endif %} — ETPGRF{% endblock %}
{% block description %}{% if post.seo_description %}{{ post.seo_description }}{% else %}{{ post.excerpt|striptags|unescape|safe|truncatechars:160 }}{% endif %}{% endblock %}
{% block keywords %}{% if post.seo_keywords %}{{ post.seo_keywords }}{% else %}типограф, типографика, блог типограф, онлайн типограф, подготовка текста для веба, html типограф, неразрывные пробелы, кавычки елочки, длинное тире, очистка текста от мусора, интернет верстка, муравьев, лебедев{% endif %}{% endblock %}
@@ -48,7 +49,8 @@
{{ post.published_at|date:"d.M.Y"|lower }}
</small>
</p>
<p>{% if post.image %}
{# Картинка скрыта на мобильных (d-none), видна на больших экранах (d-lg-block) #}
<p class="d-none d-lg-block">{% if post.image %}
<img src="{{ post.image.url }}" class="w-100" alt="{{ post.title|striptags|unescape|safe }}"/>
{% else %}<img src="{% static 'img/etpgrf-logo-for-fb-vk-x.gif' %}" class="w-100" alt="{{ post.title|striptags|unescape|safe }}"/>
{% endif %}</p>