# Overview Components

## Overview

This section includes the absolute minimums of the web portal. You can start by navigating to your organization's URL which will be given to you by your system administrator or Intellasoft representative. Afterwards you will see a login screen. Start by following the instructions below to get familiar with the platform.

<div class="columnLayout single" data-layout="single" id="bkmrk-overview-logging-in-"><div class="cell normal" data-type="normal"><div class="innerCell"><div class="panel conf-macro output-block" data-hasbody="true" data-macro-name="panel"><div class="panelContent"><div class="columnMacro conf-macro output-block" data-hasbody="true" data-macro-name="column"><div class="toc-macro client-side-toc-macro conf-macro output-block hidden-outline" data-hasbody="false" data-headerelements="H1,H2,H3,H4,H5,H6,H7" data-macro-name="toc">- <span class="toc-item-body" data-outline="2">[Logging In](#bkmrk-logging-in)</span>
- <span class="toc-item-body" data-outline="3">[Top Level Interface Components](#bkmrk-top-level-interface-)</span>
- <span class="toc-item-body" data-outline="4">[My Account](#bkmrk-my-account)</span>
- <span class="toc-item-body" data-outline="5">[Logout](#bkmrk-logout)</span>
- <span class="toc-item-body" data-outline="6">[Navigation](#bkmrk-navigation)</span>
- <span class="toc-item-body" data-outline="7">[Screen Content Area](#bkmrk-screen-content-area)</span>
- <span class="toc-item-body" data-outline="8">[Screens](#bkmrk-screens)</span>
- <span class="toc-item-body" data-outline="9">[Panel Sizer Bar](#bkmrk-panel-sizer-bar)</span>
- <span class="toc-item-body" data-outline="10">[Panel Tools](#bkmrk-panel-tools)</span>
- <span class="toc-item-body" data-outline="11">[Group Selection](#bkmrk-group-selection)</span>

</div></div></div></div></div></div></div>## Logging In

<div class="columnLayout single" data-layout="single" id="bkmrk-you-will-need-the-pr"><div class="cell normal" data-type="normal"><div class="innerCell"><div class="panel conf-macro output-block" data-hasbody="true" data-macro-name="panel"><div class="panelContent"><div class="clearfix"><div class="section-img">![](https://doc.intellasoft.net/download/attachments/8030127/image2017-7-14_7-22-36.png)</div><div class="section-img">You will need the proper URL address for your organization as well as your username and password which can be requested from your system administrator. Once you navigate to the portal, input your credentials as shown above. If you are unable to login after a few attempts, please contact your system administrator for assistance.</div></div></div></div></div></div></div>## Top Level Interface Components

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/tKmimage.png)](#bkmrk-my-account)

<table border="1" id="bkmrk--1" style="border-collapse: collapse; width: 87.5309%; border-width: 1px; border-color: rgb(255, 255, 255);"><colgroup><col style="width: 32.2036%;"></col><col style="width: 67.7964%;"></col></colgroup><tbody><tr><td style="border-color: rgb(255, 255, 255);">[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/dlTimage.png)](#bkmrk-navigation)</td><td style="border-color: rgb(255, 255, 255);">[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/fAOimage.png)](#bkmrk-screen-content-area)</td></tr></tbody></table>

<div class="columnLayout single" data-layout="single" id="bkmrk-component-descriptio"><div class="cell normal" data-type="normal"><div class="innerCell"><div class="panel conf-macro output-block" data-hasbody="true" data-macro-name="panel"><div class="panelContent"><div class="conf-macro output-block" data-hasbody="true" data-macro-name="div" id="bkmrk-component-descriptio-1"><div class="conf-macro output-block" data-hasbody="true" data-macro-name="div"><div class="clearfix" id="bkmrk--5"><div class="portal" id="bkmrk--8"><span class="overlay-part" id="bkmrk--9"></span></div></div></div><div class="conf-macro output-block" data-hasbody="true" data-macro-name="div"><div class="table-wrap"><table border="1" class="wrapped confluenceTable tablesorter tablesorter-default" role="grid" style="width: 100%; border-collapse: collapse; border-style: solid;"><thead aria-label="Use column header buttons to sort"><tr class="tablesorter-headerRow" role="row"><th aria-disabled="false" class="confluenceTh tablesorter-header sortableHeader tablesorter-headerUnSorted" data-column="0" role="columnheader" scope="col" style="width: 12.7309%;"><div class="tablesorter-header-inner"><button class="headerButton">Component</button></div></th><th aria-disabled="false" class="confluenceTh tablesorter-header sortableHeader tablesorter-headerUnSorted" colspan="1" data-column="1" role="columnheader" scope="col" style="width: 87.3928%;"><div class="tablesorter-header-inner"><button class="headerButton">Description</button></div></th></tr></thead><tbody><tr role="row"><td class="confluenceTd" style="width: 12.7309%;">Top bar</td><td class="confluenceTd" colspan="1" style="width: 87.3928%;">The account management bar along the top of the window is used to change your password or logout.</td></tr><tr role="row"><td class="confluenceTd" style="width: 12.7309%;">Left panel</td><td class="confluenceTd" colspan="1" style="width: 87.3928%;">The navigation panel at the left of the screen is for navigating to different screens within the web portal.</td></tr><tr role="row"><td class="confluenceTd" style="width: 12.7309%;">Right panel</td><td class="confluenceTd" colspan="1" style="width: 87.3928%;">The content area, filling the majority of the window, will display information and tools based on the selected screen.</td></tr></tbody></table>

</div></div></div></div></div></div></div></div>## My Account<span class="confluence-anchor-link conf-macro output-inline" data-hasbody="false" data-macro-name="anchor" id="bkmrk--10"></span>

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/xfUimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/xfUimage.png)

To change the account password, click on the **My Account** menu located at the top left corner. Next click the **Change password for my account: &lt;username&gt;** button.

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/Ru0image.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/Ru0image.png)

Within the popup, enter your **Current Portal Password** and **New Portal Password**. Click **Save** and there will be a confirmation of **Success - Saved password** or **Invalid current password** if the current portal password is incorrect. Click **OK** to continue.

## Logout

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/r7Pimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/r7Pimage.png)

Closing the browser is not enough to be logged out since the Intellasoft Web Portal uses cookies. Remaining idle for an extended period of time may not do the trick either, depending on the specific timeout settings. The best way to logout is to use the **Logout** button in the upper right-hand corner.

## Navigation<span class="confluence-anchor-link conf-macro output-inline" data-hasbody="false" data-macro-name="anchor" id="bkmrk--17"></span>

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/U0nimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/U0nimage.png)

The red box panel on the left is the **Navigation**. From here you are able to select the various **Screens** (also called **Modules**) within the IntellaSoft platform. To select a specific **Screen,** click on the name you want to access. The subtle difference between **Screen** and **Module** is that the screen is the visual component of the exact module on the server. Note that a module may provide features across multiple screens. Anytime the documentation refers to navigating to a **screen** or **module** refer to the navigation panel and click the screens' respective name. You will see it highlighted in blue indicating which **screen** you are currently in.

## Screen Content Area<span class="confluence-anchor-link conf-macro output-inline" data-hasbody="false" data-macro-name="anchor" id="bkmrk--20"></span>

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/Lfbimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/Lfbimage.png)<span class="confluence-embedded-file-wrapper">![](https://public.intellasoft.net/download/attachments/8030127/Screen%20Content%20Area.png?version=1&modificationDate=1504285107037&api=v2)</span>

The red box panel on the right is the **Screen Content Area** which is a **Tab Panel**. The title of the **Screen** will be in the tab name.

## Screens

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/4Odimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/4Odimage.png)

In this example, we have selected the **Users** **Screen**. Notice that **Users** is highlighted within the **Navigation Panel.** The **Screen Content Area** now contains the specific **Panels** for the screen. In this case, the four smaller **Panels** are all **Grid Panels**.

## Panel Sizer Bar

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/AWuimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/AWuimage.png)

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/mkDimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/mkDimage.png)

You have the option to resize individual panels within each screen. To do this simply click on the in-between space between panels and drag in the direction to want to resize. Afterwards the panel will be extended right, the opposite works when trying to resize panels to a smaller amount. You can also do this to the height of panels as well.

<span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://public.intellasoft.net/download/attachments/8030127/image2017-7-10_13-14-22.png?version=1&modificationDate=1500384642938&api=v2)</span>

<span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://public.intellasoft.net/download/attachments/8030127/image2017-7-10_13-17-30.png?version=1&modificationDate=1500384642966&api=v2)</span>

# Panel Tools

<span class="confluence-embedded-file-wrapper">![](https://public.intellasoft.net/download/attachments/8030127/image2017-7-12_9-25-19.png?version=1&modificationDate=1500384650879&api=v2)</span>

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/IFjimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/IFjimage.png)

Currently, there are not very many **Panel** **Tools** implemented, but an example of a **Panel Tool** is the option to collapse or expand panels, to provide a better view of other **Panels.** See the example above.

# Group Selection

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/2D3image.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/2D3image.png)

When using some screens such as **DayNight Schedule** or even Voicemail it is important to note that you have chosen the correct group to modify. This can be done with the **Select XXXX (***XXXX* will depend on the exact screen you are in) function which is located at the top left-hand of the screen.

If you are selecting this screen for the first time since logging in, you will also see a brief message such as the one below indicating that it has auto-selected the 1st group that would be included in the drop-down menu for **Select XXXX.** This is simply to bring attention to the fact that you may have to change the group to modify the one in question.

[![image.png](https://public.intellasoft.net/uploads/images/gallery/2024-07/scaled-1680-/M9wimage.png)](https://public.intellasoft.net/uploads/images/gallery/2024-07/M9wimage.png)

<span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">  
</span>