Что такое CMS

CMS расшифровывается как content management system — система управления содержимым. Звучит внушительно, а делает вещь понятную: хранит тексты сайта в базе данных и подставляет их в общую для всех страниц вёрстку.

Сайт без CMS — это папка с файлами

Самый простой сайт выглядит так: папка, в ней index.html, about.html и style.css. Открыли файл в редакторе, поправили текст, сохранили, положили на хостинг. Пока страниц две, лучше способа не придумать.

Вот кусок такой страницы. Шапка с меню — это первые строки каждого файла:

<body>
  <header>
    <a href="index.html">Главная</a>
    <a href="about.html">Об авторе</a>
    <a href="works.html">Работы</a>
  </header>

  <h1>Об авторе</h1>
  <p>Меня зовут Дмитрий, я учусь в десятом классе.</p>
</body>

Теперь добавим четвёртый раздел — «Контакты». Ссылку на него придётся вписать в каждый файл: в index.html, в about.html, в works.html. Три файла — три одинаковые правки. У этого сайта сейчас больше полусотни страниц: полсотни правок ради одной ссылки.

Что делает CMS

Система управления сайтом разделяет страницу на две части, которые до этого были склеены в одном файле:

• Как страница выглядит — шапка, меню, подвал, расположение блоков. Это шаблон, и он один на все страницы.
• Что на странице написано — заголовок и текст. Это содержимое, оно хранится в базе данных отдельно для каждой страницы.

Когда посетитель открывает адрес, движок берёт шаблон, подставляет в него содержимое нужной страницы и отдаёт браузеру готовый HTML. Собирается страница каждый раз заново — файла about.html на диске больше нет вообще.

Ближайшая аналогия — дневник. Расчерченная сетка одинаковая на всех страницах, а записи в ней разные. Никому не приходит в голову перечерчивать таблицу ради новой записи.

В Evolution шаблон выглядит почти как обычный HTML. Отличие — метки в квадратных скобках: на их место движок подставит данные.

<body>
  {{header}}

  <h1>[*pagetitle*]</h1>
  [*content*]

  {{footer}}
</body>

Здесь [*pagetitle*] — заголовок страницы, [*content*] — её текст, а {{header}} и {{footer}} — шапка и подвал, вынесенные в отдельные куски. Что означает каждая скобка, разберём на следующих страницах этапа: сначала шаблоны, потом чанки.

Что это даёт на практике

• Меню правится один раз — меняется на всех страницах сразу.
• Новая страница создаётся мышкой в админке, а не копированием файла.
• Текст может править человек, который не знает HTML, — например, учитель или родитель.
• Вёрстка лежит в одном месте, и её не приходится искать по полусотне файлов.

Как это выглядит вживую

1. Сайт целиком — дерево слева

   Так выглядит админка Evolution сразу после входа. Слева весь сайт списком: папки раскрываются, страница перетаскивается мышью. Ни одного файла открывать не нужно.

   Увеличить

2. Текст страницы — в полях формы

   Карточка страницы: заголовок, описание, адрес, шаблон, содержимое. Это та самая страница про чанки, которую вы откроете следующей. Правится здесь — на сайте меняется сразу.

   Увеличить

Почему Evolution, а не WordPress

WordPress — самая известная CMS в мире, и на ней работает каждый третий сайт. Я всё равно взял Evolution, и вот честное сравнение — с тем, в чём WordPress лучше.

Для проекта, где нужно показать, как устроен сайт, решает первая строка таблицы. В Evolution моя вёрстка остаётся моей: я вижу тот же HTML, который написал, плюс несколько меток. В WordPress пришлось бы сначала объяснять, что такое цикл на PHP, — а это уже совсем другой проект.

Что я спросил у нейросети

Выбор я делал не в одиночку. Вот запрос целиком — можно скопировать и задать своей нейросети, подставив свои условия.

Ответ пришёл длинный, поэтому здесь он свёрнут — разверните, если интересно целиком.

Совет про версию PHP оказался важным: на хостинге по умолчанию стояла старая, и первая установка не пошла. Про вывод списков тоже правда — на сниппете меню я действительно застрял, и об этом будет отдельный мануал про мегаменю. Синтаксис сниппетов и список настроек лежат в документации Evolution — это то место, куда стоит идти с вопросом про сам движок, а не про свой сайт.