MaxSite.org 11 лет
Блог вебмастера о сайтостроении
Внимание! Данная запись отмечена как устаревшая и может содержать неточную или неактуальную информацию!

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

Landing Page FrameworkПросмотров: 16185 (352)

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

Технически она создается в виде отдельного 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 я бы делал именно на нём. grin

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

Страницы сайта размещаются каталоге /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 уже прошел небольшое тестирование, поэтому его можно использовать на рабочих сайтах.

Комментариев: 20 RSS

1librarian19-09-2013 01:59

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

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

2MAX19-09-2013 08:21

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

3Андрей19-09-2013 11:41

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

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

5MAX19-09-2013 13:52

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

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

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

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

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

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

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

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

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

9MAX24-10-2013 15:18

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

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

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

13Evgeny Karsky27-10-2013 14:33

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

14pltvs05-11-2013 11:11

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

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

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

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

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

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

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

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

18MAX21-10-2014 08:21

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

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

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

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

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

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

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

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

Оставьте комментарий!

Комментарий будет опубликован после проверки. Вы соглашаетесь с правилами сайта.

(обязательно)

О сайте

Здесь вы получите самую полную информацию о создании сайтов на MaxSite CMS.