Создание блога. Часть 2. Шаблон и теги.
Строительство блога продолжается. В этом посте расскажу о выборе шаблона и работе с ним, а также о прикручивании самого главного, что должно быть в блоге — системе тегов. Мне кажется, в блоге может не быть чего угодно кроме контента, тегов и RSS. Все остальное опционально, но может быть полезным. Начнем с базового функционала, а потом будем думать об усложнении.
Итак, шаблон и теги.
Установка шаблона
Во-первых, хочу представить вам популярный сайт с шаблонами специально для MODx. На этом сайте есть не очень много шаблонов, но они довольно качественные и уже снабжены разметкой тегами MODx что несколько радует. Если шаблон сложный, он может содержать не один файл шаблона, а еще дополнительные файлы чанков, что приятно. Пара минут копипаста и сайт функционирует.Для моего проекта я выбрал шаблон Baseline. Он яркий, симпатичный, но не сложный. У него два тулбара и меню. Много места в шапке. В общем, мне он нравится и подходит мне фукнционально.
Итак, дело за малым. Скачиваем архив, распаковываем, кидаем содержимое в папку assets/templates/. Копируем содержимое template.txt и идем в панель администратора MODx в раздел "Элементы — Управление элементами — Шаблоны" и нажимаем "Новый шаблон". Копируем содержимое template.txt в окно ввода шаблона и задаем имя. Я назвал его прямо по имени шаблона — Baseline.
Не торопимся уходить из раздела шаблонов. Заходим в свежесозданный шаблон Baseline и нажимаем "Сделать копию". Этот шаблон нам понадобится для отображения конкретного поста, а не списка постов. В этом шаблоне удобно будет добавлять ссылки или какие-то элементы, которые нужны именно для поста. Например, форму комментариев. При желании можно сделать разные шаблоны для постов. Например, одни можно комментировать, другие — нет. Или одни содержат прикрепленную галерею изображений, другие — нет. Но об этом позже. Пока делаем базовый функционал. У нас два шаблона: для вывода списка статей и для вывода статьи.
Вроде с шаблонами закончили. А нет! Нам нужно сделать TV-параметр tags и привязать его к нашим шаблонам Baseline и Пост. В этом параметре будем хранить теги статей, разделенные запятыми. Как их вывести и сделать навигацию по ним — расскажу дальше.
Установка сниппета
Теперь нужно добавить сниппеты для работы с тегами. Пока что нам понадобится только один — tagLinks. Этот сниппет выводит список тегов для указанной страницы в виде ссылок на эти самые теги.
Скачиваем этот сниппет, копируем его содержимое, идем в "Элементы — Управление элементами — Сниппеты", жмем "Новый сниппет", вставляем содержимое сниппета, даем имя tagLinks, сохраняем.
Создание тестового содержимого
Вот теперь можно создавать то, что мы будем выводить. Я сделал так:
Папка "Блог" имеет шаблон "Baseline", все посты имеют шаблон "Пост" и теги.
Настройка сниппетов для вывода тегов
Теперь нужно вывести все посты на страничке блога. Тут можно пойти двумя путями. Либо править шаблон Baseline, либо править саму страницу "Блог". Я выбрал второй вариант. Мне кажется, так будет более гибко. Мало ли я захочу создать другой вывод чего-нибудь еще в том же шаблоне.
Используем Ditto для вывода постов в виде ленты. Для этого нам потребуется создать шаблон (чанк) для каждого поста и сделать, собственно вызов.
Начнем с чанка. Идем в "Элементы — Управление элементами — Чанки", жмем "Новый чанк", называем его, например, "posts". Для теста можно ограничиться вот такой конструкцией:
<div><a href="[~[+id+]~]">[+content+]</a></div>
Теперь идем на страницу "Блог" и пишем в окне содержимого вызов Ditto.
[!Ditto? &parents=`<id родителя, то есть, папки "Блог">` &depth=`3` &tpl=`posts` &sortBy=`createdon` &tagData=`tags` &tagDelimiter=`, `
&dateFormat=`%d.%m.%Y` &truncText=`далее...`!]
Обратим внимание на то, что посты сортируются по дате создания. В качестве источника тегов используется поле "tags", указано что теги разделяются запятой с пробелом. Важно также то, что вызов Ditto тут некэшируемый.
Теперь можно уже смотреть что получилось. Идем по адресу http://mysite.ru/blog/ и видим что-то такое:
Теперь попробуем нажать на пост. Мы должны увидеть содержимое поста с заголовком, но без тегов. Что нужно делать чтобы увидеть уже теги? тут нам поможет как раз тот факт, что мы использовали отдельный шаблон для постов. Идем в этот шаблон.
Дописываем после [*content*] вызов сниппета tagLinks.
[[tagLinks? &tv=`tags` &element=`div` &fap=`1` &path=`blog` &label=`Теги: `]]
Важно что указан источник тегов и путь, где отображать отфильтрованные страницы (параметр path). В нашем случае, он ведет на blog, ведь именно там у нас лента постов. Дада, одна страница будет отображать и просто ленту постов и ленту постов, отфильтрованных по тегу.
Проверяем. Видим список тегов. Ура!
В следующий раз займемся нормальным форматированием вывода постов, выводом тегов для каждого поста прямо в ленте, отображением навигации по тегам в тулбаре. Чтобы не пропустить следующий пост — рекомендую подписаться на RSS.
При подготовке статьи использовались материалы из статьи на modx.ru.
Кстати, интересный сайт, который рекомендую посетить — панорамы и 3d туры. Там реально очень интересные туры. Например, можно побродить по древним развалинам прямо на сайте. А если понравится — заказать 3d-тур для своего сайта. По-моему, офигенный способ заинтересовать посетителей.
- Создание блога на MODx
- Создание блога. Часть 2. Шаблон и теги.
- Создание блога. Часть 3. Красивый вывод постов и тегов.
- Создание блога. Часть 4. Настраиваем RSS.
- Создание блога. Часть 5. Подключаем комментарии.
- Создание блога. Часть 6. Релиз.
![[Valid RSS]](/img/valid-rss-rogers.png)
by SHAman