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

This commit is contained in:
2025-05-29 16:42:45 +04:00
parent e217f89702
commit 00717a92fb
2681 changed files with 173810 additions and 0 deletions

View File

@ -0,0 +1,200 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page header widget</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="The widget displays the following components in the top panel of the external portal page:" />
<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> &gt; Widget types &gt; Portal widgets / Page header widget</p>
</div>
</div>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Page header widget</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="text-align: justify; line-height: 1.20; margin: 7px 0 16px 0;">The widget displays the following components in the top panel of the external portal page:</p>
<ul style="list-style-type:disc">
<li style="text-align: justify; line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;">Company name and logo.</li><li style="text-align: justify; line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;"><span style="font-weight: bold;">My Portals</span> button. It appears if the user has access to several portals. It allows to switch to another portal without re-authorization.</li><li style="text-align: justify; line-height: 1.20; margin-top: 7px; margin-right: 0; margin-bottom: 16px;">User name and the <span style="font-weight: bold;">Sign Out</span> button.</li></ul>
<p style="text-align: justify; line-height: 1.20; margin: 7px 0 16px 0;">On pages created <span style="color: #0000ff;"><a href="portal-setting.html#template" class="topiclink">by the template</a></span>, the widget is added to the <span style="color: #0000ff;"><a href="portal_elements.html" class="topiclink">Header</a></span> by default. </p>
<p class="p_Normal"><img alt="portal_title_widget" width="791" height="162" style="margin:0;width:791px;height:162px;border:none" src="portal_title_widget.png"/></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">When viewing external portal pages from a mobile device, the <img alt="portal_title_widget_2" title="portal_title_widget_2" width="29" height="24" style="margin:0;width:29px;height:24px;border:none" src="portal_title_widget_2.png"/><span style="font-weight: bold;"> </span>button is added to the <span style="font-weight: bold;">Page header widget</span>, which is used to navigate through the portal.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Set up the widget</span></h2>
<p class="p_Normal">You can configure the widget settings in the <a href="interface_designer.html" class="topiclink">interface designer</a>. To do this, go to the workspace with the customized portal, open its page, and click on the name of the added page in the list. &nbsp;</p>
<p class="p_Normal">Select the widget and click on the gear icon.</p>
<p class="p_Normal"><img alt="page_header_01" width="928" height="464" style="margin:0;width:928px;height:464px;border:none" src="page_header_01.png"/></p>
<p class="p_Normal">The following options are available in the opened menu: </p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Set Up</span>. The <a href="common_widget_settings.html" class="topiclink">System widget settings</a> window will open. It allows you to control the widgets visibility and access, customize its hover behavior, etc. </li><li class="p_Normal"><span style="font-weight: bold;">Go to Builder</span>. The widget builder opens, where you can customize the elements added by default: page header, company name and logo, user name, and <span style="font-weight: bold;">Sign Out</span> button.</li></ul>
<h3 class="p_Heading3"><span class="f_Heading3">Set up widget content </span></h3>
<p class="p_Normal">In the designer, using the built-in <a href="code_widget.html" class="topiclink">Code</a> and <a href="client_server_scripts.html" class="topiclink">scripts</a> widgets, you can edit the elements added to the widget. For example, to edit the header, go to the <span style="font-weight: bold;">Scripts</span> tab and change the value of the <span style="font-weight: bold;">PageHeaderText</span> variable in the following line: </p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">let headerText: string = 'PageHeaderText';&nbsp;</span></p>
<p class="p_Normal">You can read more about output methods in the <span style="font-weight: bold;">Code</span> widget and about working with scripts in BRIX TS SDK in <a href="https://tssdk.brix365.com/en/latest/interfaces/_102_ui_widgets_.widget.html" target="_blank" class="weblink">API for displaying standard widgets</a> and <a href="https://tssdk.brix365.com/en/latest/modules/_102_ui_widgets_.html" target="_blank" class="weblink">“Code” widget</a>.  </p>
<p class="p_Normal">To finish configuring the widget, click <span style="font-weight: bold;">Save</span>. Then save and publish the edited page by clicking the buttons on the top panel of the interface designer.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Remove the widget </span></h2>
<p class="p_Normal">To remove a widget from a page, go to the interface designer and select it. Then click on the recycle bin icon and confirm the action. </p>
<p class="p_Normal">You can add the deleted widget again. To do this, drag the widget from the right sidebar of the interface designer to the top panel of the template or click on<span style="font-weight: bold;"> +Widget</span> and select <span style="font-weight: bold;">Page header widget</span>.</p>
<p class="p_Normal">You can also remove the widget from the page by hiding the panel in which it is displayed. Read more about it in <a href="portal_elements.html" class="topiclink">External portal items</a>.</p>
<div class="bottom-nav">
<a id="prev-link" class="topic__navi_prev" href="portal_elements.html">
<span class="bottom-nav__arrow bottom-nav__arrow--prev"></span> <span
class="bottom-nav__link">portal_elements.html</span>
</a>
<a id="next-link" class="topic__navi_next" href="portal_navigation_widget.html">
<span class="bottom-nav__link">portal_navigation_widget.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>