Уроки MODx Revolution
Скачать материалы к учебному курсу - папка distr_MODx.zip
Урок 1. Установка и настройка CMS MODx Revo
1. Зайдите на сайт https://beget.com/ru/free-hosting
2. Нажмите Зарегистрироваться.
Рисунок 1.1
3. Зарегистрируйте аккаунт.
Рисунок 1.2
4. Зайдите в панель управления по адресу https://cp.beget.com и введите свои реквизиты.
Рисунок 1.3
5. В левой части панели управления можно увидеть адрес Вашего будущего сайта. У Вас имя будет другим.
Рисунок 1.4
6. В панели управления найдите раздел CMS Установка систем управления.
Рисунок 1.5
7. В списке найдите и щелкните по пункту MODx.
Рисунок 1.6
7. В следующем окне придумайте логин и пароль (или сгенерируйте пароль), введите электронную почту. Все реквизиты обязательно сохраните. Версию MoDx выберите ветрсию 2.8.3. После этого нажмите Установить.
Рисунок 1.7
Если в процессе установки возникли какие-то ошибки, или установка не получилась, сделайте следующее:
1. Удалите сайт в панели управления в разделе «Сайты».
2. Удалите базу данных в панели управления в разделе «MySQL».
3. Создайте новый сайт в панели управления в разделе «Сайты» и прилинкуйте домен.
4. Повторите установку CMS MODx.
Изменения вступят в силу через 10 минут.
8. Дождитесь окончания установки.
Рисунок 1.8
В верхней части панели управления появится список установленных CMS.
Рисунок 1.9
9. В браузере наберите адрес Вашего сайта. После установки CMS MODx 2.8.3 Revolution выглядит следующим образом.
Рисунок 1.10
10. Чтобы войти в панель управления, к адресу сайта надо добавить /manager. Вот так http://адрес_сайта/manager. В нашем случае это будет http://z904981s.beget.tech/manager/
Появится форма входа в административную панель. Введите данные, которые Вы вводили на этапе установки (см. рис. 1.7).
Рисунок 1.11
11. После входа в панель управления можно увидеть сообщение об ошибке:
Рисунок 1.12
Каталог ядра в открытом доступе.
MODX обнаружил, что ваш основной каталог (частично) доступен для общественности. Это не рекомендуется из соображений безопасности.
Если ваша установка MODX выполняется на веб-сервер Apache, вам следует по крайней мере настроить файл .htaccess внутри каталога с файлами ядра: /home/z/
Чтобы переименовать файл ht.access в .htaccess, вернитесь в панель управления на хостинге (не путать с административной панелью сайта) и найдите пункт Файловый менеджер.
Рисунок 1.13
12. В файловом менеджере в папке z904981s.beget.tech/public_html/core/ (у Вас часть адреса до первого слэша другая, соответствует Вашему логину) найдите файл ht.access
14. Вверху панели нажмите пункт Файл – Переименовать. Измените имя файла, как показано на рисунке, нажмите Переименовать.
Рисунок 1.14
15. Вернитесь в административную панель сайта и нажмите кнопку Обновить браузера. Если ошибка не исчезла, оставляем как есть, это уже надо обращаться в техподдержку.
16. В левой части админпанели сайта перейдите на ресурс Главная.
Рисунок 1.15
17. В правой части откроется содержимое ресурса.
Рисунок 1.16
18. Как видим текст страницы пока в виде html-кода. Поэтому прежде, чем перейти к созданию сайта, сделаем первоначальные настройки CMS MODx Revo и установим необходимые сниппеты для создания сайта, в том числе визуальный редактор, чтобы работать не с html-кодом, а с обычным текстом.
В правом верхнем углу найдите изображение шестеренки и выберите Системные настройки. Настроек очень много, поэтому придется поискать нужные. Причем один раздел может быть разделен на две части и находиться в разных местах. Лучше воспользоваться фильтром.
Рисунок 1.17
Изменение и сохранение настроек происходит автоматически, поэтому подтверждать ничего не нужно.
19. Основные настройки системы, которые сделайте после установки MODX.
Раздел «Сайт»
– Название сайта: введите Моя web-студия
– Сообщение о недоступности сайта: введите Сайт временно недоступен
– Публиковать по умолчанию: будет ли новый документ доступен для просмотра посетителями сразу после создания и сохранения, установите Да
Раздел «Система и сервер»
– Отображение RSS-канала «Новости MODX»: установите Нет
– Отображение RSS-канала «Уведомления безопасности MODX»: установите Нет
Раздел «Система управления»
– Показывать текст подсказки рядом с полем: описание пунктов меню, установите Да
– Формат даты в панели управления: напишите наш формат d-m-Y
– Первый день недели: установите 1
Раздел «Дружественные URL» – режим ЧПУ
– Транслитерация псевдонимов: напишите russian (для включения транслитерации дополнительно требуется установить расширение translit, мы его установим позже)
– Суффикс контейнера: удалите слэш /
– Использовать дружественные URL: установите Да
– Строгий режим дружественных URL: установите Да
– Проверять на дублирование URI во всех контекстах: установите Да
– Использовать вложенные URL: установите Да
Включив на сайте ЧПУ (режим дружественных URL), убедитесь в файловом менеджере, что в корне сайта файл ht.access переименован в .htaccess, иначе при попытке перехода на страницы, отличные от главной, получите ошибку 404.
Если файл не переименован, измените его имя прямо в файловом менеджере.
Рисунок 1.18
Примечание: можно через главное меню админки «Содержимое – Типы содержимого» в параметре HTML очистить поле «Расширение файла». Теперь адрес страниц станет без расширения, то есть http://адрес_сайта/about вместо http://адрес_сайта/about.html.
На этом первоначальную настройку можно считать завершенной. Далее идет установка из репозиториев самых необходимых для разработки дополнений MODX Revo.
20. Сначала установим дополнение translit, который необходим для дружественных URL.
В верхнем меню административной панели зайдите Пакеты – Установщик. В окне Менеджер пакетов нажмите кнопку Загрузить пакеты.
Рисунок 1.19
21. Затем в строке поиска введите translit, нажмите Enter и нажмите кнопку Загрузить рядом с именем пакета.
Рисунок 1.20
22. Загрузка пакета не означает его установку. Устанавливать пакет надо вручную. Поэтому после загрузки перейдите на вкладку Вернуться в «Менеджер пакетов» и нажмите Установить.
Рисунок 1.21
23. Затем нажмите Продолжить и в консоли нажмите ОК.
Рисунок 1.22
В столбце Установлен должна быть зеленая надпись Установлено.
Рисунок 1.23
24. Вернитесь в установщик командой Пакеты – Установщик.
25. Нажмите Загрузить пакеты и установите TinyMCE – это визуальный редактор веб-страниц, чтобы работать не с html кодом (см. рис. 1.16), а с обычным текстом.
Сейчас у нас установлено два пакета.
Рисунок 1.24
26. Вернитесь в главный раздел, нажав логотип в левом верхнем углу административной части сайта.
Рисунок 1.25
27. Перейдите в ресурс Главная. У нас теперь установлен визуальный редактор, но на панели инструментов есть не все возможные инструменты.
Рисунок 1.26
28. Давайте сделаем так, чтобы у нас отображались все возможные для этого редактора инструменты.
Зайдите в настройки системы. Шестеренка в правом верхнем углу – Системные настройки.
Выберите tinymce в выпадающем меню, где по умолчанию стоит "core".
Рисунок 1.27
И скопируйте следующие значения вместо существующих или в пустые поля:
– в поле Custom Buttons Row 1
save,newdocument,separator,bold,italic,underline,strikethrough,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect,fontselect,fontsizeselect
– в поле Custom Buttons Row 2
cut,copy,paste,pastetext,pasteword,separator,search,replace,separator,bullist,numlist,separator,outdent,indent,blockquote,separator,undo,redo,separator,link,unlink,anchor,image,cleanup,help,code,separator,insertdate,inserttime,preview,separator,forecolor,backcolor
– в поле Custom Buttons Row 3
tablecontrols,separator,hr,removeformat,visualaid,separator,sub,sup,separator,charmap,emotions,iespell,media,advhr,separator,print,separator,ltr,rtl,separator,fullscreen
– в полеCustomButtonsRow 4 (возможно это поле уже на следующей странице настроек)
insertlayer,moveforward,movebackward,absolute,separator,styleprops,spellchecker,separator,cite,abbr,acronym,del,ins,attribs,separator,visualchars,nonbreaking,template,blockquote,pagebreak,separator,insertfile,insertimage
– в поле Custom Plugins в разделе General
autolink,lists,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template
Вернитесь в ресурс Главная. После подключения всех плагинов и кнопок получаем полный набор инструментов TinyMCE.
Рисунок 1.28
Примечание: можно удалить кнопку Сохранить (т.е. стереть параметр save, ) в поле Custom Buttons Row 1, т.к. кнопка работает некорректно (вместо сохранения закрывает документ). Также можно стереть параметр newdocument, за ненадобностью, а также separator, до параметра bold, чтобы не было отступа от края на панели инструментов.