Why use Adaptive Forms Core Components to create an Adaptive Form in AEM Sites page or Experience Fragment?

If you have created Adaptive Forms Foundation Component or plain HTML based forms for your Sites in the past, Adobe recommends that you use Adaptive Forms Core Components to create an Adaptive Form in AEM Sites page or Expereince Fragment. It lets you use various features of AEM Sites pages like, versioning, targeting, translation, and multi-site manager, enhancing the overall form creation and management experience for Adaptive Forms. Let’s explore some of these features:

  • Versioning: AEM Sites pages offer robust versioning capabilities, allowing you to track and manage different versions of your forms. This enables you to make changes and enhancements to forms while maintaining the ability to roll back to previous versions if needed. Versioning ensures a controlled and organized approach to form development and evolution.
  • Targeting (Integration with Adobe Target): With AEM Sites pages targeting capabilities, you can also personalize the form experience for different audiences. By using user segments and targeting criteria, you can tailor the form’s content, design, or behavior to specific groups of users. This enables you to provide a personalized and relevant form experience, increasing engagement and conversion rates.
  • Translation: AEM Sites seamless integration with translation services, allowing you to translate forms into multiple languages easily. This feature simplifies the localization process, ensuring that your forms are accessible to a global audience. You can manage translations efficiently within AEM translation projects, reducing time and effort required for multilingual form support. See considerations section for more information on translation.
  • Multi-site Management and Live Copy: AEM Sites provide robust Multi-site Management and Live Copy capabilities, enabling you to create and manage multiple websites within a single environment. This feature now lets you reuse forms across different sites, ensuring consistency and reducing duplication efforts. With centralized control and management, you can efficiently maintain and update forms across multiple websites.
  • Themes: AEM Sites pages provide a framework for designing and maintaining consistent visual styles across multiple web pages. These define colors, fonts, style sheets, and other visual elements that contribute to the overall look and feel of the website. You can use the themes designed for an AEM Sites page for an Adaptive Form, saving time and effort.
  • Tagging: AEM Sites pages allow you to assign tags or labels to a page, an asset, or other content. Tags are keywords or metadata labels that provide a way to categorize and organize content based on specific criteria. You can assign one or more tags to pages, assets, or any other content items within AEM to improve search and categorize the assets.
  • Locking and Unlocking content: AEM Sites allow users to control access and modifications to pages within the AEM Sites environment. When a page is locked, it means that it is protected from unauthorized changes or edits by other users. Only the user who has locked the content or a designated administrator can unlock it to allow modifications.

In addition, Adaptive Forms in AEM Page Editor use Adaptive Forms Core Components. These Core Components provide a standard and easier methods to style and customize the components, identical to AEM Sites WCM Components.

How to create or add an Adaptive Form in AEM Sites page or AEM Experience Fragment?

You can take full advantage of this feature by utilizing the following options:

  • Create and add a custom Adaptive Form to an AEM Sites page: You can use the Adaptive Form Container component to build a brand-new form from scratch, tailoring it specifically to your requirements and design preferences.

  • Create and add a custom Adaptive Form to an Experience Fragments: You can extend the reach of your forms by adding them to AEM Experience Fragments, allowing for seamless reuse across multiple pages or sites.

  • Convert an Adaptive Form to Experience Fragment: Convert an Adaptive Form added to an AEM Sites page to an Experience Fragment for reusing the form across multiple AEM Sites pages.

  • Create and add forms based on approved templates to an AEM Sites page: You can use pre-approved templates to quickly create Adaptive Forms that align with your organization’s branding guidelines and design standards. The option is available only for Adaptive Forms created with Adaptive Forms Editor or Adaptive Forms - Embed component.

  • Add existing forms to an AEM Sites page: You can easily integrate forms that you have already created into your websites, enabling visitors to interact with them directly. The option is available only for Adaptive Forms created with Adaptive Forms Editor or Adaptive Forms - Embed component.

  • Add multiple forms to an AEM Sites page or Experience Fragment: You can create or add multiple Adaptive Forms to an AEM Sites page to provide multiple choices to users based on their preferences and requirements. These can a combination of brand-new form from scratch and existing forms. You can use the Adaptive Form Container component multiple times to add Adaptive Forms in an AEM Sites page. You can use the Adaptive Forms - Embed component multiple times in an AEM Sites page, only if Form covers entire width of the frame option is selected. In case the Form covers entire width of the frame option is not checked, AEM Sites page supports only one Adaptive Form to exist without an iframe. To add more Adaptive Forms using the Adaptive Forms - Embed component, select Form covers entire width of the frame option.

Considerations to create an Adaptive Form in AEM Sites page or AEM Experience Fragment

  • When you use the Adaptive Form Container to create or add a form, the forms undergo translation and localization through the AEM Sites translation flow. For each language, a separate copy (language copy) of the sites page and corresponding forms is generated and when a content author modifies a rule in a form on the parent page, the same changes must be made in all language copies of the form. Adaptive Form Container also lets you use various features of AEM Sites pages like, versioning, targeting, translation, and multi-site manager.

  • When you create or add a form using the Adaptive Form-embed component, the forms undergo translation and localization using the AEM Forms translation flow. In this case, a single form is maintained and referenced in all the language copies of the Sites pages. Adaptive Form-embed component does not provide access to various features of AEM Sites pages like, versioning, targeting, translation, and multi-site manager.

Requirements to create or add an Adaptive Form in AEM Sites page or AEM Experience Fragment

Before you start creating or an Adaptive Form, enable Adaptive Forms Core Components and add Adaptive Forms Client Libraries to your AEM Sites page: