levis/help365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update
All checks were successful
Deploy Static Site / deploy (push) Successful in 6m6s
Details

Browse Source
This commit is contained in:
koziavin
2025-05-29 16:42:45 +04:00
parent e217f89702
commit 00717a92fb
2681 changed files with 173810 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

251
platform/designer-tabs.html Normal file
View File

@ -0,0 +1,251 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Designer tabs</title>
<meta name="generator" content="Help+Manual" />
<meta name="keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="In the interface designer, you can work on the Template, Context, Scripts, History, Settings, and Files tabs." />
<meta name="picture" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Full documentation for BRIX365 platform. Low-code developer guide. User guide. Admin guide. Developer guide." />
<meta property="og:url" content="https://brix365.com/en/help" />
<meta property="og:image" content="" />
<link rel="icon" href="favicon.png" type="image/png" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="./jquery-ui.min.css" />
<link rel="stylesheet" href="default.css" />
<link rel="stylesheet" href="./search-yandex.css" />
<link rel="stylesheet" href="./article.css" />
<link rel="stylesheet" href="./glossary.css" />
<link rel="stylesheet" href="./theme.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="helpman_settings.js"></script>
<script type="text/javascript" src="helpman_topicinit.js"></script>
<script type="text/javascript" src="highlight.js"></script>
<script type="text/javascript">
$(document).ready(function(){highlight();});
</script>
</head>
<body>
<script>!function(e,t,c,n,r,a,m){e.ym=e.ym||function(){(e.ym.a=e.ym.a||[]).push(arguments)},e.ym.l=1*new Date;for(var s=0;s<document.scripts.length;s++)if(document.scripts[s].src===n)return;a=t.createElement(c),m=t.getElementsByTagName(c)[0],a.async=1,a.src=n,m.parentNode.insertBefore(a,m)}(window,document,"script","https://mc.yandex.ru/metrika/tag.js"),ym(83179930,"init",{clickmap:!0,trackLinks:!0,accurateTrackBounce:!0,webvisor:!0})</script><noscript><div><img alt=""src=https://mc.yandex.ru/watch/83179930 style=position:absolute;left:-9999px></div></noscript>
<header class="header elma-365">
<div class="container">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-en.svg" alt="header logo">
</a>
<!-- <div class="hero__search-form" id="search-panel">
<form class="search-form" onsubmit="ym(83180416,'reachGoal','poisk')">
<label class="search-form__label">
<span id="reset-search" class="search__icon"></span>
<input class="search-form__input" type="text">
</label>
<input class="search-form__submit" type="submit" value="Submit">
</form>
</div> -->
<div class="hero__search-form" id="search-panel"> <form class="search-form"> <label class="search-form__label"> <span id="reset-search" class="search__icon"></span> <input class="search-form__input" type="text"> </label> <input class="search-form__submit" type="submit" value="Submit"> </form> </div>
<div class="hero__search">
<a href="#" id="search-icon" class="hero__search-icon">
<img src="search-icon-white.svg" alt="search string">
</a>
<a href="#" id="side-menu-icon" class="hero__side-icon">
<img src="side_menu.svg" alt="side menu">
</a>
</div>
<div class="header__navi">
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a class="project-link" href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://brix365.com/en/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li><li><a class="project-link" href="https://brix365.com/en/help/business_solutions/-elma365-store.html">Business Solutions</a></li></ul></span></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li><li><a href="https://tssdk.brix365.com/" target="_blank">SDK</a></li></ul>
</div>
</div>
</header>
<main class="main container">
<aside class="sidebar" id="sidebar">
<div class="sidebar__header">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-light-en.svg">
</a>
<span class="sidebar__close elma-365-close" id="close"></span>
</div>
<div class="sidebar__wrapper" id="side-menu">
</div>
</aside>
<article class="article" id="article">
<div class="article-inner">
<div class="content">
<header class="article__header">
<div class="article__bread" style="display:flex; gap:10px;">
<span id="subcategory" class="search-res__item-category search-res__item-category_subcategory subcategory article__badge"></span>
<div class="topic__breadcrumbs">
<p>Low-code designer &gt; <a href="interface_settings.html">Set up interfaces</a> / Designer tabs</p>
</div>
</div>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Designer tabs</span></h1>
</div>
</header>
<section class="article__content">
<div class="scroll-top-inner">
<a href="#h1-article" class="scroll-top"></a>
</div>
<!-- Placeholder for topic body. -->
<p style="line-height: 1.20; margin: 0 0 11px 0;">In the interface designer, you can work on the <span style="font-weight: bold;">Template</span>, <span style="font-weight: bold;">Context</span>, <span style="font-weight: bold;">Scripts</span>, <span style="font-weight: bold;">History</span>, <span style="font-weight: bold;">Settings</span>, and <span style="font-weight: bold;">Files</span> tabs.</p>
<h2 class="p_Heading2"><a id="template" class="hmanchor"></a><span class="f_Heading2">Template tab</span></h2>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">On the <span style="font-weight: bold;">Template</span> tab, you will fill the interface with widgets and customize the appearance of pages and forms.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">To add a widget, drag it to the modeling canvas and customize it. You can use <span style="color: #0000ff;"><a href="tabs.html" class="topiclink">standard widgets</a></span>, and you can also create your own <span style="color: #0000ff;"><a href="user_widgets.html" class="topiclink">custom widgets</a></span>.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">Standard widgets are grouped by type. Depending on what item of the system you are customizing, a page or a form, you will have a specific set of widgets available to you. For example, you cannot add widgets intended for the form sidebar to pages. Forms, on the other hand, cannot have widgets intended for pages.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">To create a custom widget, combine the standard widgets with each other. For example, you can add a <span style="font-weight: bold;">Panel with header</span>, place <span style="font-weight: bold;">Columns</span> in it, and in one of the columns add a <span style="font-weight: bold;">Table</span> with a report. Save the widget, and you can use it later when customizing other interfaces.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">To learn how to place widgets on the canvas, see the <span style="color: #0000ff;"><a href="360027211631.html" class="topiclink">Add a widget to a page</a></span> and <span style="color: #0000ff;"><a href="360029250931.html#addingawidgettothetemplate" class="topiclink">Form templates</a></span> articles.</p>
<h2 class="p_Heading2"><a id="context" class="hmanchor"></a><span class="f_Heading2">Context tab</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">On the <span style="font-weight: bold;">Context</span> tab, you can add properties that can be placed on the modeling field and used in scripts. To create a property, click <span style="font-weight: bold;">+Add</span> and specify its parameters. Read more about properties and how to add them in the <span style="color: #0000ff;"><a href="360028941112.html" class="topiclink">Context tab</a></span>, <span style="color: #0000ff;"><a href="360009707032.html" class="topiclink">System data types</a></span>, and <span style="color: #0000ff;"><a href="context_types.html" class="topiclink">Context types</a></span> articles.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="designer-tabs-02" width="798" height="174" style="margin:0;width:798px;height:174px;border:none" src="designer-tabs-02.png"/></p>
<h2 class="p_Heading2"><a id="scripts" class="hmanchor"></a><span class="f_Heading2">Scripts tab</span></h2>
<p style="line-height: 1.20; margin: 0 0 11px 0;">On this tab, you can write scripts for data processing to use them in widget settings. For example, you can use a script to display current exchange rates on the page or create a page header that will change depending on the current date.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">You can also customize the behavior of widgets, for example, to show a popup window when the user hovers over a certain area of a form or page. Read more about it in the <span style="color: #0000ff;"><a href="client_server_scripts.html" class="topiclink">Scripts in widgets</a></span> article.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="designer-tabs-2" width="907" height="462" style="margin:0;width:907px;height:462px;border:none" src="designer-tabs-2.png"/></p>
<h2 class="p_Heading2"><a id="history" class="hmanchor"></a><span class="f_Heading2">History tab</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">On this tab, you can view all published versions of the interface with the author, time, and comments left during publication. The list will also show versions that have been <a href="designer-tabs.html#unpublish" class="topiclink">unpublished</a>.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="designer-tabs-01" width="818" height="228" style="margin:0;width:818px;height:228px;border:none" src="designer-tabs-01.png"/></p>
<h3 class="p_Heading3"><a id="restore" class="hmanchor"></a><span class="f_Heading3">Restore a previous version</span></h3>
<p style="line-height: 1.20; margin: 0 0 11px 0;">You can restore any previously published version of the interface. To do this, select it in the list, click the <span style="font-weight: bold;">Apply Version</span> button in the upper right corner of the page, and confirm the action.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">The settings of the selected version will be applied to the current draft of the interface opened on the <span style="font-weight: bold;">Template</span> tab. All saved but not published changes will be lost.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">You can edit the restored version of the form or page, and change the layout or widget settings. To apply the interface and allow users to access it, click the <span style="font-weight: bold;">Save</span> and <span style="font-weight: bold;">Publish</span> buttons on the top panel of the designer again.</p>
<h3 class="p_Heading3"><a id="unpublish" class="hmanchor"></a><span class="f_Heading3">Unpublish a version</span></h3>
<p style="line-height: 1.20; margin: 0 0 11px 0;">To avoid scripting a previous version of the interface or to prevent applying a version with an error, you can unpublish it. To do this, select the version in the list and click <span style="font-weight: bold;">Unpublish</span> in the top right corner of the page.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">You can also unpublish all previous versions of the interface while <a href="interface_designer.html#unpublish" class="topiclink">publishing a new version</a>.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">If you want to restore an unpublished version, select it from the list, and in the upper right corner of the page click the <span style="font-weight: bold;">Restore publication</span> button that appears.</p>
<h2 class="p_Heading2"><a id="settings" class="hmanchor"></a><span class="f_Heading2">Settings tab</span></h2>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">On this tab, you can:</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;">Hide the widget with validation errors.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;">Make it possible to display the widget on the top panel or sidebar.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;">Set system functions.</li><li class="p_Normal">Allow the use of the following in the widget:<ul style="list-style-type:disc">
<li class="p_Normal">Global objects.</li><li class="p_Normal">Elements of the current workspace.</li><li class="p_Normal">Objects and variables from selected workspaces or custom modules with which <a href="optional-dependencies.html" class="topiclink">optional dependencies</a> are established. This capability is a useful option for solution development, as in this case, the widget can be exported without limitations.</li></ul></li></ul>
<h3 class="p_Heading3"><a id="main" class="hmanchor"></a><span class="f_Heading3">Main settings</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">If you are customizing the <span style="color: #0000ff;"><a href="360009918011.html" class="topiclink">creation or editing form</a></span> of an app item, <span style="color: #0000ff;"><a href="360012495611.html" class="topiclink">task</a></span>, or <span style="color: #0000ff;"><a href="360012496011.html" class="topiclink">start event</a></span>, you can use the <span style="font-weight: bold;">Hide widget with validation errors</span> option. Select the checkbox to display validation errors only under incorrectly filled fields. If the option is disabled, the widget is displayed at the top of the form and lists all errors.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="designer-tabs-4" width="488" height="323" style="margin:0;width:488px;height:323px;border:none" src="designer-tabs-4.png"/></p>
<h3 class="p_Heading3"><span class="f_Heading3">Custom widget settings</span></h3>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">When you create a <span style="color: #0000ff;"><a href="user_widgets.html" class="topiclink">custom widget</a></span> on this tab, you can control its placement within other interfaces. By default, a custom widget can only be added to the main part of the form. You can enable the following options:</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Display widget in the form header with buttons</span>. Check the box to allow the widget to be placed on the top panel of any form.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Display widget in the sidebar</span>. Check the box to allow placing the widget in the sidebar of any form.</li></ul>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">You can also customize the widget display on the designer modeling canvas of a form or page. The selected view does not affect the functionality of the widget after the custom interface is published.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">Available options:</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Full</span>. By default, the widget is displayed on the modeling canvas in the same way as it will be displayed after publication.</li></ul>
<ul style="list-style-type:disc"><ul style="list-style-type:circle">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Call initialization function in the builder</span>. By default, <a href="widget_functions.html#oninit" class="topiclink">the initialization function</a> is enabled in the widget containing scripts and allows, for example, sending requests to the server to obtain data.</li></ul></li></ul>
<p style="line-height: 1.20; margin: 7px 0 16px 59px;">In the form editing mode, there may not be enough data on the server and the scripts will be executed with an error. To prevent this from affecting the display of the widget and the work of the designer, disable the option.</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Show only the widget name</span>. Only the widget name is displayed in the designer to indicate its location on the form. You can use it to compactly place widgets on the modeling canvas and quickly go to their settings.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">Custom widget</span>. When you select this view, the Create Form button will appear. Click it and create a widget form that will be displayed instead of the original one when modeling a form or a page. </li></ul>
<p style="line-height: 1.20; margin: 7px 0 16px 34px;">This is convenient if the widget contains, for example, text content and other widgets. In this case, you can show the widget schematically on the template. Such a form is configured, for example, for the <a href="modal_window.html" class="topiclink">Modal Window</a> widget.</p>
<h3 class="p_Heading3"><a id="system-functions" class="hmanchor"></a><span class="f_Heading3">System functions</span></h3>
<p style="line-height: 1.20; margin: 7px 0 7px 0;">Here you can select the functions you want to apply when displaying the widget or validating the form. It is optional to specify functions on this tab.</p>
<p style="line-height: 1.20; margin: 7px 0 7px 0;">By default, the following functions are executed if they are defined in scripts:</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="color: #0000ff;"><a href="widget_functions.html#oninit" class="topiclink">onInit()</a></span> when initializing the widget.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><a href="widget_functions.html#destroy" class="topiclink">destroy()</a> when ending the widget<span style="color: #202122; background-color: #ffffff;">’s work.</span></li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="color: #0000ff;"><a href="widget_functions.html#canrender" class="topiclink">canRender()</a></span> when checking the conditions for displaying the widget.</li><li style="line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="color: #0000ff;"><a href="widget_functions.html#onload" class="topiclink">onLoad()</a></span> when the rendering of the widget is completed.</li></ul>
<p style="line-height: 1.20; margin: 7px 0 7px 0;">You can replace these functions with other functions to customize the execution of additional actions, for example, loading and preparing data for displaying in the widget. To do this, select a function or create one in the <span style="font-weight: bold;">Initialization</span>, <span style="font-weight: bold;">Destroy</span>, <span style="font-weight: bold;">Display needed</span>, or <span style="font-weight: bold;">Rendering finished</span> fields.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">You can also select a <span style="color: #0000ff;"><a href="widget_functions.html#customvalidation" class="topiclink">function</a></span> to perform custom validation that makes sure that the <span style="color: #0000ff;"><a href="create_form.html" class="topiclink">form</a></span> is filled out correctly. By default, no function for validation is set. In this function, you can implement additional checks to the already existing standard validation when the user tries to save the form. For example, define checks for form field values.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="designer-tabs-5" width="639" height="227" style="margin:0;width:639px;height:227px;border:none" src="designer-tabs-5.png"/></p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">To specify a function from your scripts, select <span style="font-weight: bold;">Client</span> or <span style="font-weight: bold;">Server</span> and specify its name.</p>
<p style="line-height: 1.20; margin: 7px 0 16px 0;">You can proceed to create a script by clicking <span style="font-weight: bold;">Create</span>. Then specify the name of the function and click <span style="font-weight: bold;">Save</span>. After that, go to the <span style="font-weight: bold;">Scripts</span> tab by clicking <span style="font-weight: bold;">Open</span>. To learn more about creating a script on the <span style="font-weight: bold;">Client</span> or <span style="font-weight: bold;">Server</span> side, read the <span style="color: #0000ff;"><a href="client_server_scripts.html" class="topiclink">Scripts in widgets</a></span> article.</p>
<h3 class="p_Heading3"><a id="available-items" class="hmanchor"></a><span class="f_Heading3">Available items</span></h3>
<p style="line-height: 1.20; margin: 0 0 11px 0;">Here you can allow the use of widgets configured within the workspace or company, as well as access <a href="global-constants.html" class="topiclink">global constants</a> in the script.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;"><img alt="designer-tabs-6" width="1167" height="165" style="margin:0;width:1167px;height:165px;border:none" src="designer-tabs-6.png"/></p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Available items</span>. Provide access to additional items of other levels:<ul style="list-style-type:circle">
<li class="p_Normal"><span style="font-weight: bold;">Allow using of all items</span>. Check the box to enable access to the <span style="color: #0563c1;"><a href="global-constants.html" class="topiclink">Global</a></span> and widgets from other workspaces. Then you can use variables contained in workspaces and global parameters when writing scripts. Please note that using the <code><b>Global</b></code> constant and widgets from other workspaces restricts the ability to <a href="360009669292.html" class="topiclink">export an app</a> or <a href="360007722171.html" class="topiclink">workspace</a>.</li><li class="p_Normal"><span style="font-weight: bold;">Allow using all items in the workspace</span>. Check the box to access the <span style="color: #0563c1;"><a href="global-constants.html" class="topiclink">Namespace</a></span> constant and widgets of the current workspace. Please note that accessing workspace objects in a script and using workspace widgets restrict the ability to <span style="color: #0000ff;"><a href="360009669292.html" class="topiclink">export an app</a>.</span></li></ul></li></ul>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample" style="font-family: Arial,Helvetica,sans-serif;">начало&nbsp;внимание</span></p>
<p class="p_Normal" style="line-height: 1.20;">Using <code><b>Global</b></code> or <code><b>Namespace</b></code> constants in scripts restricts the export of system components. For more information, refer to <a href="global-constants.html#export" class="topiclink">Global constants in scripts</a>.</p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample" style="font-family: Arial,Helvetica,sans-serif;">конец&nbsp;внимание</span></p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Optional dependencies (available in the Imports object)</span>. Set <a href="optional-dependencies.html" class="topiclink">optional dependencies</a> on selected workspaces or custom modules. The specified components can then be accessed in the widget script using the <a href="global-constants.html" class="topiclink">Imports</a> constant. This allows you to export and import an app or workspace without restrictions.</li></ul>
<p style="line-height: 1.20; margin: 7px 0 7px 34px;">To set the dependency, click <span style="font-weight: bold;">+Add Workspace</span> and select the workspace or custom module. Then, in the <span style="font-weight: bold;">Alias</span> column, enter a unique name for it that will be used in the script. You can use numbers and an underscore to separate words. By default, the field contains the workspace code or module ID.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">For more information about using <code><b>Global</b></code> and <code><b>Namespace</b></code> constants in scripts, see <a href="%20%20https://tssdk.brix365.com/en/latest/pages/quick-start/intro_globals.html" target="_blank" class="weblink">Global context and isolation</a> in BRIX TS SDK. The use of the <code><b>Imports</b></code> constant is described in the <a href="optional-dependencies.html" class="topiclink">Optional dependencies</a> article.</p>
<h2 class="p_Heading2"><a id="files" class="hmanchor"></a><span class="f_Heading2">Files tab</span></h2>
<p style="line-height: 1.20; margin: 19px 0 0 0;">On the <span style="font-weight: bold;">Files</span> tab, you can add JavaScript libraries and custom functions to access them in <span style="color: #0000ff;"><a href="client_server_scripts.html" class="topiclink">client-side scripts</a></span>.</p>
<p style="line-height: 1.20; margin: 19px 0 0 0;"><img alt="designer-tabs-7" width="1167" height="198" style="margin:0;width:1167px;height:198px;border:none" src="designer-tabs-7.png"/></p>
<div class="bottom-nav">
<a id="prev-link" class="topic__navi_prev" href="interface_designer.html">
<span class="bottom-nav__arrow bottom-nav__arrow--prev"></span> <span
class="bottom-nav__link">interface_designer.html</span>
</a>
<a id="next-link" class="topic__navi_next" href="canvas-navigation.html">
<span class="bottom-nav__link">canvas-navigation.html</span> <span
class="bottom-nav__arrow bottom-nav__arrow--next"></span>
</a>
</div>
<!-- добавляет на страницу строку блок Была ли статья полезной? -->
<div class="feedback" id="feedback"><div class="feedback-help"><span><b>Was this helpful?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx" style="display: none;">Thanks for your feedback!</div><div class="feedback__popup" id="feedback__popup_why" style="display: none;"><div class="feedback__popup-header">Please specify why:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Recommendations did not help me</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Article is hard to understand</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Didn`t answer my question</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Content does not match the topic</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Other</label></div><div class="feedback__popup" id="feedback__popup-other" style="display: none;"><div class="feedback__popup-header">How we can improve it?</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Submit"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg" class="small-img" alt="like"><spanclass="feedback-form__btn-group_yes-btn">Yes</spanclass="feedback-form__btn-group_yes-btn"></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg" class="small-img" alt="dislike"><spanclass="feedback-form__btn-group_no-btn">No</spanclass="feedback-form__btn-group_no-btn"></label></div><select name="category"><option disabled="">Please specify why</option><option value="bad_recommendation" selected="">Recommendations did not help me</option><option value="difficult_text">Article is hard to understand</option><option value="no_answer">Didn`t answer my question</option><option value="bad_header">Content does not match the topic</option><option value="other_reason">Other</option></select><input type="submit"></form></div><div class="found_typo"><p style="margin: 0px; margin-top: 16px !important;"><span><b>Found a typo?</b></span> Select it and press <i>Ctrl+Enter</i> to send us feedback</p></div></div>
</section>
</div>
<aside class="article__sidebar" style="display:none">
<input type="checkbox" />
<div class="article__arrow"></div>
<div class="table-of-contents elma365-right" id="toc2Content">
<h3 class="h3-toc">In this topic</h3>
<nav id="toc2"></nav>
</div>
</aside>
</div>
</article>
</main>
<footer class="footer">
<div class="footer-container">
<div class="footer-mobile">
<ul class="footer-mobile__list"><li><a href="https://brix365.com/en/" target="_blank">BRIX</a></li><li><a href="https://tssdk.brix365.com/en/latest/" target="_blank">SDK</a></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li></ul><ul class="footer-mobile__list"><li><a href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li></ul>
</div>
<div class="footer-wrap">
<div><span class="mobile-question-popup">Send feedback</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Ask a question</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Send"></div></form><div class="hidden fade-in question-success-xs">Sent</div></div>
<div class="footer-flex-b">
<span class="footer-copy">&copy; 2025 BRIX</span>
<ul class="footer-list">
<li class="footer-item">
<a href="#" class="arrow-top" style="display: block;"></a>
</li>
</ul>
</div>
</div>
</div>
</footer>
<iframe name="hmnavigation" style="display:none!important"></iframe>
<script src="./jquery-ui.js"></script>
<!--script src="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script-->
<script src="./jquery.tocify.min.js"></script>
<script src="./TypoReporter.min.js"></script>
<script src="./google-search.js"></script>
<script src="./main.js"></script>
</body>
</html>