This procedure is intended for Page Designer administrators who need to display a selection of existing FAQ articles within a page.

The FAQ Section Component does not create FAQ articles. It retrieves existing FAQs and displays them together as a section on the page.

Administrators must therefore ensure that the required FAQ articles already exist and are available to the component before configuring the FAQ Section.

Component Objective

The FAQ Section Component allows administrators to build a section of a page containing a selection of existing FAQ articles.

The component acts as a display and collection mechanism.

It does not provide a way to create the underlying FAQs while building the section.

The correct logic is:

Create the FAQ → Make it searchable → Publish it → Retrieve it in the FAQ Section Component

Think of the structure as a set of nested building blocks. The underlying FAQ content must be ready before the higher-level FAQ Section can use it.

Content Type

The FAQ Section Component combines:

• An optional Header
• An optional Subheader
• A FAQ Collection composed of individually selected FAQ Articles

The Header and Subheader provide context for the section.

The FAQ Collection determines which existing FAQ articles are displayed.

FAQ Article Prerequisite

This is the most important requirement to understand before configuring the component.

An FAQ Article must already exist, be searchable and be published before the FAQ Section Component can retrieve it.

If a required FAQ does not yet exist, do not attempt to create it from within the FAQ Section Component.

Instead:

1. Create the FAQ Article.
2. Make the FAQ Article searchable.
3. Publish the FAQ Article.
4. Return to the page containing the FAQ Section Component.
5. Search for and select the FAQ Article from the FAQ Collection.

If these prerequisites are not completed, the FAQ will not be available for retrieval through the component.

Header and Subheader

The component provides:

• Header
• Subheader

Both use the legacy-style rich-text editing experience.

This means that administrators should not expect the advanced formatting flexibility provided by Textbox Plus.

The Header and Subheader can be used to introduce the FAQ section and provide visitors with context before they begin browsing the questions.

They are supporting elements of the FAQ Section rather than the FAQs themselves.

FAQ Collection

The FAQ Collection contains a series of FAQ Article selectors.

Each selector allows the administrator to search for and select an existing FAQ Article.

The selected FAQs are then displayed together as part of the FAQ Section.

The component therefore allows administrators to curate a selection of relevant FAQs for the particular page rather than having to reproduce the FAQ content manually.

Selected FAQ Visibility in Page Designer

Once an FAQ Article has been selected, Page Designer displays the selected FAQ title directly within its FAQ Article field.

This makes it possible to see which FAQ has already been assigned to each position.

Administrators can therefore review the collection directly in the component configuration and verify:

• Which FAQ Articles have been selected
• Which FAQ Article fields remain empty
• The sequence of the selected FAQs
• Whether an FAQ has accidentally been selected more than once

This is particularly useful when the section contains several FAQ Articles.

Placement and Compatibility

The FAQ Section Component is relatively flexible in terms of placement.

It can be used in structures such as:

• Main Region
• Boxed Layout
• Tab Wrapper
• Grid systems

There is no requirement to restrict the component to one specific layout.

However, this flexibility should be used with common sense.

The component needs enough space for visitors to comfortably read and interact with the FAQ content.

Readability and accessibility should take priority over fitting the component into a particular layout.

If a Grid or another structure constrains the FAQ Section to the point where the content becomes difficult to read or use, choose a more appropriate placement.

Versatility

The FAQ Section is versatile from a placement perspective, but its content purpose is specific.

Its role is to retrieve and display FAQ Articles.

It should therefore be treated as an FAQ-specific component rather than as a generic accordion or expandable content component.

The content displayed by the component depends on the underlying FAQ Articles selected through the FAQ Collection.

Pairing With Other Components

The FAQ Section can be considered standalone.

It already provides:

• Header
• Subheader
• FAQ Collection

It does not require another component to explain what it is or to make the selected FAQs functional.

It can nevertheless be positioned alongside other Page Designer components as part of a larger page composition.

FAQs Must Exist Before Building the Collection

Do not use the FAQ Section Component as the place where FAQ Articles are created.

The component retrieves existing FAQs.

If a new FAQ is required, create and prepare that FAQ first before returning to the FAQ Section.

FAQs Must Be Searchable

An FAQ Article must be searchable before the component can retrieve it.

If an expected FAQ cannot be found during selection, verify its status before assuming that the FAQ Section Component is malfunctioning.

FAQs Must Be Published

An FAQ Article must also be published before it can be retrieved as expected.

The complete prerequisite is therefore:

Created + Searchable + Published

Do Not Over-Constrain the Component

The FAQ Section can be placed inside Grid systems and other structures, but this does not mean every available placement will produce a good result.

If the available width becomes too constrained, the presentation can break or become difficult for visitors to use.

Prioritize:

1. Readability
2. Accessibility
3. Ease of interaction
4. Visual integration with the page

Header and Subheader Use Legacy Text Formatting

The Header and Subheader do not provide the advanced formatting freedom available in Textbox Plus.

Do not expect the same granular formatting controls when working with these fields.

Review the Selected FAQ Titles

Page Designer displays the title of each selected FAQ Article within its corresponding FAQ Article field.

Use these visible titles to review the collection before saving.

Check for missing selections, incorrect FAQs and unintended duplicates.

1. Identify the FAQs Required for the Page

Before configuring the FAQ Section, determine which FAQ Articles should appear on the page.

Consider the purpose of the page and select questions that are relevant to the visitor and the surrounding content.

2. Verify That the Required FAQ Articles Already Exist

Confirm that every FAQ you intend to use has already been created.

Remember:

The FAQ Section Component does not create FAQ Articles.

If an FAQ does not exist yet, create it before proceeding with the FAQ Section configuration.

3. Verify That Each FAQ Is Searchable

Confirm that each required FAQ Article has been made searchable.

The FAQ Section needs to be able to retrieve the article through its FAQ Article selectors.

If the article is not searchable, it will not be available as expected when building the collection.

4. Verify That Each FAQ Is Published

Confirm that each required FAQ Article is published.

The required preparation sequence is:

Create → Make searchable → Publish

Only once the underlying FAQ content is ready should you proceed with the FAQ Section.

5. Open the Required Page in Page Designer

Navigate to the Page Designer page where the FAQ Section should appear.

Select the appropriate locale before configuring the page content.

6. Choose the FAQ Section Placement

Determine where the FAQ Section should appear.

Depending on the page design, the component can be used within:

• Main Region
• Boxed Layout
• Tab Wrapper
• Grid systems

Choose the placement according to the intended page structure.

Do not choose a narrow or highly constrained placement if it compromises readability or accessibility.

7. Add the FAQ Section Component

Locate the FAQ Section Component in the Page Designer component list.

Drag and drop it into the required location.

Open the component configuration.

8. Configure the Header

Use the Header field to add a title or introduction for the FAQ Section when required.

Format the content using the available legacy rich-text controls.

Remember that this editor does not provide the same granular formatting freedom as Textbox Plus.

9. Configure the Subheader

Use the Subheader field when additional introductory or supporting information is required.

Keep the content appropriate to the role of the FAQ Section and the space available.

10. Locate the FAQ Collection

Scroll to the FAQ Collection section.

The collection contains multiple FAQ Article selectors.

Each selector represents a position within the FAQ Section.

11. Select the First FAQ Article

Click the required FAQ Article selector.

Search for the FAQ you want to display.

Select the appropriate FAQ Article from the available results.

The selected FAQ title will then be visible within the FAQ Article field.

12. Continue Populating the FAQ Collection

Continue through the available FAQ Article fields and select the FAQs required for the section.

For each selection:

1. Open the FAQ Article selector.
2. Search for the required FAQ.
3. Select the correct FAQ Article.
4. Confirm that its title appears in the field.
5. Continue to the next FAQ Article field.

Only populate the number of FAQ Article fields required for the section.

13. Review the FAQ Collection

Once the required FAQs have been selected, review the visible FAQ titles directly within the component configuration.

Confirm that:

• All required FAQs have been selected.
• The correct FAQ appears in each populated field.
• The intended sequence is correct.
• No required FAQ is missing.
• No FAQ has been selected more than once unintentionally.

If an FAQ Article field still displays Select an Option, no FAQ has been assigned to that field.

14. Correct a Selection if Required

If an incorrect FAQ has been selected, remove or replace the selection using the available FAQ Article field controls.

Confirm that the correct FAQ title is displayed afterward.

15. Review the FAQ Section in Page Designer

Review the component on the Page Designer canvas.

Confirm that the selected FAQs are being retrieved and displayed.

Also review the Header and Subheader where used.

16. Click Apply

Once the FAQ Section configuration is complete, click Apply to save the component.

Do not leave the component configuration without applying the changes.

17. Validate the FAQ Section on Staging

Validate the completed page on the appropriate staging storefront.

Confirm that:

• The FAQ Section appears in the intended location.
• The Header displays correctly where used.
• The Subheader displays correctly where used.
• The expected FAQ Articles are displayed.
• The FAQ order matches the intended sequence.
• The questions are readable.
• Visitors can comfortably interact with the FAQ content.
• The component has sufficient space within its selected layout.
• The presentation remains readable and accessible across the required responsive views.

If the component appears cramped or difficult to use because of its placement, reconsider the layout rather than forcing the FAQ Section into an overly constrained area.

If an expected FAQ cannot be retrieved, return to the underlying FAQ Article and verify the three prerequisites:

Does it exist? Is it searchable? Is it published?