Использование типовой разметки в виде сниппетов для решения различных задач

Платформа имеет некоторые специальные сниппеты разметки для облегчения реализации некоторых функций.

Установка PWA приложения по ссылке

<a href="#" class="as-pwa-install">Install</a>

Вывод youtube видео в модальном окне

<a href="#" class="as-youtube" data-itemid="reCjV565_7M" data-title="Falcon Space">
   <i class="fab fa-youtube"></i> Видео
</a>

В itemID задаем идентификатор видео (его можно взять из URL видео на Ютуб)

Вывод VK видео в модальном окне

<a href="#" class="as-vkvideo" data-id="456239758" data-oid="-184220087" data-title="XX">VIDEO VK</a>

В id и oid передаются идентификаторы видео на ВК (можно извлечь их из URL адреса видео ВК).

Загрузка таблицы/формы по ссылке

<a href="#" class="as-table-link" data-code="watch_table" data-itemid="" data-target="#div1" data-mode="append" data-hidelink="1">Загрузка таблицы в контейнер #div1</a>

<div id="div1" class="bg-info p-3">
  Контейнер, куда добавится таблица по клику на элементе
</div>

Подробнее - https://falconspace.ru/docs/tablicy--zagruzka-tablicy-po-ssylke

По аналогии делается загрузка формы по ссылке (класс as-form-link)

Вывод таблицы/формы в модальном окне

Таблица в модальном окне: 

<a href="#" class="as-table-modal" data-code="profile" data-itemid="11" data-big="1" data-slideout="2">Show table</a>

Подробнее - https://falconspace.ru/docs/tablicy--kak-sdelat-tablicu-v-modalnom-okne--otkryvaetsya-v-dialogovom-okne

Модальная форма: 

<a href="#" class="as-form-modal" data-code="profile" data-itemid="11" data-big="1" data-btntext="Сохранить">Show Form!</a>

Подробнее - https://falconspace.ru/docs/formy--kak-sdelat-modalnuyu-formu--otkryvaetsya-v-dialogovom-okne

Вывод разметки в модальном окне 

<a href="#" class="as-modal" data-title="Title 1" data-content="<p class='lead'>Text 1</p>" data-big="1" data-slideout="2">Modal link</a>

Подробнее - https://falconspace.ru/docs/modalnaya-ssylka--as-modal

Вывод контента или формы во всплывающем контекстном окне (popover)

<a href="#" class="as-popover btn btn-light" data-content="" data-title="Заголовок окна" data-trigger="manual" data-type="primary" data-size="lg" data-formcode="newForm" data-formitemid="">Show form</a>

Если форма не нужна - то используем только content атрибут, а formCode не указываем

Подробнее  - https://falconspace.ru/docs/formy--kak-vyvesti-formu-vo-vsplyvayushchem-okne-ryadom-s-knopkoy

Вывод списка картинок с возможностью просмотра большой картинки в модальном окне

<div class="as-lightbox">
	<a href="#" class="as-lightbox-item" data-title="Таблицы" data-url="/uploads/land/intro/c1.jpg">
       	<img alt="" src="/uploads/land/intro/c1-thumb.jpg">
    </a>
	<a href="#" class="as-lightbox-item" data-title="Таблицы" data-url="/uploads/land/intro/c1.jpg">
       	<img alt="" src="/uploads/land/intro/c1-thumb.jpg">
    </a>
</div>

Вывод на печать некой части страницы

<a href="#" class="as-print" data-cont=".class1">Print</a>

Если нужна вся страница то указываем в cont=body

Плавный переход к некому блоку на странице

<a href="#cont1" data-duration="400" data-shift="100">Go to cont1</a>

duration указывает количество милисекунд на скроллинг к месту,

href задает селектор контейнера, к которому будет делаться переход,

shift задает вертикальное смещение в пикселях от целевого элемента при скроллинге.