This procedure is intended for Page Designer administrators who need to create and format textual content within a page.

Textbox Plus is the more flexible text-authoring option available in Page Designer and is particularly useful when the administrator requires formatting capabilities that are not available or are more restrictive in the legacy Textbox component.

Objective

The Textbox Plus component is designed to provide administrators with a flexible rich-text editing experience directly within Page Designer.

Text components are among the most versatile Page Designer components because text naturally adapts to the space available.

Unlike large visual components that require specific widths or can break when placed inside constrained layouts, Textbox Plus can be used across a wide variety of page structures.

Its purpose is not limited to one particular type of text.

Depending on the page requirements, Textbox Plus can support:

• Titles and headings
• Introductory text
• Paragraphs
• Editorial content
• Supporting copy
• Explanatory information
• Links within text
• Text requiring specific formatting
• Content requiring superscript or subscript
• Quotations
• Text sections requiring their own background treatment

Why Use Textbox Plus?

Textbox Plus was introduced to provide greater flexibility than the legacy text component.

The legacy component can be restrictive when more advanced formatting is required.

Textbox Plus removes some of that friction by providing a richer editing experience that is closer to the type of formatting tools administrators may already know from word-processing applications.

It should therefore be considered a highly versatile option when an administrator needs more control over the presentation and structure of textual content.

Content Type

Textbox Plus is a text-focused component.

Its primary purpose is the creation and formatting of textual content rather than the presentation of imagery or video.

The content is managed through the Edit content rich-text editor.

Placement and Compatibility

Textbox Plus is one of the most flexible components when it comes to placement.

It can be used wherever text content is required within the available Page Designer structures.

Unlike components that require large amounts of horizontal space, Textbox Plus does not need to be restricted to the Main Region or Boxed Layout.

Because text responds naturally to the available width, the component can adapt to larger and smaller content areas.

This makes it particularly useful when working with:

• Main Region
• Boxed Layout
• Grid structures
• More constrained content areas
• Other available Page Designer structures where text is required

The amount and structure of the text should nevertheless remain appropriate for the space available.

A component being technically responsive does not mean that a very large amount of content will automatically create a good experience inside a very small area.

Rich-Text Formatting Capabilities

Textbox Plus provides a broad selection of familiar text-formatting options.

These include standard formatting capabilities such as:

• Bold
• Italic
• Underline
• Strikethrough

Additional formatting capabilities include:

• Quote formatting
• Subscript
• Superscript

Superscript and subscript are particularly useful when content requires typographic treatments that are difficult to reproduce using the legacy text component.

Textbox Plus also provides standard text alignment controls comparable to those available in conventional word-processing applications.

These include alignment options such as:

• Left
• Center
• Right
• Other available standard alignment treatments

SEO Heading Control

The first formatting dropdown displayed as Normal by default controls the semantic structure of the text.

This allows the administrator to select heading levels such as:

• Normal text
• Heading 1
• Heading 2
• Additional available heading levels

This control is important for SEO and content structure.

The heading level determines the semantic role of the text rather than simply its visual size.

Font Size Control

The second dropdown displayed as Normal controls the font size.

This control is separate from the SEO heading selection.

This separation provides additional flexibility.

For example, an administrator can select an appropriate heading level for SEO and content structure, while independently adjusting how large that heading appears visually.

This means that a heading can retain its appropriate semantic role without necessarily having to use the default visual size associated with that heading.

Conversely, the administrator can increase the visual size when the default presentation is not sufficient for the intended design.

The two controls should therefore be understood separately:

First dropdown = SEO / semantic heading level

Second dropdown = visual font size

Text Color

Textbox Plus allows administrators to change the text color.

The available colors are selected from a predefined set of colors.

Administrators cannot freely select any arbitrary color.

The available color choices are therefore controlled by the options provided within the component.

Background Color

Textbox Plus also provides control over the background color of the text area.

As with text color, the administrator selects from a predefined set of available colors.

This can be used when a text section needs additional visual distinction from the surrounding page.

Hyperlinks

Textbox Plus supports hyperlinks within the content.

This allows administrators to turn relevant text into clickable links without requiring a separate CTA component.

Use hyperlinks when navigation needs to be incorporated naturally within the textual content.

Formatting History

The editor provides controls allowing the administrator to move backward and forward through recent modifications.

This allows changes to be undone and redone while working within the editor.

It is particularly useful when experimenting with formatting or when an accidental change needs to be reversed.

Clear Formatting

Textbox Plus provides a Clear Formatting capability.

Use this when existing formatting needs to be removed from selected content.

This is particularly useful when text has accumulated unwanted formatting or when the administrator wants to return content to a cleaner formatting state before applying the required Page Designer styling.

Versatility and Typical Uses

Textbox Plus should be considered a highly versatile component.

Unlike specialized components such as Crossroads, Clinic Locator Banner or Before and After, it is not tied to a single business purpose or visitor journey.

Its use depends primarily on the type of textual content required by the page.

Standard Text Content

Use Textbox Plus for conventional page copy such as:

• Introductions
• Descriptions
• Explanatory sections
• Editorial copy
• Supporting information

Structured Content

Use the heading controls when the text needs a clear hierarchy.

For example, a Textbox Plus can contain headings and supporting paragraphs while maintaining the appropriate semantic structure.

Specialized Formatting

Textbox Plus is particularly valuable when the content requires:

• Superscript
• Subscript
• Quotations
• Strikethrough
• Specific alignment
• Specific text colors
• Specific background colors

Text With Integrated Links

Use Textbox Plus when links need to appear naturally within the body copy rather than as separate CTA components.

Pairing With Other Components

Textbox Plus can be considered both standalone and highly compatible with other components.

It can function independently when the page simply requires text.

It can also provide context for other Page Designer components.

For example, an administrator may use Textbox Plus before or after a visual component when additional explanation is required.

Because its purpose is general text authoring, there is no single required or preferred pairing.

Text and Background Colors Are Predefined

Administrators can change the text and background colors, but only using the available predefined color options.

Do not expect Textbox Plus to provide unrestricted color selection.

SEO Heading and Font Size Are Separate Controls

Do not confuse the two Normal dropdowns.

The first controls the semantic heading level used for content structure and SEO.

The second controls the visual font size.

Changing the visual size does not replace the need to select the appropriate semantic heading level.

Use Heading Levels According to Content Structure

The ability to visually resize headings should not be used as a reason to select an inappropriate heading level.

Choose the heading level according to the structure and meaning of the content, then use the font-size control when the visual presentation needs adjustment.

Responsive Does Not Mean Unlimited Content

Textbox Plus can adapt to constrained spaces more easily than large visual components.

However, administrators should still consider the amount of text being placed within the available space.

A long block of copy may technically fit inside a narrow Grid area while still creating a poor content experience.

Apply Is Critical

Changes are not complete until the component itself has been saved using Apply.

The saving workflow is particularly important when using the full-screen Edit content experience.

If you are editing the content in full screen:

1. Click Apply inside the full-screen editor to close/confirm the editor.
2. Click Apply again in the component configuration to save the Textbox Plus component.

Two Apply actions are therefore required when working from the full-screen editor.

Do not assume that the first Apply has saved the complete component.

1. Determine Where the Text Is Required

Identify where the textual content should appear within the page.

Textbox Plus is highly flexible and can be used throughout the available Page Designer structures.

Choose the placement according to the overall page design and the role of the content.

2. Add the Textbox Plus Component

Locate Textbox Plus in the Page Designer component list.

Drag and drop it into the desired area of the page.

Because the component is responsive, it can be used in both large and more constrained areas.

3. Open the Content Editor

Open the Content field.

Access the Edit content rich-text editor.

Use this editor to enter and format the required text.

4. Enter the Content

Type or add the required textual content.

Structure the content according to its purpose.

Depending on the requirement, this may include:

• A heading
• Supporting paragraphs
• Several sections
• Links
• Quotations
• Specialized formatted text

5. Apply Standard Text Formatting

Use the available formatting controls when required.

These include:

• Bold
• Italic
• Underline
• Strikethrough

Apply formatting only where it contributes to the hierarchy or readability of the content.

6. Use Advanced Formatting When Required

Textbox Plus provides additional options such as:

• Quote formatting
• Subscript
• Superscript

Use these tools when the content requires them.

For example, superscript or subscript can be used where specific terminology or notation requires that typographic treatment.

7. Configure Text Alignment

Choose the appropriate text alignment using the available alignment controls.

Depending on the intended design, text can use the available standard alignment options such as:

• Left
• Center
• Right

Choose the alignment according to the page design and the content being presented.

8. Define the SEO Heading Level

Use the first dropdown displayed as Normal to determine the semantic structure of the content.

Select the appropriate option, such as:

• Normal
• Heading 1
• Heading 2
• Another available heading level

Choose the heading according to the role of the text within the page structure.

9. Adjust the Visual Font Size if Required

Use the second dropdown displayed as Normal to control the visual font size.

This allows the visual presentation to be adjusted independently from the semantic heading level.

For example, if the appropriate SEO structure requires a heading but the default visual size is too large for the design, retain the correct heading level and reduce its visual size using this second control.

Likewise, increase the visual size when the selected text needs greater visual prominence.

10. Configure the Text Color if Required

Use the text-color control when the content requires a different text color.

Select from the predefined colors available within the editor.

Remember that arbitrary custom colors cannot be selected through this control.

11. Configure the Background Color if Required

If the text section requires a background treatment, select an appropriate background color.

Choose from the predefined background colors available within Textbox Plus.

Review the combination of text and background colors to ensure sufficient readability.

12. Add Hyperlinks if Required

Select the relevant text and use the hyperlink functionality when part of the content needs to lead to another destination.

Check that the correct text has been linked and that the destination is appropriate.

13. Undo or Redo Changes When Required

Use the available history controls to move backward or forward through recent modifications.

This can be useful when:

• Formatting was applied accidentally
• Content was removed unintentionally
• You want to compare the current formatting with a previous version

14. Clear Unwanted Formatting When Required

Use Clear Formatting when selected content contains formatting that should be removed.

After clearing the formatting, reapply only the formatting required for the final presentation.

15. Review the Content

Before leaving the editor, review the complete text.

Confirm that:

• The copy is correct.
• Heading levels are appropriate.
• Font sizes are appropriate.
• Bold, italic, underline or strikethrough formatting is correct.
• Superscript or subscript is correct where used.
• Alignment is appropriate.
• Text colors are correct.
• Background colors are correct.
• Hyperlinks have been added where required.
• The content remains readable within the available space.

16. Apply Changes From the Full-Screen Editor

If you are working inside the full-screen Edit content editor, click Apply.

This first Apply confirms the content and closes the full-screen editing window. It does not complete the component-saving process.

You will return to the Textbox Plus component configuration.

17. Apply the Textbox Plus Component

Once you are back in the component configuration, click Apply again.

This second Apply saves the Textbox Plus component.

When using the full-screen editor, remember the complete sequence:

Edit content → Apply → return to component → Apply again

This step is critical. Do not stop after the first Apply.

If the full-screen editor was not used, only the component-level Apply is required.

18. Validate the Textbox Plus Content on Staging

Validate the completed page on the appropriate staging storefront.

Confirm that:

• The text displays correctly.
• Heading hierarchy is appropriate.
• The visual font sizes match the intended design.
• Formatting displays correctly.
• Superscript and subscript display correctly where used.
• Alignment behaves correctly.
• Text and background colors display as expected.
• Hyperlinks work correctly.
• The component adapts correctly to the space where it has been placed.
• The content remains readable across the required responsive views.

If the text technically fits but feels crowded within the selected area, reconsider the amount of content, formatting or placement rather than assuming that responsiveness alone guarantees an effective layout.