Как устроен механизм лендингов внутри

Механизм лендов позволяет практически не использовать стили от платформы. 

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

Тело страницы ленда с комментариями: 

  
    <meta charset="utf-8">
    <!-- Манифест для PWA -->
    <link rel="manifest" href="/manifest.webmanifest" crossorigin="use-credentials">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- SEO данные, котоорые берутся из SP параметров - на основе данных из процедуры getLanding --> 
    <title>{sp-seoTitle}</title>
    <meta content="{sp-seoDescription}" name="description">
    <meta content="{sp-seoKeywords}" name="keywords">
    {sp-favicon}
    <!-- falcon styles - они нужны для вывода компонентов платформы --->
     <link rel="stylesheet" href="/content/modules/as.css">
    <link rel="stylesheet" href="/content/modules/as.crud2.css?v=2">
    <!-- глобальный CSS от платформы (задается в настройках /settings )  -->
    <link rel="preload" as="style" href="/controls/resource/getfile?code=globalcss" onload="this.rel='stylesheet'">

    <!-- подключение bootstrap 4 и иконок  -->   
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">    
    <link rel="stylesheet" href="/content/sb-admin/vendor/fontawesome-free/css/all.min.css">

    <style type="text/css">
      .as-lnd-section{position: relative;}
    </style>
    {sp-headSection}    
    <script>
    /*to prevent Firefox FOUC, this must be here*/
    let FF_FOUC_FIX;
  	</script>
  
  
    {sp-text}
    <!-- falcon scripts - здесь лучше ничего не убирать, иначе компоненты платформы могут не работать как необходимо --->
    <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/jqueryplugins.min.js" charset="windows-1251"></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="/uploads/as.systemoptions.js" charset="windows-1251"></script>
	
	{sp-signalr}
    <script src="/js/falcon/pfalcon.js"></script>
    <script>
      $(function() {
        pFalcon.init({
          isDebug: false, canEdit: false,renderData: { username: '', roles: '', urlParameters: ''},
          introParams: null, hintsParams: null
        });
        {sp-stuffScript}
        
      });
    </script>    
    <!-- falcon scripts --->
	{sp-bodyBottomSection}   

<!-- Далее идет код для работы PWA -->
	<input type="hidden" class="as-enablePWANotifications" value="1">
    <script>
        // Check compatibility for the browser we're running this in
        if ("serviceWorker" in navigator) {
            if (navigator.serviceWorker.controller) {
                console.log("[PWA Builder] active service worker found, no need to register");
            } else {
                // Register the service worker
                console.log("Register the service worker...")
                navigator.serviceWorker
                    .register("/pwabuilder-sw.js", {
                        scope: "./"
                    })
                    .then(function (reg) {
                        console.log("[PWA Builder] Service worker has been registered for scope: " + reg.scope);
                    });
            }
        }
        // may be let deferredPrompt;
        let deferredPrompt = null;
        // вызывается только если не установлено приложение в браузере! См. chrome://apps
        // $(window).on('beforeinstallprompt', function (e) {
        window.addEventListener('beforeinstallprompt', function (e) {
            console.log("beforeinstallprompt")
            // return; Иногда влияло на Autocomplete
            // Prevent Chrome 67 and earlier from automatically showing the prompt

            e.preventDefault();
            // Stash the event so it can be triggered later.
            deferredPrompt = e;
            console.log("window.deferredPrompt", e);
            return false;
        });
    </script>
  

Код страницы SQL с комментариями: 

CREATE PROCEDURE [dbo].[pg_crumbs_example-land]
	@roles nvarchar(128),
	@itemID nvarchar(128) = '',
    @urlParameters CRUDFilterParameter READONLY	 -- коллекция (Key,Value). здесь спец параметры langID, username
AS
BEGIN
    -- извлекаем код ленда из названия процедуры. ВАЖНО - здесь можно просто поставить код какого-то другого ленда. 
	declare @landCode nvarchar(128) =  replace(OBJECT_NAME(@@PROCID), 'pg_crumbs_', '')
	declare @username nvarchar(128) = (select value from @urlParameters where [key]='username')

    declare @result TABLE (title nvarchar(256), link nvarchar(256), tooltip nvarchar(256),
		ord int, [right] bit, customLink nvarchar(512))	

    declare @isCore int = iif(dbo.as_setting('isCore', '')='1', 1, 0)   
    
    declare @langID nvarchar(max) = (select top 1 Value from @urlParameters where [Key]='langID')
    declare @pageCode nvarchar(max) = (select top 1 Value from @urlParameters where [Key]='pageCode')
    
    declare @inputParameters ExtendedDictionaryParameter
    insert into @inputParameters([Key], Value2)
    select 'langID', @langID
    union select 'itemID', @itemID
    union select 'pageCode', @pageCode
    -- КЛЮЧЕВАЯ ПРОЦЕДУРА, которая собирает все данные по ленду (секции, SEO данные и т.д.)
    declare @p ExtendedDictionaryParameter
    insert into @p([Key], Value2)    
    exec lnd_getLanding @code=@landCode, @enableAddingSectionCodes = 1, @username = @username, @isCore = @isCore, @parameters = @inputParameters

	-- SELECT 1
	select * from @result order by ord
	
	-- SELECT 2
	select 1 	

   declare @favicon nvarchar(256) = isnull((select Value2 from @p where [key]='favicon'), '')
   if(len(@favicon)=0) set @favicon = isnull(dbo.rs_resourceLink('favIcon','0',1),'/content/images/favicon.ico')
   declare @globalLandBottomSection nvarchar(max) = dbo.as_setting('CommonScripts', '')
   declare @globalLandHeadSection nvarchar(max) = dbo.as_setting('CommonStyles', '')
   
    -- SELECT 3 
    select top 1
    	isnull((select Value2 from @p where [key]='text'), '')  text,
        isnull((select Value2 from @p where [key]='seoTitle'), '')  seoTitle,
        isnull((select Value2 from @p where [key]='seoDescription'), '')  seoDescription,
        isnull((select Value2 from @p where [key]='seoKeywords'), '')  seoKeywords,
        isnull((select Value2 from @p where [key]='headSection'), '')  + isnull(@globalLandHeadSection, '') headSection,
        isnull((select Value2 from @p where [key]='bodyBottomSection'), '') + isnull(@globalLandBottomSection, '')  bodyBottomSection,     
        isnull((select Value2 from @p where [key]='stuffScript'), '')  stuffScript,
        iif(len(@favicon)>0, '', '') favicon,
      	@landCode landCode, 
        iif(@isCore=1, '', 
           '
			') signalr
END 

Примечание:

• здесь можно подлезть со параметрами в ленд (например извлечь itemID из @urlParameters и в зависимости от него проставить title, description, keywords или делать редирект в случае невалидного itemID). В секциях ленда тоже можно получить параметр itemID в процедурах секции. 
• в Head и Body Bottom части страницы добавляются скрипты и стили из 2 настроек в /settings - CommonScripts, CommonStyles.
• если необходимо поменять URL у ленда, то меняем код страницы, меняем аккуратно код процедуры (чтобы он соответствовал новому коду стараницы) и ставим в строке declare @landCode ...   = старый код ленда. 
• для глубокой кастомизации внешнего вида важно, чтобы не было лишних стилей as.css и as.crud2.css практически не влияют на глобальные стили. Важно не тянуть в лендинг никаких других стилей. Также можно попробовать изменить версию Bootstrap в странице (для JS и CSS), но это может негативно сказаться на каких либо компонентах платформы (т.к. ее разметка написана под Bootstrap 4).