Difference between revisions of "Left Sidebar"

From Lianjapedia
Jump to: navigation, search
(Border color)
 
(20 intermediate revisions by the same user not shown)
Line 1: Line 1:
''Under construction''
 
 
 
==See Also==
 
==See Also==
[[App Settings]], [[Page Attributes]], [[Right Sidebar]], [[Understanding Lianja UI Navigation]], [[Users and Roles]], [[Using the showdocument() function and Lianja.showDocument() method]]
+
[[App Settings]], [[Colors]], [[CSS]], [[Page Attributes]], [[Right Sidebar]], [[Understanding Lianja UI Navigation]], [[Users and Roles]], [[Using the showdocument() function and Lianja.showDocument() method]]
  
 
==Overview==
 
==Overview==
Line 16: Line 14:
 
Show left sidebar (True | False).
 
Show left sidebar (True | False).
  
[[{{ns:file}}:show_left_sidebar.png|450px|thumb|left|link={{filepath:show_left_sidebar.png}}|Page Left Sidebar Attribute: Show left sidebar]]
+
The '''Show left sidebar''' attribute determines whether the left sidebar is shown.
  
 
+
[[{{ns:file}}:l9_show_left_sidebar.png|800px|border|left|link={{filepath:l9_show_left_sidebar.png}}|Page Left Sidebar Attribute: Show left sidebar]]
 
+
<br clear=all>
 
+
The '''Show left sidebar''' attribute determines whether the left sidebar is shown.
+
  
 
In the [[App Settings]], the '''Left sidebar visible''' setting in Page defaults determines whether newly created pages have a visible left sidebar or not.
 
In the [[App Settings]], the '''Left sidebar visible''' setting in Page defaults determines whether newly created pages have a visible left sidebar or not.
  
<br clear=all>
+
Note: the left sidebar is not displayed on Mobile client phone Apps.
  
 
==Collapse left sidebar==
 
==Collapse left sidebar==
Line 41: Line 37:
 
<br clear=all>
 
<br clear=all>
  
[[{{ns:file}}:collapse_left_sidebar2.png|450px|thumb|left|link={{filepath:collapse_left_sidebar2.png}}|Page Left Sidebar Attribute: Collapse left sidebar]]
+
[[{{ns:file}}:collapse_left_sidebar2.png|450px|thumb|left|link={{filepath:collapse_left_sidebar2.png}}|Page Left Sidebar: Showing and hiding the left sidebar]]
  
  
  
  
Clicking the 'HIDE' tab hides the left sidebar again.
+
Clicking the 'HIDE' tab will hide the left sidebar again.
  
 
<br clear=all>
 
<br clear=all>
 +
 +
[[{{ns:file}}:collapse_left_sidebar3.png|450px|thumb|left|link={{filepath:collapse_left_sidebar3.png}}|Page Left Sidebar: Showing and hiding the left sidebar on the Web client]]
 +
 +
 +
 +
 +
In the Web/Mobile client (browser/tablet) clicking the right border of the left sidebar allows it to be hidden or shown.
 +
 +
In the Web/Mobile client the '''Collapse left sidebar''' attribute is ignored, so if '''Show left sidebar''' is true, the left sidebar is displayed when the App is first loaded.
 +
 +
<br clear=all>
 +
 +
The left sidebar can also be hidden/shown using the [[Using the showdocument() function and Lianja.showDocument() method|showdocument() function or the Lianja.showDocument() method]]:
 +
 +
<pre>Lianja.showDocument("page:customers?action=hideleftsidebar")</pre>
 +
 +
<pre>Lianja.showDocument("page:customers?action=showleftsidebar")</pre>
 +
 +
Note: in the Web/Mobile client the Page must start with a visible left sidebar ('''Show left sidebar''' attribute) to use the hideleftsidebar/showleftsidebar actions.
  
 
==Width==
 
==Width==
Line 58: Line 73:
  
  
Here, the left sidebar has been increased to 340 (pixels).
+
Here, the '''Width''' of the left sidebar has been increased to 340 (pixels).
  
 
<br clear=all>
 
<br clear=all>
Line 70: Line 85:
  
  
The '''Show left sidebar logo image''' determines whether a logo image will be displayed at the top of the left sidebar.
+
The '''Show left sidebar logo image''' attribute determines whether a logo image will be displayed at the top of the left sidebar.
 +
 
 +
Note: the display of the logo image is supported on the Desktop client only.
  
 
<br clear=all>
 
<br clear=all>
Line 82: Line 99:
  
  
By default, the logo image is the Lianja image.
+
By default, the logo image is the Lianja logo.
  
 
Specify your own image file in the '''Logo image''' attribute.
 
Specify your own image file in the '''Logo image''' attribute.
Line 96: Line 113:
  
  
The '''Show login panel''' determines whether the login panel is displayed.
+
The '''Show login panel''' attribute determines whether the login panel is displayed.
  
It shows login, role and tenancy information along with Logout and Home buttons.
+
It shows login, role and tenancy information along with 'Logout' and 'Home' buttons.
  
 
<br clear=all>
 
<br clear=all>
Line 110: Line 127:
  
  
 +
The '''Show Apps''' attribute determines whether the Apps menu is displayed.
 +
 +
This lists available Apps.
 +
 +
Clicking on an App name opens the App.
 +
 +
Note: the display of the Apps menu is supported on the Desktop client only.
  
 
<br clear=all>
 
<br clear=all>
Line 121: Line 145:
  
  
 +
The '''Show Apps Caption''' attribute determines whether the 'Apps' caption is included at the top of the Apps menu.
  
 
<br clear=all>
 
<br clear=all>
Line 127: Line 152:
 
Show the page menu in the left sidebar (True &#124; False).
 
Show the page menu in the left sidebar (True &#124; False).
  
[[{{ns:file}}:ls_show_menu.png|450px|thumb|left|link={{filepath:ls_show_menu.png}}|Page Left Sidebar Attribute: Show Menu]]
+
The '''Show Menu''' attribute determines whether the Page menu is displayed.
  
 +
This lists available Pages in the current App.
 +
 +
The '''Show navigation menu''' [[App Settings|App Setting]] must be unchecked (false) to enable the Page menu display.
 +
 +
[[{{ns:file}}:l9_ls_show_menu.png|800px|left|border|link={{filepath:l9_ls_show_menu.png}}|Page Left Sidebar Attribute: Show Menu]]
 +
<br clear=all>
  
  
 +
Note: if the '''Show navigation menu''' [[App Settings|App Setting]] is unchecked (false) and [[#Show left Sidebar|Show left Sidebar]] is checked (true), the Page menu will be displayed automatically.
  
 +
To disable both the Page menu and the Navigation menu (hamburger), check '''Show navigation menu''' (true) and check the Page [[Page Header#Hide hamburger menu|Hide hamburger menu]] attribute (true).
  
 +
[[{{ns:file}}:l9_ls_show_menu2.png|800px|left|border|link={{filepath:l9_ls_show_menu2.png}}|Page Left Sidebar Attribute: Show Menu]]
 
<br clear=all>
 
<br clear=all>
 +
 +
The display of the Pages menu is supported on the Desktop client only.
 +
 +
See also [[Page Menu]].
  
 
==Show Recent Items==
 
==Show Recent Items==
Line 143: Line 181:
  
  
 +
The '''Show Recent Items''' attribute determines whether the Recent Items panel is displayed.
 +
 +
This can include favorite (starred), recently viewed, recently modified and watched records and [[Getting Started Part 2#Instant Selections|Instant Selections]].
 +
 +
Note: a [[Instant Search#Defining the search field|Search field]] must be defined to enable the record lists.
 +
 +
The maximum number of items to display in the record lists is set in the [[#Favorite items|items attributes below]].
  
 
<br clear=all>
 
<br clear=all>
Line 149: Line 194:
 
Left sidebar background color.
 
Left sidebar background color.
  
[[{{ns:file}}:ls_background_color.png|450px|thumb|left|link={{filepath:ls_background_colors.png}}|Page Left Sidebar Attribute: Background color]]
+
[[{{ns:file}}:ls_background_color.png|450px|thumb|left|link={{filepath:ls_background_color.png}}|Page Left Sidebar Attribute: Background color]]
  
  
  
  
 +
The '''Background color''' attribute determines the left sidebar background color.
 +
 +
Note: the '''Background color''' attribute is supported on the Desktop client only.
 +
 +
See also [[Colors]] and [[CSS]].
  
 
<br clear=all>
 
<br clear=all>
Line 159: Line 209:
 
==Foreground color==
 
==Foreground color==
 
Left sidebar foreground color.
 
Left sidebar foreground color.
* Foreground colors are set internally for the Left sidebar elements.
+
* Foreground colors are set internally for the left sidebar elements.
 
+
  
 
==Border color==
 
==Border color==
 
Left sidebar border color.
 
Left sidebar border color.
  
[[{{ns:file}}:ls_border_color.png|450px|thumb|left|link={{filepath:ls_border_colors.png}}|Page Left Sidebar Attribute: Border color]]
+
[[{{ns:file}}:ls_border_color.png|450px|thumb|left|link={{filepath:ls_border_color.png}}|Page Left Sidebar Attribute: Border color]]
  
  
  
  
 +
The '''Border color''' attribute determines the left sidebar border color.
 +
 +
Note: the '''Border color''' attribute is supported on the Desktop client only.
 +
 +
See also [[Colors]] and [[CSS]].
  
 
<br clear=all>
 
<br clear=all>
 +
 +
==Header colors==
 +
A comma-separated list of colors:
 +
<pre>foreground:background:bottombordercolor</pre>
 +
 +
See the lianjademo App for an example:
 +
 +
[[{{ns:file}}:leftsidebarcolors.png|800px|border|left|link={{filepath:leftsidebarcolors.png}}|Header colors]]
 +
<br clear=all>
 +
 +
See also [[Colors]].  From v9.6.4.
  
 
==Favorite items==
 
==Favorite items==
Line 181: Line 246:
  
  
 +
If the [[#Show Recent Items|Show Recent Items]] attribute is checked (true), the '''Favorite items''' attribute determines the maximum number of favorite items to be displayed.
  
 
<br clear=all>
 
<br clear=all>
Line 192: Line 258:
  
  
 +
If the [[#Show Recent Items|Show Recent Items]] attribute is checked (true), the '''Recently viewed items''' attribute determines the maximum number of recently viewed items to be displayed.
  
 
<br clear=all>
 
<br clear=all>
Line 203: Line 270:
  
  
 +
If the [[#Show Recent Items|Show Recent Items]] attribute is checked (true), the '''Recently modified items''' attribute determines the maximum number of recently modified items to be displayed.
  
 
<br clear=all>
 
<br clear=all>
Line 208: Line 276:
 
==Watched items==
 
==Watched items==
 
The number of Watched items to display.
 
The number of Watched items to display.
 +
 +
If the [[#Show Recent Items|Show Recent Items]] attribute is checked (true), the '''Watched items''' attribute determines the maximum number of watched items to be displayed.
  
 
==Refresh interval==
 
==Refresh interval==
 
The interval in seconds that the Instant Selections content will be refreshed.
 
The interval in seconds that the Instant Selections content will be refreshed.
 
* Currently ignored.
 
* Currently ignored.
 +
  
 
[[Category:Attribute Categories]]
 
[[Category:Attribute Categories]]
 
[[Category:Pages]]
 
[[Category:Pages]]
 +
[[Category:PageAnatomy]]

Latest revision as of 11:25, 8 May 2024

See Also

App Settings, Colors, CSS, Page Attributes, Right Sidebar, Understanding Lianja UI Navigation, Users and Roles, Using the showdocument() function and Lianja.showDocument() method

Overview

Pages can optionally have a left sidebar displayed. This can include:

  • A logo image
  • A login panel displaying login, role and tenancy information with Logout and Home buttons
  • A list of Apps with clickable links to open the Apps
  • A Page navigation menu
  • Lists of favorite, recently viewed, recently modified and watched items
  • Instant Selections to filter records on pre-defined conditions

Show left sidebar

Show left sidebar (True | False).

The Show left sidebar attribute determines whether the left sidebar is shown.

Page Left Sidebar Attribute: Show left sidebar


In the App Settings, the Left sidebar visible setting in Page defaults determines whether newly created pages have a visible left sidebar or not.

Note: the left sidebar is not displayed on Mobile client phone Apps.

Collapse left sidebar

Collapse left sidebar when the App is first loaded (True | False).

Page Left Sidebar Attribute: Collapse left sidebar



Here, the Show left sidebar attribute is checked (true), but so is the Collapse left sidebar.

The left sidebar is not shown until the 'SHOW' tab is clicked.


Page Left Sidebar: Showing and hiding the left sidebar



Clicking the 'HIDE' tab will hide the left sidebar again.


Page Left Sidebar: Showing and hiding the left sidebar on the Web client



In the Web/Mobile client (browser/tablet) clicking the right border of the left sidebar allows it to be hidden or shown.

In the Web/Mobile client the Collapse left sidebar attribute is ignored, so if Show left sidebar is true, the left sidebar is displayed when the App is first loaded.


The left sidebar can also be hidden/shown using the showdocument() function or the Lianja.showDocument() method:

Lianja.showDocument("page:customers?action=hideleftsidebar")
Lianja.showDocument("page:customers?action=showleftsidebar")

Note: in the Web/Mobile client the Page must start with a visible left sidebar (Show left sidebar attribute) to use the hideleftsidebar/showleftsidebar actions.

Width

Left sidebar width.

Page Left Sidebar Attribute: Width



Here, the Width of the left sidebar has been increased to 340 (pixels).


Show left sidebar logo image

Show left sidebar logo image (True | False).

Page Left Sidebar Attribute: Show left sidebar logo image



The Show left sidebar logo image attribute determines whether a logo image will be displayed at the top of the left sidebar.

Note: the display of the logo image is supported on the Desktop client only.


Logo image

The logo displayed at the top of the left sidebar (png | jpg | gif).

Page Left Sidebar Attribute: Logo image



By default, the logo image is the Lianja logo.

Specify your own image file in the Logo image attribute.


Show login panel

Show the login panel in the left sidebar (True | False).

Page Left Sidebar Attribute: Show login panel



The Show login panel attribute determines whether the login panel is displayed.

It shows login, role and tenancy information along with 'Logout' and 'Home' buttons.


Show Apps

Show the Apps menu in the left sidebar (True | False).

Page Left Sidebar Attribute: Show Apps



The Show Apps attribute determines whether the Apps menu is displayed.

This lists available Apps.

Clicking on an App name opens the App.

Note: the display of the Apps menu is supported on the Desktop client only.


Show Apps Caption

Show the Apps caption above the Apps menu (True | False).

Page Left Sidebar Attribute: Show Apps Caption



The Show Apps Caption attribute determines whether the 'Apps' caption is included at the top of the Apps menu.


Show Menu

Show the page menu in the left sidebar (True | False).

The Show Menu attribute determines whether the Page menu is displayed.

This lists available Pages in the current App.

The Show navigation menu App Setting must be unchecked (false) to enable the Page menu display.

Page Left Sidebar Attribute: Show Menu



Note: if the Show navigation menu App Setting is unchecked (false) and Show left Sidebar is checked (true), the Page menu will be displayed automatically.

To disable both the Page menu and the Navigation menu (hamburger), check Show navigation menu (true) and check the Page Hide hamburger menu attribute (true).

Page Left Sidebar Attribute: Show Menu


The display of the Pages menu is supported on the Desktop client only.

See also Page Menu.

Show Recent Items

Show Watches, Favorites, Recently Viewed/Modified items and Instant Selections in the left sidebar (True | False).

Page Left Sidebar Attribute: Show Recent Items



The Show Recent Items attribute determines whether the Recent Items panel is displayed.

This can include favorite (starred), recently viewed, recently modified and watched records and Instant Selections.

Note: a Search field must be defined to enable the record lists.

The maximum number of items to display in the record lists is set in the items attributes below.


Background color

Left sidebar background color.

Page Left Sidebar Attribute: Background color



The Background color attribute determines the left sidebar background color.

Note: the Background color attribute is supported on the Desktop client only.

See also Colors and CSS.


Foreground color

Left sidebar foreground color.

  • Foreground colors are set internally for the left sidebar elements.

Border color

Left sidebar border color.

Page Left Sidebar Attribute: Border color



The Border color attribute determines the left sidebar border color.

Note: the Border color attribute is supported on the Desktop client only.

See also Colors and CSS.


Header colors

A comma-separated list of colors:

foreground:background:bottombordercolor

See the lianjademo App for an example:

Header colors


See also Colors. From v9.6.4.

Favorite items

The number of Favorites to display.

Page Left Sidebar Attribute: Favorite items



If the Show Recent Items attribute is checked (true), the Favorite items attribute determines the maximum number of favorite items to be displayed.


Recently viewed items

The number of Recently Viewed items to display.

Page Left Sidebar Attribute: Recently viewed items



If the Show Recent Items attribute is checked (true), the Recently viewed items attribute determines the maximum number of recently viewed items to be displayed.


Recently modified items

The number of Recently Modified items to display.

Page Left Sidebar Attribute: Recently modified items



If the Show Recent Items attribute is checked (true), the Recently modified items attribute determines the maximum number of recently modified items to be displayed.


Watched items

The number of Watched items to display.

If the Show Recent Items attribute is checked (true), the Watched items attribute determines the maximum number of watched items to be displayed.

Refresh interval

The interval in seconds that the Instant Selections content will be refreshed.

  • Currently ignored.