Создание редактируемого лендинга через механизм Ленды

Введение

Возможности подсистемы: 

  • разделение ленда на секции,
  • редактирование параметров ленда и его секций под админом и редактором,
  • возможность менять структуру ленда (изменение порядка секций, скрывать секции),
  • изменение блоков в head и перед закрывающим тегом /body
  • возможность подключать как статичные HTML блоки, так и динамические (с хранимой процедурой).

Образ действий при работе с лендингом 

0. Кладем файлы лендинга в папку /uploads/lands/{landCode} -в ней стили, скрипты, картинки от исходного лендинга.

1. создаем лендинг (указываем код страницы landCode) через форму newLand

2. настраиваем параметры лендинга и создаем его секции 

3. Указываем у лендинга подключения скриптов и стилей  (примечание - вы можете использовать {baseurl} для подстановки пути к папке ресурсов лендинга). 

Из head убираем теги title, meta desc, meta keywords и ссылки на favicon (эти теги добавятся автоматически на основе данных в свойствах лендинга).

4. Для каждой секции прописываем HTML блок (admin или editor) либо, SP процедуру генерации блока (SP может редактировать только админ)

Все управление по ленду находится прямо на странице ленда. Внизу кнопки редактирования настроек ленда и кода в Head, body bottom. 

При наведении на каждую секцию - справа внизу появляется Кнопка редактирования блока. 

Детали реализации системы лендингов

Лендинг - это страница-копия со страницы example-land с пустым шаблоном.

Вся генерация ленда происходит в процедуре [dbo].lnd_getLanding, которая возвращает все настройки, а также собирает HTML блоки от секций.  

ВАЖНО! Для Core версии платформы Falcon Space необходимо передавать параметр @isCore = 1

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

По умолчанию каждая секция оборачивается в section class="as-lnd-section". Если это мешает вашей разметке, это можно отключить в параметре @enableAddingSectionCodes =0 процедуры lnd_getLanding. Если обертка не используется, то нельзя будет установить высоту секции, фон секции, а также не будет кнопок контекстного редактирования блока секции.

Даныне по лендам и секциям хранятся в таблицах с префиксом lnd_

Части решения: 

  • страница example-land
  • процедура [dbo].lnd_getLanding
  • структура от html блоков таблицы для хранения кода секций
  • формы editLand, landScriptsAndStyles, newLand
  • таблица landSections
  • ресурс - landImages

Редактирование секции лендинга

Высота секции - это установка CSS свойства min-height для секции. Если указать просто число (например, 500), то будет добавлено px (т.е. 500px).

Фон секции - указываем либо hex код через #aabbcc либо путь к картинке. Картинку можно загрузить через ресурсы ленда. 

Каждая секция ленда имеет соотствующий HTML блок (он создается автоматически при создании секции) с кодом land_{landCode}_{sectionCode}. HTML блок может быть как статичный, так и динамическим. 

Если требуется вставить картинку в секцию, то можно загрузить в настройках ленда картинку и использовать путь от картинки в разметке. 

Секцию можно перенести или отключить (в итоге она не попадет на ленд, но останется для возможности вернуть обратно).

Пример подобного ленда можно посмотреть по адресу: https://falcon.web-automation.ru/land2

Для неавторизованного пользователя не подгружаются скрипты для управления лендом (эти скрипты указываются в процедуре lnd_getLanding).

Примечания к адаптации лендингов

  1. jQuery, Bootstrap по умолчанию присоединяется к лендингу, поэтому нужно их исключить из скриптов лендинга
  2. Иногда в лендинге прописаны глобально отступы у section (а в ленде они используются как служебные секции). Поэтому можно добавить следующий CSS в стили лендинга:
    .as-lnd-section{padding: 0 0 !important;}
  3. Коды секций не должны содержать пробелы, спецсимволы. Также эти коды не рекомендуется менять (т.к. будет потерян связанный с секцией HTML блок).

Перенос лендингов на другую базу

Ленд можно переносить как SQL пакет. Используйте форму elementSQL

Falcon Space - функциальная веб-платформа разработки на узком стеке MS SQL/Bootstrap. Вводная по Falcon Space
Насколько полезной была статья?

Google поиск по нашей документации

Falcon Space

Это снижение стоимости владения

за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом

Это быстрое внесение изменений

по ходу эксплуатации программы. Как создается функционал на платформе

Это простой удобный интерфейс

адаптация под мобильные устройства. Про юзабилити платформы