Уроки MODx Revolution

Часто меня просят помочь и, если есть время и настроение, то помогаю. Очень много людей делает одни и те же ошибки. Здесь буду собирать характерные ошибки начинающих веб-разработчиков или тех, кто недавно начал работу с MODX Revolution. Если у кого есть какие замечания (предложения) по ошибкам - буду рад от вас получить советы и дополнения по статье. Указать в head сайта base href: <base href="[[++site_url]]"/> При использовании шрифтов проверять поддерживает ли шрифт кириллицу и не забывать добавлять это в вызове — &subset=latin,cyrillic ...

Как и раньше подключаем нужные стили и скрипты: Далее добавляем некоторые элементы управления для простой анимации, которая будет менять размер контейнера: Чтобы подготовить div и сделать нашу анимацию красивее, добавим чуть стилей: В конце добавим наш контейнер в тело документа: Когда закончите, то у вас получится что-то вроде Когда вы откроете это в браузере, то увидите, что контейнер увеличится и станет квадратом. Демо Пример 1 Другие команды Также можно использовать setHeight или setWidth методы, например: ...

Создадим живой AJAX поиск на сайте. Для этого нам понадобятся: дополнение mSearch - Документация mSearch библиотека jquery Установка mSearch и индексация страниц сайта Установим дополнение mSearch через репозиторий дополнений и проиндексируем все наши ресурсы. Для этого нужно вызвать на любом удобном вам ресурсе вызов mSearch в виде: Это проиндексирует первые 500 ресурсов, далее выставляем значение offset=500 и индексируете следующие 500 ресурсов и т.д. При индексации данные перезаписываются, так что можно запускать этот процес сколько угодно раз подряд, индекс от этого не разрастается. После того как вы проиндексировали всё 1 раз, все новосозданные или изменённые ресурсы индексирует плагин, который идёт в комплекте с mSearch, более подробно: http://bezumkin.ru/modx/msearch/ ...

Урок создан на основе уже существующего компонента Qaptcha с внесением некоторых исправлений. Рассмотрим создание простого компонента каптчи для проверки перед отправкой сообщения, регистрации на сайте и т.д. Создание необходимых каталогов компонента Создадим каталоги в нашей MODX установке: assets/components/qaptcha/ core/components/qaptcha/ Создавать капчу будем на основе jQuery плагина Qaptcha. Скачаем его файлы c папками и поместим в соответствующие MODX каталоги: в core/components/qaptcha/ я создал каталог php и поместил туда файл Qaptcha.jquery.php, в каталог assets/components/qaptcha/ я скопировал папки images и jquery со всеми файлами и получил следующую структуру каталогов: ...

Советы для начинающих: Установите редакторы, подсвечивающие код и облегчающие чтение кода. Рекомендую Ace Для закачки файлов на сервер установите Filezilla Установите подсветку синтаксиса через Ace. Читайте официальную документацию и другие источники полезной информации, другие блоги (см.ссылки), общайтесь в сообществах, в MIRC канале #modx, #xpdo. Не бойтесь задавать вопросы, все когда-то начинали с нуля. Изучайте новые инструменты и приёмы не только MODX, но и веб-разработки. Изучайте HTML5, CSS3, jQuery, sql, Seo и др. Читайте хабр, Codrops, смотрите что нового на Creattica Научитесь пользоваться хотя бы несколькими редакторами кода и ПОСТОЯННО совершенствуйте навыки их использования, в основновном я использую Sublime Text 2 ...

В этом уроке рассмотрим как можно быстро создать удобную форму поиска. Для этого нам понадобиться: Дополнение SimpleSearch берём из репозитория и/или устанавливаем как обычно через Управление дополениями менеджера. Проделываем то же самое с Bootstrap темой, в комплект с которой входит скрипт typehead-bootstrap.js. Его мы и будем использовать для создания удобного поиска. Либо прописываем в шапке сайта пути к необходимым скриптам и стилям. В моём случае: Далее делаем вызов сниппета SimpleSearch: [[!SimpleSearchForm? &tpl=simpleSearchFormDemo.tpl]] Создаём чанк simpleSearchFormDemo.tpl ...

Всем привет. Сегодня в этом уроке я расскажу как создать галерею в MODX Revolution с помощью Twitter Bootstrap Image Gallery и дополнений FileDir (для вывода изображений) и PhpThumbOf (для создания миниатюр изображений). Bootstrap Image Gallery это расширение диалога Modal набора Twitter Bootstrap для облегчения навигации между изображениями галереи. Она поддерживает навигацию мышью и клавиатурой, присутствуют эффекты при смене изображения, полноэкранный режим и слайдшоу. Загрузка и установка необходимых ресурсов Скачайте в репозитории MODX и установите дополнения PhpThumbOf и FileDir через Управление дополнениями менеджера. Далее скачайте Bootstrap Image Gallery файлы, распакуйте их и залейте на ваш сервер с сайтом в соответствующие папки, например: assets/css, assets/js, assets/img. ...

В этом уроке мы продолжим создавать страницу, которая будет содержать контент нескольких разных страниц, такое вы можете встретить в вебжурналах, блогах или новостных сайтах и др. Предмет нашего сегодняшнего обсуждения – это как добавить пагинацию к страницам нашего агрегированного контента и для этой цели мы будем использовать сниппет getPage. Что такое getPage? getPage - это сниппет MODx Revolution, который позволяет вам добавлять пагинацию к элементам сайта, которые могут быть разбиты постранично. Согласно документации getPage - это… общий сниппет для представления, навигации и возможного кеширования, многостраничных просмотров любых Елементов, которые принимают ограничительные и офсетные параметры для ограничения набора данных и устанавливает плейсхолдер, который getPage может использовать для получения общего количества элементов выводимых на странице. ...

Добро пожаловать на 5 урок MODX Revolution для новичков. В предыдущем уроке мы начали рассматривать работу с шаблонами в MODX Revolution. Мы начали со статичного HTML/CSS шаблона и перенесли его в нашу установку MODX Revolution, изменили пути к файлам и начали изучать синтаксис тегов MODX Revolution и как его использовать. В этом уроке мы продолжим работу над нашим шаблоном и изучим концепцию чанков. В данном уроке я использую шаблон 7-in-1 Business Success Site студии Themeforest. Если вы работаете над шаблоном, который вы скачали или сделали сами, то это даже лучше. Подход к построению сайта одинаков вне зависимости от используемого шаблона. ...

На этом уроке мы разберемся в базовых настройках сайта. Также проведём установку дополнений из репозитория MODX. В этом уроке мы рассмотрим лишь основные настройки и вы поймёте, что менеджер MODX Revolution имеет множество настроек конфигурации и мы вначале рассмотрим основные, а потом изучим разные части менеджера. Название сайта и другие настройки В зависимости от вашего вебсайта и его насколько сложным вы собираетесь его сделать, то вам понадобится стандартный набор настроек вашего сайта, чтобы он работал и функционировал так, как вы этого хотите. ...