Устанавливаем MODX Revolution
Конечно по установке MODX Revolution в Интернете много информации, в том числе и видеоуроков. Но мне часто задают вопросы типа «Посмотрите на общую структуру моего сайта», или «Не могли бы вы дать рекомендации по оптимизации сайта» и т.п. Кстати, немного забегая вперед, скажу, что пожалуй один из самых правильных вопросов был:
В ваших проектах наверняка есть куча шаблонов, чанков и полей. Наверняка есть категории, правила именования и так далее. Не могли бы вы поделиться сим ценным опытом
Этот вопрос мы обязательно рассмотри более детально в одном из следующих уроков.
Так вот, изучая такие подопытные сайты, могу выявить пару самых важных ошибок, которые допускают начинающие MODX-программисты:
-
Слишком много сторонних пакетов. Куча чанков, сниппетов, плагинов (которые работают тогда, когда это вообще не нужно). И это даже на мелких сайтах-визитках.
-
Слишком много пользовательских объектов в принципе. Огромная куча чанков, сниппетов и т.п. просто по любому случаю. Но это часто не только «помойка» в целом (в плане сложностей структурирования такого количества объектов), это еще и огромное количество ненужных вызовов этих элементов. Вот яркий пример:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>[[++site_name]] - [[*pagetitle]]</title>
<base href="[[++site_url]]" />
[[$myIncludeCSS? &name=`jquery-ui-1.9.1`]]
[[$myIncludeCSS? &name=`common`]]
[[$myIncludeCSS? &name=`ucp`]]
[[$myIncludeCSS? &name=`login`]]
[[$myIncludeCSS? &name=`mainpage`]]
[[$myIncludeCSS? &name=`container`]]
[[$myIncludeCSS? &name=`comments`]]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>
</head>
<body>
[[$myKovchegTemplateBegin]]
[[*content]]
[[$myKovchegTemplateEnd]]
</body>
</html>
- Не оптимизированные шаблоны. Вот пример шаблона:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
[[$HEAD]]
</head>
<body>
<!--header_wrap-start-->
<div id="header_wrap">
<!--header-start-->
<div id="header">
[[$Header]]
</div>
<!--header-end-->
</div>
<div class="greenline"></div>
<!--header_wrap-end-->
<div class="banner">
<div class="banner_left">
[[$Menu.Slider]]
</div>
<div class="banner_right">
[[$Menu.top]]
</div>
<div class="clrflt"> </div>
<div class="margin5"> </div>
<div class="greenline"></div>
<div class="clrflt"> </div>
<div class="margin3"> </div>
<marquee loop="infinite" behavior="altemate" bgcolor="#14601e" direction="left" height="23" width="100%"
scrollamount="3" style="color:#fff; font-size:1.1em; padding:7px 0 0 0;
font-family:Georgia, Times New Roman, Times, serif; font-style:italic; ">[[$Stroka]]</marquee>
<div class="clrflt"> </div>
</div>
<!--banner-end-->
<div id="content">
<!--content-start-->
[[$Menu.left]]
<div class="content_right fltright">
<div class="right_box1">
<!--div class="right_box1_left fltleft"><img src="inc/img/right_box1_pic.png" alt="" width="187" height="187" /></div-->
<!--div class="right_box1_right fltright"-->
[[*content]]
<a href="[[~4]]">Узнать больше</a>
<!--div class="clrflt"> </div>
</div-->
<div class="clrflt"> </div>
</div>
<div class="right_box2">
<h2>Наш коллектив</h2>
<div class="infiniteCarousel">
<div class="wrapper">
<ul>
[[getResources?
&parents=`45`
&tpl=`tpl.gR.Slider_foto.row`
&includeTVs=`1`
&processTVs=`1`
&tvPrefix=``
&hideContainers=`1`
&limit=`0`
&sortdir=`ASC`
&sortby=`[[getResourcesTree? &parents=`45` &depth=`100`]]`
&tvFilters=`show_in_carusel==on`
]]
</ul>
</div>
</div>
<!-- -->
</div>
<div class="right_box3">
[[$Block_news]]
[[$Block_Article]]
<div class="clrflt">
</div>
</div>
<div class="clrflt">
</div>
</div>
<!--content-end-->
<!--footer-start-->
<div id="footer">
[[$Footer]]
</div>
<!--footer-end-->
</body>
</html>
Такое, с мелкими изменениями, присутствует в каждом шаблоне. А шаблонов двадцать. Представьте сколько работы нужно провести, чтобы обновить дизайн такого сайта… Да и элементарное сопровождение такого сайта.
- Слишком много чанков, и очень мало PHP-кода. Конечно, если у вас сайт-визитка на 5 страниц, можно и чанками обойтись. Но если вы хоть сколько-нибудь серьезный сайт делаете, то надо больше писать чистого PHP-кода. А для этого надо изучать API MODX. И здесь не стоит бояться низкого уровня знаний PHP. На 95% задач достаточно API MODX в чистом виде. Ведь очень много веб-программистов клепают всякие плюшки на jQuery, и просто используют его в повседневной работе. При этом многие не знают pure-javascript методов типа document.getElementByID, document.getElementsByTagName, не знают, что в IE есть метод outerHTML, и нет его в FireFox и т.д. При этом активно используют $('tag').find('.class',function(){}) и т.д. А ведь это тоже практически ООП. Просто многие этого не боятся, потому что не знают.
Так вот, не надо бояться ООП, и больше изучать API MODX. Оно довольно интуитивно и не плохо документировано. Нет ничего сложного в использовании
$docs = $modx->getCollection('modResource', array(
'parent' => $modx->getOption('site_start')
));
или
$context = $modx->getContext('web');
$contextConfig = $context->config;
В последующих уроках мы будем много внимания уделять именно PHP-программированию с использованием API MODX, потому что только так можно научиться делать какие-то серьезные проекты, и так, чтобы они работали стабильно и эффективно.
Итак, после такого большого вступления, зададимся вопросом: «Как же всего этого избежать?». Ответ: научиться конечно предстоит многому, но главное, с чего надо начать, это научиться устанавливать ту минимальную сборку MODX Revolution, которая позволила бы решать 95% процентов повседневных задач, и при этом не захламлять систему. Я имею ввиду голую установку + минимум самых важных пакетов.
Лично для меня минимальный список пакетов такой:
- CodeMirror (подсветка кода в чанках, сниппетах и т.п. Кто-то предпочитает Ace)
- TinyMCE (контент-редактор)
- Wayfinder (для генерации меню)
- MetaX (Формирует правильные Meta-теги страницы)
- GoogleSiteMap (про сеошность ведь тоже не забываем)
- Login (авторизация во фронтенде)
Второстепенные пакеты:
- Breadcrumbs (хлебные крошки)
- Gallery (понятно дело, что галерея)
- DirectResize (неплохой пакет для автоматического «обрезания» картинок на сайте, когда на страницу попадают картинки, искусственно уменьшенные (стилями или атрибутами)), и автоматически оборачивающий такие картинки в галереи типа Colorbox, HighSlide и т.п.
- getResources (Замена Эволюшинскому Ditto. Вывод новостных лент, постраничности и т.п.)
Да, getResources у меня во второстепенных пакетах (хотя многие удивятся, ведь это третий по популярности пакет, и все его ставят). Более того, я его не ставил уже года полтора, и не поставлю больше никогда. Потому что он очень тяжелый и крайне глючный, а написать свой компонент для вывода новостей — пара часов. И будет это быстрее работать, а главное — будет полный контроль над фильтрами и т.п. Но в список его добавил, потому что понимаю, что многим будет без него не обойтись, а какой сайт без новостей и статей?
UPD: Видео.
В ролике демонстрируется закачка установочного пакета MODX сразу на сервер по SSH командой wget, полная установка MODX Revolution, а так же установка самых необходимых пакетов из официального репозитория + установка пакета локально.