Skip to main content

Utilizing a Form

Once you are done creating and configuring, or updating, a form you will want to get it on one of the pages on your site, so users can reach out to your agency directly from your web site.

Publishing a Form

Navigate through the AEM Forms to the place your form lives. 'Hard select' the form, by clicking on the corresponding thumbnail. Then click publish at the top of the page. Click "Accept" in the prompt that opens to complete the publication of the form.

If an update to an active form is made, the site page needs to be republished as well, so changes to the form are reflected on the live page of the website.

Inserting Form to a Page

Once the form has been created you will navigate through AEM sites to the page the form will be placed on. Open the page in edit mode. Place the AEM Form (SOI Site - Form) component on the page, in the desired location. 

Forms like webpages have a mobile & desktop version for the layout, and the mobile version of the layout will most likely render when a form is placed on a left-hand navigation page.

Configuring AEM Form Component

Now that you have the needed component on the page, click the wrench icon on the AEM Form component toolbar to access the configuration page.

Within the AEM Form configuration there are several selections to be made and fields to be filled. 

AEM Forms Configuration Properties

  • Asset Type - select "Adaptive Form"
  • Asset Path - click the checkmark at the end of the box to follow the filepath to the form you created
  • Post-submission - make a selection
    • Show Thank You Message - if selected you can type in the message to be displayed directly below in the text box.
    • Show Thank You Page - if selected you will located the filepath to that page. (You may need to create a Thank You page, if one is not already established)
    • Refresh page on submission - Check this option if showing a thank you page. This will ensure the user is redirected to the thank you page upon submission.
  • Set Focus on Form - Remove checkmark as this option may negatively affect the accessability of the page.
  • Theme - Select the SOI Forms Theme from drop-down list.
  • Aria Label - Enter an Aria label to improve the accessibility of the form.
  • Other properties such as Height (pixels), CSS Client Library, and Form Title are also available, but not required to ensure the form works successfully on the page. 

Once you have completed the configuration click the "check mark" in the upper right-hand corner of the dialoge box, and your form will populate on the page.