Skip to content

Latest commit

 

History

History
54 lines (35 loc) · 2.18 KB

customize-your-portal.md

File metadata and controls

54 lines (35 loc) · 2.18 KB
description
In this section you will learn how to customize your customer portal

Customize your Portal

In Jet Admin, you can customize the appearance of your Portal for better usability. Let's start with the Units table.

Let's disable unnecessary columns and rearrange the order.

  1. Click on the Units Table
  2. Disable the unnecessary columns

{% @arcade/embed flowId="LYaHo5hSztGepkgqLi60" url="https://app.arcade.software/share/LYaHo5hSztGepkgqLi60" %}

{% hint style="info" %} In Airtable, field types are detected automatically, but for other data sources you might need to configure them by clicking on the column icon {% endhint %}

Let's now set the number of displayed rows to 5, and make the first row selected by default. To do that, follow the steps:

  1. Go to the Display Tab
  2. Set 5 in the Rows Per Table section
  3. Enable the Select First Row By Default option

{% @arcade/embed flowId="2mIZsLJCVfTuoCwaQcKw" url="https://app.arcade.software/share/2mIZsLJCVfTuoCwaQcKw" %}

You can change the field types to render different fields differently and customize their appearance. To do so,

  1. Click on the Priority field
  2. Choose Low Option
  3. Click on the Color field
  4. Choose the Color

{% @arcade/embed flowId="O0wzcnLu1EGHcL2st20X" url="https://app.arcade.software/share/O0wzcnLu1EGHcL2st20X" %}

In Jet Admin, you can configure and customize any component individually on any page. Let's make our record fields non-editable so that the users will be able to change them.

  1. Click on the Unit ID field
  2. From the menu on the right, change it to Editable
  3. Click on the Assign To ID field
  4. From the menu on the right, change it to View-Only

{% @arcade/embed flowId="tgWMjNELHaMSoJv0JBGc" url="https://app.arcade.software/share/tgWMjNELHaMSoJv0JBGc" %}

Applying similar edits to the Tasks table and we're done with the UI customization.

Now, let's invite external users and make them interact only with their data:

{% content-ref url="invite-users.md" %} invite-users.md {% endcontent-ref %}