В данном уроке реализуем активные элементы — теги для любых MODX ресурсов при помощи MIGX. Тегирование будет сделано под SEO курс от Антона Маркина, который недавно прошел. В тегах мы сможем ссылаться куда угодно: на любые ресурсы, сайты и саму страницу с тегами. Не будет ссылок с Get параметрами типа resours/&tag=kakoyto-teg, следовательно не будет мусорных страниц.
Создание MIGX конфигурации для тегов
Переходим в MIGX и добавляем новый элемент с именем «tag», в поле «Замена «Добавить элемент»» пишем: «Добавить теги» и переходим во вкладку Formtabs.
На вкладке Formtabs жмем на кнопку «Добавить элемент», откроется новое окно, в нем еще раз жмем на кнопку «Добавить элемент». И заполняем первый элемент: Fildname — name, Caption — Название тега и нажимаем «Выполнено».
Далее снова ждем на кнопку «Добавить элемент» и добавляем второй элемент: Fildname — link, Caption — Ссылка и нажимаем «Выполнено» и Снова «Выполнено».
Теперь переходим во вкладку «Columns» и снова добавляем эти 2 элемента.
- Header: Название тега и Fild: name.
- Header: Ссылка и Fild: link.
Выполняем все.
Создание дополнительного поля (TV) для тегов с MIGX конфигурацией
Переходим во вкладку «Элементы» в дереве ресурсов и создаем новое TV поле:
- Название: tags;
- Подпись: Тегирование и переходим во вкладку «Параметры ввода»;
- Тип ввода: MIGX;
- Конфигурации: tag и переходим во вкладку «Доступно для шаблонов»;
- Выбираем шаблоны где будет доступно TV для ввода тегов и сохраняем.
Заполнение тегов в ресурсах
Переходим в ресурс, во вкладку Дополнительные поля к которому назначили TV поле tags и заполняем теги нажав на кнопку: Добавить тег.
Так вы можете добавить неограниченно количество тегов.
Заполнение ссылок на теги
Как я говорил выше в тегах можно ссылаться куда угодно, рассмотрим примеры:
- на другой сайт: https://site.ru/;
- на текущий ресурс: # — если вы решили проблему с якорными ссылками при помощи плагина или к примеру так [[~9]] — на fenom {$_modx->makeUrl(9)}, где 9 id текущего ресурса или вообще так /blog/statya — кусок URL без адреса сайта/
- на другие страницы сайта: добавляются идентично тому как на текущий ресурс
- на якорные ссылки (к примеру если у вас есть авто оглавление которое создает якоря к заголовкам) — вы можете ссылаться на эти якоря, к примеру так [[~9]]#imya-yakorya или {$_modx->makeUrl(9)}#imya-yakorya, где 9 id текущего ресурса.
Вывод тегов в ресурсах
Открываем шаблон ресурсов или чанк, где нужно выводить теги, в моем случае и в случае тех, кто проходит бесплатный курс по Fenom, это файловый чанк ArticleTemplate.tpl. В него после вывода контента, помещаем следующий вызов (разметка адаптирована под bootstrap 5):
<p class="mb-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-tags" viewBox="0 0 16 16">
<path d="M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z"/>
<path d="M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM1 7.086a1 1 0 0 0 .293.707L8.75 15.25l-.043.043a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 0 7.586V3a1 1 0 0 1 1-1v5.086z"/>
</svg>
{set $rows = json_decode($_modx->resource.tags, true)}
{foreach $rows as $row}
#<a class="pr-2 link-dark" href="{$row.link}">{$row.name}</a>
{/foreach}
</p>При заполненных тегах получаем такой вид:
Для тех кто работает с обычным шаблонизатором, вызов тегов будет таким:
<p class="mb-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-tags" viewBox="0 0 16 16">
<path d="M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z"/>
<path d="M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM1 7.086a1 1 0 0 0 .293.707L8.75 15.25l-.043.043a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 0 7.586V3a1 1 0 0 1 1-1v5.086z"/>
</svg>
[[getImageList? &tvname=`tags` &tpl=`tplTag`]]
</p>Где tplTag чанк со следующей разметкой.
#<a class="pr-2 link-dark" href="[[+link]]">[[+name]]</a>Сейчас если не заполнить теги то будет выводиться иконка теги:
Скрыть весь блок с его кодом при условии что не чего не заполнено можно так. Берем весь код вызова выносим в отдельный чанк (пусть будет tags.tpl или просто tags, кто не на файлах работает), далее просто делаем проверку на пустоту у самого TV tags.
fenom: {if $_modx->resource.tags?}{include 'file:chunks/blog/tags.tpl'}{/if}
modparser: [[*tags:!empty=`[[$tags]]`]]
Вот так легко и просто реализовать тегирование ресурсов в MODX Revolution при помощи MIGX.
