Как вывести несколько категорий на карточке CMS Потока в Zero Block

Штатные «Разделы» CMS Потока Тильды выводят только одну категорию на карточку. Если посту нужно сразу несколько тегов (например «Экономика» и «Инвестиции»), используем текстовое поле и небольшой скрипт, который разбивает текст по запятой на отдельные бейджи.

Добавьте в поток текстовое поле, например «Теги», и впишите в него категории через запятую: Экономика, Инвестиции.

Вставьте код целиком в настройки страницы: Ещё → Вставка кода → «Перед </body>», затем опубликуйте страницу.

Или вставьте код в блок Т123 на странице, где отображаются карточки потоков.

<style>
/* Стили бейджей категорий — подстройте цвета под свой дизайн */
.category-badge {
display: inline-block;
background: #ffffff;
color: #1a1a1a;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.03em;
padding: 6px 14px;
border-radius: 20px;
margin: 0 6px 6px 0;
}
.post-categories {
display: none !important;
}
</style>

<script>
document.addEventListener('DOMContentLoaded', function () {
renderCategoryBadges();
});
document.addEventListener('t-feed-added-articles', function () {
renderCategoryBadges();
});

function findRepeatingCardAncestor(el, maxLevels) {
maxLevels = maxLevels || 8;
var current = el;

for (var i = 0; i < maxLevels && current && current.parentElement; i++) {
var parent = current.parentElement;
var sameClassSiblings = 0;

for (var j = 0; j < parent.children.length; j++) {
if (parent.children[j] !== current && parent.children[j].className === current.className) {
sameClassSiblings++;
}
}

if (sameClassSiblings >= 1 && current.className) {
return current;
}

current = parent;
}

return null;
}

function renderCategoryBadges() {
var sourceFields = document.querySelectorAll('.post-categories');

sourceFields.forEach(function (field) {
var rawText = field.textContent.trim();
if (!rawText) return;

var card = findRepeatingCardAncestor(field);
if (!card) card = field.parentElement;

var wrap = card.classList && card.classList.contains('categories-wrap')
? card
: card.querySelector('.categories-wrap');
if (!wrap) return;
if (wrap.dataset.rendered === '1') return;

var categories = rawText.split(',')
.map(function (c) { return c.trim(); })
.filter(function (c) { return c.length > 0; });

wrap.innerHTML = categories
.map(function (cat) {
return '<span class="category-badge">' + escapeHtml(cat) + '</span>';
})
.join('');

wrap.dataset.rendered = '1';
});
}

function escapeHtml(text) {
var div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
</script>

Проверка после публикации: откройте страницу, нажмите F12 → Console и введите document.querySelectorAll('.post-categories').length — число должно совпадать с количеством карточек. Если бейджи не появились — проверьте, что CSS-классы на элементах заданы без опечаток и страница опубликована заново.