This procedure is intended for Page Designer administrators who need to add standard textual content to a page using the original Textbox Component.

The Textbox Component is the legacy text component available in Page Designer.

It remains suitable for straightforward text content, but administrators should understand that its formatting capabilities are more limited than those available in Textbox Plus.

When more granular control over text formatting is required, Textbox Plus should be preferred.

Objective

The Textbox Component is designed to add textual content to a Page Designer page.

It can support standard content such as:

• Titles and headings
• Paragraphs
• Introductory text
• Supporting copy
• Explanatory content
• Quotations
• Lists
• Hyperlinks

Like Textbox Plus, the Textbox Component is highly flexible from a placement perspective because textual content can adapt to the available space.

Its main limitation is therefore not where it can be placed, but how precisely its content can be formatted.

Content Type

The Textbox Component is primarily a text component.

Its editor provides standard rich-text functionality, including formatting options such as:

• Heading and paragraph selection
• Bold
• Italic
• Underline
• Strikethrough
• Quote formatting
• Lists
• Hyperlinks
• Image insertion
• Undo
• Redo
• Clear formatting

The component also provides a full-screen editing experience for working with the content.

Placement and Compatibility

The Textbox Component is one of the more flexible Page Designer components in terms of placement.

It can be used throughout the available Page Designer structures where textual content is required.

Because text is responsive, the component does not have the same space requirements as large visual components such as Clinic Locator Map, Crossroads or Before and After Full Width.

It can therefore adapt to both large and more constrained areas.

Administrators should nevertheless consider the amount of text being placed within the available space.

A large amount of content may technically fit within a narrow area while still producing a poor content experience.

Heading and SEO Structure

The Textbox Component provides a dropdown for defining the semantic structure of the text.

Administrators can select the appropriate available options such as:

• Normal
• Heading 1
• Heading 2
• Heading 3
• Heading 4

The heading selection contributes to the structure and SEO hierarchy of the content.

However, unlike Textbox Plus, the visual size associated with each heading cannot be independently overridden from within the component.

For example:

If Heading 1 has been assigned a particular font size within the website design, selecting Heading 1 will use that predefined presentation.

The administrator cannot select Heading 1 for its semantic value and then independently choose a smaller or larger font size.

This is one of the major differences between Textbox and Textbox Plus.

Standard Text Formatting

The Textbox Component provides standard formatting controls for individual text selections.

Depending on the content, administrators can apply treatments such as:

• Bold
• Italic
• Underline
• Strikethrough
• Quote

These controls allow basic emphasis and text hierarchy to be created without requiring another component.

Alignment

Text alignment is handled differently from Textbox Plus.

In the original Textbox Component, alignment is configured through a separate Alignment setting outside the rich-text Content field.

The available alignment options are:

• Left
• Center
• Right

The selected alignment applies to the entire content of the Textbox Component.

For example, if Center is selected, the complete content block is center aligned.

You cannot use the legacy Textbox Component to make:

• One sentence left aligned
• Another paragraph center aligned
• Another section right aligned

within the same Textbox Component.

If different sections require different alignments, Textbox Plus provides the more appropriate level of formatting control.

Lists and Links

The Textbox Component provides controls for creating lists within the content.

Hyperlinks can also be added to relevant text.

This makes the component suitable for standard text sections containing embedded navigation without requiring a separate CTA for every link.

Formatting History

The editor provides Undo and Redo controls.

Use these controls to move backward or forward through recent editing actions while working on the content.

Clear Formatting

The editor provides a Clear Formatting option.

Use it when formatting applied to selected content needs to be removed.

This can be particularly useful when content contains unwanted formatting and needs to be returned to a cleaner state before being formatted again.

Versatility and Typical Uses

Standard Text Content

The Textbox Component remains suitable for straightforward textual content where advanced formatting is unnecessary.

Typical uses include:

• Standard paragraphs
• Simple introductions
• Explanatory copy
• Headings followed by text
• Lists
• Quotations
• Text containing hyperlinks

Simple, Consistent Alignment

The component is also appropriate when the complete content block should use the same alignment.

For example, if an entire text section should be centered, the component-level Alignment setting can handle that requirement without requiring Textbox Plus.

Simple Heading Hierarchy

Use the Textbox Component when the predefined visual treatment associated with the selected heading levels already meets the page requirements.

If no visual override is required, the legacy heading behavior may be sufficient.

Textbox Component vs. Textbox Plus

Understanding the difference between these two components is important when deciding which one to use.

Capability	Textbox Component	Textbox Plus
Standard text formatting	Yes	Yes
SEO / semantic heading selection	Yes	Yes
Independently control heading font size	No	Yes
Alignment	Entire content block	More granular within the content
Bold / Italic / Underline	Yes	Yes
Strikethrough	Yes	Yes
Quote formatting	Yes	Yes
Superscript / Subscript	More limited / workaround required	Dedicated formatting capability
Text color control	Limited legacy capabilities	Predefined text colors available
Background color control	Limited legacy capabilities	Predefined background colors available
Hyperlinks	Yes	Yes
Undo / Redo	Yes	Yes
Clear formatting	Yes	Yes
Overall formatting flexibility	Standard / Legacy	Advanced

The key principle is:

Use the Textbox Component when straightforward text formatting is sufficient. Use Textbox Plus when more granular control over the presentation of the text is required.

Important Context: Textbox Plus Is Unique

Textbox Plus is currently the only text element in Page Designer that provides its enhanced level of formatting freedom.

This distinction does not apply only when comparing Textbox with Textbox Plus.

Text fields embedded within other Page Designer components do not automatically inherit the Textbox Plus editing capabilities.

For example, when another component contains a:

• Header
• Description
• Text field
• Supporting copy

the available text formatting will generally follow the more constrained legacy approach rather than providing the full Textbox Plus editing experience.

Administrators should therefore not assume:

"If Textbox Plus lets me format text this way, every component containing text will let me do the same."

That is currently not the case.

Textbox Plus should be treated as the dedicated option when the page requires this enhanced level of text-formatting freedom.

Pairing With Other Components

The Textbox Component can be used both standalone and alongside other Page Designer components.

It can provide supporting context before or after:

• Images
• Videos
• Banners
• Navigational components
• Other visual content

There is no required pairing.

Because text is such a general-purpose content type, the appropriate relationship depends entirely on the page being created.

Heading Size Cannot Be Independently Overridden

Selecting a heading level uses the predefined visual presentation associated with that heading.

For example, selecting Heading 1 uses the font size assigned to Heading 1.

The Textbox Component does not provide a separate font-size control allowing administrators to override that presentation.

Use Textbox Plus when the semantic heading level and visual font size need to be controlled independently.

Alignment Applies to the Entire Component

The separate Alignment setting applies to the entire Textbox content.

You cannot independently align different sentences or paragraphs within the same component.

If different parts of the same text require different alignment, use Textbox Plus.

Do Not Expect Textbox Plus Formatting in Other Components

Textbox Plus is currently unique.

Text fields contained inside banners, media components and other Page Designer components should not be assumed to provide the same formatting flexibility.

The richer Textbox Plus editing capabilities have not been applied across every Page Designer component.

Consider Textbox Plus for Advanced Requirements

If the content requires granular formatting control, do not try to force the legacy Textbox Component to reproduce functionality that Textbox Plus was specifically introduced to provide.

Use the component that best matches the formatting requirement.

Responsive Does Not Mean Unlimited Content

The Textbox Component can adapt to different widths, but the amount of content still needs to remain appropriate for the available space.

Avoid placing excessive copy into very narrow areas simply because the component technically fits there.

Apply Is Critical

When using the full-screen content editor, saving requires two separate Apply actions:

1. Apply inside the full-screen editor
2. Apply at component level

The first Apply exits/confirms the full-screen editing experience.

The second Apply saves the Textbox Component.

Do not stop after the first Apply.

1. Determine Whether Textbox Is the Appropriate Text Component

Before adding the component, consider the formatting required by the content.

Use the original Textbox Component when standard text formatting is sufficient.

Consider Textbox Plus instead when you need capabilities such as:

• Independent control of semantic heading level and visual font size
• More granular alignment within the same content
• Dedicated superscript or subscript formatting
• Greater control over text presentation
• Predefined text or background color options

If none of these enhanced capabilities are required, the standard Textbox Component may be sufficient.

2. Choose the Placement

Determine where the text should appear within the page.

Because the component is responsive, it can be used throughout the available Page Designer structures where text content is appropriate.

Consider the available width and amount of copy when selecting the placement.

3. Add the Textbox Component

Locate the Textbox Component in the Page Designer component list.

Drag and drop it into the desired area.

4. Open the Content Field

Open the required content field.

Enter the textual content or open the full-screen editor when additional editing space is required.

5. Structure the Content

Enter and organize the required copy.

Depending on the requirement, the content may contain:

• Headings
• Paragraphs
• Lists
• Quotations
• Hyperlinks

6. Select the Appropriate Heading Level

Use the heading dropdown to select the appropriate semantic level.

Choose from the available heading options according to the structure of the content.

Remember:

The selected heading uses its predefined visual size.

There is no separate font-size control within the legacy Textbox Component.

If the heading level is semantically correct but its predefined visual size does not work for the page design, consider using Textbox Plus.

7. Apply Standard Formatting

Use the available formatting controls as required.

These include treatments such as:

• Bold
• Italic
• Underline
• Strikethrough
• Quote

Apply these options to the relevant text according to the content requirements.

8. Configure Lists if Required

Use the available list controls when the content needs to be presented as a list.

Review the resulting structure to ensure that the content remains easy to read.

9. Add Hyperlinks if Required

Select the appropriate text and use the hyperlink functionality to add the required destination.

Confirm that the correct text has been linked.

10. Use Undo, Redo or Clear Formatting When Required

Use Undo or Redo to navigate recent editing actions.

Use Clear Formatting when unwanted formatting needs to be removed from selected content.

11. Configure the Alignment

Outside the Content field, locate the Alignment setting.

Choose:

• Left
• Center
• Right

Remember that the selected option applies to the entire content of the component.

If different sections require different alignments, consider using Textbox Plus instead.

12. Review the Complete Content

Before saving, confirm that:

• The copy is correct.
• The appropriate heading levels have been selected.
• The predefined heading sizes work with the page design.
• Bold, italic, underline, strikethrough and quote formatting are correct where used.
• Lists display correctly.
• Hyperlinks are correct.
• The selected Alignment works for the entire component.
• The amount of content is appropriate for the available space.

13. Apply Changes From the Full-Screen Editor

If you are working in the full-screen editor, click Apply when the content is complete.

This first Apply confirms the content and closes the full-screen editor.

You will then return to the Textbox Component configuration.

14. Apply the Textbox Component

Click Apply again at component level.

This second Apply saves the Textbox Component.

When using full-screen editing, remember:

Edit content → Apply → return to component → Apply again

If you did not use the full-screen editor, only the component-level Apply is required.

15. Validate the Textbox on Staging

Validate the completed page on the appropriate staging storefront.

Confirm that:

• Text displays correctly.
• Heading hierarchy is appropriate.
• Predefined heading sizes work with the design.
• Standard formatting displays correctly.
• Lists display correctly.
• Alignment applies correctly to the entire block.
• Hyperlinks work correctly.
• The text remains readable within the selected layout.
• The component responds appropriately across the required screen sizes.

If the content is structurally correct but the legacy formatting controls prevent you from achieving the required presentation, do not attempt to force the Textbox Component beyond its intended capabilities. Consider replacing it with Textbox Plus.