Сайт вебмастера

LPF — простой PHP-фреймворк для создания одиночных страниц

18-09-2013Reading time ~ 5 min.Albireo Framework / CMS 30742

Не так давно возникла задача сделать простую Landing Page (целевая страница сайта). На такой странице, как правило располагается вся необходимая информация о товаре/услуге.

LPF — старая разработка, которая больше не доступна. Она трансформировалась в Albireo Framefork, который превратилася в полноценную Albireo CMS.

Технически она создается в виде отдельного html-файла. Проблема тут только в том, что работать с «голым» HTML не очень удобно, ну и страшно не хотелось отказываться от возможностей LESS для создания css-стилей.

Ставить отдельную копию MaxSite CMS тоже не совсем разумно: ради пары страниц это явный перебор. Таким образом родился небольшой PHP-фреймворк Landing Page Framework специально «заточенный» для создания одиночных страниц.

Его смысл в том, чтобы выделить верстку каждой страницы в отдельный php-файл, и при этом обеспечить вебмастера привычными «плюшками».

В частности LPF может выполнять автоматическую компиляцию LESS в CSS, выполнять авторасстановку тэгов (вручную расставлять P — бр-р-р-р...), поддерживать привычный BBCode. Помимо этого будет работать ЧПУ, а также поддержка любого CSS-,JS-фреймворка. Плюс высочайшая скорость работы (при минимальной нагрузке на сервер) и не требуется база данных.

Установка

Landing Page Framework — не требует инсталяции. Достаточно загрузить файлы на сервер и всё сразу начинает работать. Единственное, что возможно придётся указать права на запись на каталог кеша (и /css/), а также убедиться, что работает ЧПУ (обычно с этим проблем нет).

Для чего годится LPF

В первую очередь, конечно же, для создания landing pages. Также он отлично подходит для небольших сайтов из ограниченного количества страниц. Поскольку фреймворк работает на PHP, то с помощью LPF можно организовать простую CMS со связями между страницами и общими блоками (через set-каталог и компоненты).

LPF прекрасно подходит для изучения различных CSS-фреймворков. Причем их можно подключать как на уровне всего сайта (то есть для всех страниц), так и для каждой страницы отдельно. Для примера я сделал подключение:

  • bootstrap
  • foundation
  • kickstart
  • pure
  • uikit

Всё это работает без каких-либо переделок и ухищрений.

LPF можно использовать и для обучению верстке, и для организации разных демо-страниц. Если бы LPF появился раньше, то все свои примеры по MaxSite CMS я бы делал именно на нём. :-)

Простота освоения

Страницы сайта размещаются каталоге /pages/. Причем имя страницы совпадает с именем её каталога. Это очень простая схема, при которой невозможно запутаться. Для главной страницы используется каталог /home/, но при необходимости можно задать любой другой.

Каждая страница содержит два файла: text.php и variables.php. Первый содержит текст страницы, второй — какие-то её опции, вроде title или meta.

Файл text.php по сути выводится как тело HTML-страницы между BODY. Выводится всё, что в нём указано без обработки. Но, при желании, можно разрешить использование BBCode (как в MaxSite CMS), разметки Markdown и даже HAML. Если лень расставлять абзацы P, то можно разрешить авторасстановку тегов. Всё это опционально и будет работать только по желанию вебмастера.

Строго говоря, в LPF можно подключить любой autotag, даже если вы его сделаете сами.

Если стоит задача вывести какой-то код в секции HEAD, то создается файл head.php. Файл header.php подключается сразу в начале секции BODY, а footer.php — в конце.

Про CSS/LESS

В LPF используются часть функций из MaxSite CMS (кого-то это удивляет?). Компилятор LESS — один из краеугольных камней фреймворка, поэтому он настроен сразу на автоматическое выполнение. Исходные less-файлы хранятся в каталоге /css-less/ с основным файлом style.less. Результат компилируется в каталог /css/ в файл style.css. Таким образом, в style.less правильным будет только подключение через @import любых других файлов со стилями. Организация less-файлов уже целиком ложится на вебмастера.

Отмечу особенность LESS-компиляции, которая с недавних пор также доступна пользователям MaxSite CMS. Сама библиотека компилятора достаточно объемна и компиляция требует дополнительных ресурсов сервера. Чтобы сгладить его работу происходит кеширование результата. В отличие от других разработок, в моей сверяется время не только основногого less-файла с конечным, но и всех остальных less-файлов. Если какой-то из них изменён, то произойдет автоматическая компиляция.

Раньше приходилось на этапе разработки включать принудительную компиляцию, теперь же это просходит автоматически.

Про компоненты

Смысл компонентов, такой же как и в MaxSite CMS — вынести сложный многократно используемый код отдельно и подключать только при необходимости. В Landing Page Framework компоненты располагаются в каталоге /components/ каждый в своем подкаталоге.

Подключение компонента происходит вручную в нужном месте страницы с помощью функции mso_component(). Первым параметром указывается название/каталог компонента, вторым — опции компонента. Переданные опции автоматически доступны в файле компонента в переменной $OPTIONS. Что это за компонент и какие у него должны быть опции — зависят уже только от самого компонента.

Для примера я включил в комплект фреймворка menu, просто потому что он мне понадобился на своём сайте. Ну и как пример работы. Делать какие-то другие варианты я не планирую, поскольку компоненты обычно завязаны на HTML-разметку, CSS-стили и JS-скрипты, которые могут быть произвольными и меняться от сайта к сайту.

LPF as CMS

Если на сайте две и более страниц, то неизбежно возникнут какие-то общие блоки. Самый простой вариант — счетчики, шапка и подвал сайта. Очевидно, что такие блоки удобно оформить в отдельных файлах и подключать уже в коде страниц. Я долго не мог определиться как назвать такие блоки и пришел к выводу, что такие вещи нужно группировать в отдельном каталоге в виде набора SET.

Например для своего сайта я сделал /set/mysite/, где разместил header.php, footer.php и counters.php. В тексте страниц подключение выполняется одной коммандой:

<?php require(SET_DIR . 'mysite/header.php') ?>

Поскольку организация каталога /set/ может быть произвольной (или даже вовсе отстутствовать), то он и не создается при установке LPF. Но при этом существуют две php-константы SET_DIR и SET_URL, которые чуточку упрощают написание php-кода.

Итого

Анонсирую Landing Page Framework в первую очередь для вебмастеров, которым может быть полезен подобный инструмент. Делал я его под свои задачи, но после публикации первых версий, интересные идеи и дельные замечания мне подкинул Павел Белоусов (@pafnuty_name). Сейчас список задач пуст и LPF уже прошел небольшое тестирование, поэтому его можно использовать на рабочих сайтах.

Related Posts
Comments (20) RSS
1 librarian 2013-09-19 00:59:25

Ссылка на markdown — неправильная.

Ещё идея — подключение автоматического типографа для вывода текста.


2 Admin 2013-09-19 07:21:38 admin

Ссылку поправил. Что за типограф? Есть php-библиотека?


3 Андрей 2013-09-19 10:41:19
Раньше приходилось на этапе разработки включать принудительную компиляцию, теперь же это просходит автоматически.

В новых версиях Maxsite это тоже есть, я правильно понял?


4 Андрей 2013-09-19 10:42:06

Я о компиляции LESS, конечно же.


5 Admin 2013-09-19 12:52:26 admin

Неправильно написал. Будет в версии 0.854. Забыл, что её я ещё не выкладывал. :-)


6 Руслан 2013-09-24 11:52:59

Было бы классно, сделать что-то типа мини cms

С админкой и прочим. На минимальном уровне хотя бы


7 Андрей 2013-10-11 20:02:56

Если бы не странные клиенты, не было бы странного вопроса..))

Проблемка выскочила, если название страницы содержит (или нет) заглавные буквы, то это разные страницы


8 Андрей 2013-10-24 13:28:52

Такой вопрос, где хранить различные функции, чтобы использовать в разных местах на разных страницах. Смог запустить только вписав в engine.php А это наверное не самое правильное?


9 Admin 2013-10-24 14:18:45 admin

Где угодно. Например в set-каталоге и подключать через require().


10 Андрей 2013-10-24 15:05:59

Наверное не правильно выразился. Суть в том, что использую наборы одинаковых страниц для разных пользователей. Целиком весь Landing Page Framework переименовываю под это. Чтобы не ковырять каждую страницу, делая исправления, решил вынести данные в отдельное единое место. Я переменным присваиваю значения. Они вставляются в текст на разных страницах. Думал как сделать отдельный файлик, вроде function.... Хмм.. Или именно его (файлик) и включить в engine.php ? Или есть вариант автомата?


11 Admin 2013-10-24 16:16:01 admin

Ничего не понял... Наугад: engine/config.php


12 Андрей 2013-10-25 16:07:28

Работает))) Спасибо.


13 Evgeny Karsky 2013-10-27 13:33:35

Максим, крутяк фреймворк получился! Обкатывал тут его. Приятно удивлен работе и идеологии. Примитивную админку прикрутить отличная CMS получится.


14 pltvs 2013-11-05 10:11:10

Статья хорошая! Я следующим образом работаю с Markdown: http://plutov.by/post/markdown_php


15 Александр Шиллинг 2014-07-05 12:13:21

Спасибо Max за LPF! Как раз сейчас потребовался подобный Framework для создание LP и вот уже есть готовое решения! :) Не планируешь выкладывать исходный код на github?


16 Наталья 2014-10-20 15:53:37

Крутой фреймворк. Спасибо разработчикам.

Ещё не разобралась со всеми возможностями, но то, с чем уже разобралась, более, чем впечатляет.


17 Наталья 2014-10-21 06:16:57

Ребята, а как-нибудь можно вставлять javascript-ы на LPF, чтобы они работали? У меня ни Яндекс-карта не отображается, ни калькулятор считать не хочет. В коде ошибок нет, на странице без фреймворка всё работает.


18 Admin 2014-10-21 07:21:05 admin

1. Проверьте наличие js в исходном коде Ctrl+U.

2. Посмотрите в консоли js-ошибки F12.


19 Наталья 2014-10-21 07:26:20

Конечно, перед отправкой сообщения сюда, всё это проверила. Код js есть, ошибок нет.


20 Наталья 2014-10-21 15:36:24

Через конструктор карт на Яндексе (http://api.yandex.ru/maps/tools/constructor/) получается отобразить карту. Через песочницу (http://api.yandex.ru/maps/jsbox/2.1/) вообще никак не отображается, хотя код на странице выводится.

С калькулятором пока не разобралась.

Ещё можете подсказать, как отправку сообщений с сайта сделать? Весь день мучила разные варианты, так и не получилось.