Documentation AEM as a Cloud Service User Guide

List forms on the Sites page

Last update: Thu Sep 05 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

CREATED FOR:

User
Developer

Imagine a user visiting the bank’s website in search of an account opening form. The bank uses the Forms Portal component to help users quickly find the form by entering specific keywords or filtering by categories such as ‘New Accounts’ or ‘Personal Banking’ and allows users to easily locate the desired form without having to scroll through lengthy lists.

The Search & Lister component of the Forms Portal allows you to display and list forms on a Sites page. Users can configure and present a comprehensive list of forms based on specific criteria to meet organizational requirements. Anonymous users can visit the Sites page to view and browse the available forms. The listed forms can be sorted in ascending or descending order using the Sort By drop-down option located in the upper-right corner of the screen.

Search and Lister icon

Pre-requisite

Before exploring the various capabilities of a Forms Portal component, ensure that Core Components are enabled for your environment. For detailed instructions on how to enable Core Components for your environment, click here.

After deploying the latest Core Components to your environment, the Forms Portal components become accessible in your authoring environment.

List forms on the Sites Page

To add the Search & Lister portal component to your Sites page, perform the following steps:

Open the AEM Sites page in an Edit mode.
Go to the Page Information > Edit Template
Click the Policy and select the Search & Lister checkbox under the [AEM Archetype Project Name] - Forms and Communications Portal.
Click Done.
Now, re-open the AEM Sites page in the authoring mode.
Locate the section within the page editor that allows you to add the Forms Portal component.

Click the Add icon. The icon is a plus sign (+) that signifies the option to add new components.

Clicking the Add icon displays an Insert New Component dialog box that displays various components for insertion.

note note
NOTE
Alternatively, you can also drag and drop the component.

Browse the available components in the dialog box and select the desired component from the list. For example, select the Search and Lister component from the list to add the Search & Lister Forms Portal component.

Now, configure the properties of the Search and Lister component.

Understand the properties of the Search and Lister component

You can easily customize Search and Lister component properties using the Configure Dialog for a seamless user experience. To configure, select the component and then select the . The Search and Lister dialog opens.

Display tab

Display Tab

In Title, specify the title for the Search & Lister component. An indicative title enables the users to perform a quick search across the list of forms.
From the Layout list, select the layout to represent the forms in the card or list format.
Select Hide Search and Hide Sorting to hide the search and sort by features.
In Tooltip, provide the tooltip that appears when you hover over the component.

Asset tab

In the Asset Folder tab, specify the location from where the forms are pulled and listed on the page.
Using the Add another location, you can configure multiple folder locations.

Results tab

Display Tab

In the Results tab, configure the maximum number of forms to display per page. The default is eight forms per page.

View forms on the Sites page using the Search & Lister component

To view the list of forms, use the Search & Lister Forms Portal component. Preview the AEM Sites page to see the list of forms from the Assets folder displayed on the screen. You can also search for a specific form using the search bar.