Страницы. Как внедрить лендинг со своим шаблоном и стилями
Как внедрить лендинг с другим шаблоном и своими стилями
- Шаблон (папка с файлами CSS, JS и др.) кладем в папку [TemplateName] в /uploads/html-templates
- Создаем страницу и ставим Layout=Лендинг (доступ ставим all)
- В теле страницы прописываем полный текст страницы (с html, body, head).
- Для правильных путей скриптов: пропишите в SELECT 3 в SQL странице этот путь и затем используйте его для всех относительных путей.
Например:
<link href="{sp-baseUrl}/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
-- 3 SELECT
select '/uploads/lands/stylish' baseUrl
Примечание:
- ВАЖНО!!! Обязательно требуйте, чтобы внешнюю верстку делали на Bootstrap 4 (чтобы была возможность подключить Bootstrap стили на странице).
- Рекомендуем использовать полностью все скрипты и стили от лендинга, а не использовать экземпляры библиотек (jquery, bootstrap и т.д.) от Falcon (из-за возможных проблем с версиями).
- В тело страницы вставляется по сути только то, что вы пропишете в поле Содержание страницы (т.е. вам необходимо добавить полное содержимое страницы с тегами html, head, body, со всеми стилями и скриптами и не использовать дополнительные поля для стилей)
- Если необходимы функции Falcon на лендинге, то необходимо будет вручную подключать скрипты и стили платформы
Основные системные стили Falcon:
<link rel="stylesheet" href="/Content/modules/as.css">
<link rel="stylesheet" href="/Content/modules/as.crud2.css">
<link rel="stylesheet" href="/Controls/Resource/GetFile?code=globalCSS">
<link href="/js/jqueryPlugins.min.css" rel="stylesheet">
Основные системные скрипты Falcon:
<!-- Bootstrap & jquery -->
<script src="/content/sb-admin/vendor/jquery.min.js"></script>
<script src="/content/sb-admin/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="/js/baseJS.min.js" charset="windows-1251"></script>
<script type="text/javascript" src="/js/baseJSControls.min.js" charset="windows-1251"></script>
<script type="text/javascript" src="/Controls/Resource/GetFile?code=globalJS" charset="windows-1251"></script>
<script type="text/javascript" src="/js/jqueryPlugins.min.js" charset="windows-1251"></script>
<script src="/js/falcon/pFalcon.js"></script>
<script>
$(function () {
pFalcon.init({
isDebug: false,
canEdit:false,
renderData: {
username: '',
roles: '',
urlParameters: ''
},
introParams: []
});
});
</script>
Для избежания дублирования кода в случаях, когда у вас будет несколько страниц с лендинг-разметкой, рекомендуется использовать sp параметры для вставки типовых элементов страницы из HTML блоков:
- {sp-head} - раздел head страницы.
- {sp-menu} - основное меню
- {sp-footer} - раздел footer страницы
- {sp-scripts} - подключение скриптов (скрипты от лендинга и скрипты falcon).
Саму разметку помещаем в HTML блоки, извлечение разметки делаем в SQL для страницы и передаем в SELECT 3.
declare @head nvarchar(max)
exec [dbo].[as_block] @code = 'head', @itemID = 'default',
@parameters = default, @res = @head OUTPUT
-- SELECT 3
select @head head
Подробнее про sp параметры описано в Настройки страницы в SELECT 3.
Примечание. В ноябре 2022 внедрили для механизма лендов типовые блоки. Теперь можно собрать лендинг без необходимости задействовать внешние шаблоны лендов.
Примеры типовых блоков - https://demo.web-automation.ru/allsections
Как работает механизм лендов - https://falconspace.ru/docs/sozdanie-redaktiruemogo-lendinga-cherez-mekhanizm-lendy
Google поиск по нашей документации
- Руководства
- Основа Falcon Space
- Основные компоненты
- Возможности
- Коммуникация с пользователем
- Дизайн, стилизация Панели с тенью и со скруглением Добавление анимации Как стилизовать иконку Ограничения по изменению дизайна Изменение стилизации через CSS HOWTO. Анимация элементов. Как работать с анимацией HOWTO. Как сделать анимацию иконок Управление темами сайта. Как создать новую тему дизайна сайта Как сделать липкую панель сверху страницы CSS. Как внедрить свои стили CSS на каждой странице портала CSS. Кастомные CSS файлы Руководство по юзабилити сайтов на базе Falcon Space. Как улучшить свой сайт Как улучшить внешний вид личного кабинета на сайте - элементы стилизации в разметке страниц Falcon Space Создание редактируемого лендинга через механизм Ленды Как внедрить форму настроек внешнего вида сайта Страницы. Как внедрить лендинг со своим шаблоном и стилями Как внедрять готовую верстку в страницу Верстка. Как внедрить новый шрифт в проект CSS. Как через CSS управлять стилями конкретных страниц Гид по стилям Falcon Space Кастом разметка верхней панели (TopMakeup) Как поменять степень затемнения фона у диалогового окна Верстка. Как поменять столбцы местами на смартфоне Управление анимацией для форм, таблиц Как сделать основное меню горизонтальным Как сделать основное меню белым Управление иконкой в окне alert справа вверху окна Как сделать полную кастомизацию верхней полоски сайта (customHeader) Как сделать дизайн сайта со скругленными элементами (или без скруглений) Вывод на экран денежных сумм (отображение рублей, валюты) - as-money Как увеличить картинку на странице Визуализация воронки на основе данных Создание своей темы для сайта
- API, Интеграции
- Каталоги
- Навигация
- Документы
- Дополнительные компоненты
- Продвижение, SEO
- Системные моменты
- HOWTO
- HOWTO Таблицы
- HOWTO Формы
- Работа с SQL
- HOWTO JS
- HOWTO Верстка
- Решение проблем
Falcon Space
Это снижение стоимости владения
за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом
Это быстрое внесение изменений
по ходу эксплуатации программы. Как создается функционал на платформе
Это простой удобный интерфейс
адаптация под мобильные устройства. Про юзабилити платформы