Optimizely CMS – Allow Forms to Redirect to Media Assets

Optimizely Forms is a powerful add-on that can improve the experience for authors to create custom forms as needed with plenty of capabilities.

It can be also extensible, so a developer can implement custom form elements and add complex logic to forms to accommodate the user’s needs and the client’s requirements.

Forms can be configured to send out emails to any email address and the interface allows for values from the form to be inserted in the sent email.

All form submissions can be viewed within CMS and then exported as different formats, including XLSX, CSV, JSON, and XML. The data can be stored within the CMS and it allows exporting data in appropriate formats. Optimizely Forms also comes with an API that can be used to hook into external systems for data collection and processing.

When a user submits a form, the editor can decide between two options (by default):
Display page after submission: Select a page (internal link), that you want to display after the form is submitted.
Display message after form submission: Enter a message that you want to display after the form is submitted.

If you decide to redirect to a page after the form is submitted, there are only two options:
Categories: If you work with Categories, you can link to this content.
Page: Internal page, which can contain a “Thank you” message.

What if you want to redirect to a media asset directly, once the user fills in the form?
There are two alternatives I propose in this blog post.

Shortcuts

The easiest solution to handle this scenario is using Shortcuts. Please, follow these steps if you are unable to add any code to the current solution.

Create an empty “Generic” page that can be hidden from crawlers, search results, and sitemap.
Select the Settings tab, and verify you have the Shortcut field option in your template. Note: this is an out-of-the-box functionality so, if you don’t have any customization, it will work as expected.

Click “Manage” and select “Shortcut to another content item” if your asset is stored in your Media Assets. If your page/document is on an external repository, you can also use “Shortcut to page on another website” and set an External Link.

Once you select the asset, it should look like this:

Publish your changes and you will notice a new icon on the tree node which indicates it has a shortcut.

Finally, you need to go to the form and select that page. When the form is submitted, it will redirect to the “Generic” page, and since this page has a shortcut it will redirect to the content asset.

Editor Descriptor

This is a “fancy” solution that will override the behavior of the current “Select a Page” dialog and will let you redirect to a media asset directly from the form.

The “Display page after submission” field in the form has a specific descriptor that overrides the default behavior of URL fields. It’s using a UIHint called “TargetPage” which basically hides the other options.

Create a custom EditorDescriptor that will override how this field renders.

[EditorDescriptorRegistration(TargetType = typeof(Url), UIHint = "TargetPage", EditorDescriptorBehavior = EditorDescriptorBehavior.OverrideDefault)]
public class CustomTargetPageSelectionEditorDescriptor : UrlEditorDescriptor
{
	public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
	{
		ClientEditingClass = "epi-cms/widget/UrlSelector";

		base.ModifyMetadata(metadata, attributes);
	}
}

The code that makes this work is EditorDescriptorBehavior = EditorDescriptorBehavior.OverrideDefault which basically overrides the definition for that specific field in the forms.

Now, when you edit the field, the default options for a URL field will be visible and you can select a media asset directly from that window.

Hope this helps.

More information about Optimizely Forms