Install a form via shortcode

Display a Customer Fields form virtually anywhere on your storefront

Kyle Weiskopf avatar
Written by Kyle Weiskopf
Updated over a week ago

Want to display a Customer Fields form inside a product's description? Or perhaps in the middle of a blog post? Or maybe within a custom popup, or some other location on your storefront?
โ€‹
You're in luck -- shortcodes have got you covered!

With the power of Customer Fields' app embed and shortcodes, you can easily display forms in all sorts of places on your storefront. This option is great for themes that do not support app blocks or other unique cases that require a form to be displayed alongside other content.

How to use a shortcode

Step 1: Enable the app embed for Customer FIelds

For shortcodes to work, you'll first need to enable the app embed for Customer Fields. Once enabled, the app embed for Customer Fields will automatically display a form anywhere a shortcode has been used.

Please refer to this help article for details on how to find and enable the Customer Fields app embed inside Shopify's theme editor.

Step 2: Copy a form's shortcode

Launch the app admin for Customer Fields and navigate to the Forms page. Find the form you wish to display and click the 'Edit' button to launch the form builder.

Once the form builder is launched, click on the 'Installation' tab. From here you'll need to select the theme you're working on, and upon doing so the app will run a quick check to see if the app embed is enabled on the selected theme.

After the theme check has been completed, you'll need to click on the section for 'Other locations'. Inside this section you'll see the form's shortcode, like so:

Simply click the 'Copy' button to copy the shortcode to your computer's clipboard.

Note: The syntax for shortcodes is the same for all forms, but each shortcode includes a reference to a unique form ID. This means you can use the same shortcode to display a single form in multiple places, but if you wish to display multiple forms via shortcode, then you'll need to make sure to copy the shortcode for each form separately.

Step 3: Paste the shortcode wherever you'd like

Once you've copied a form's shortcode, you can paste it into all sorts of places in the Shopify admin. Essentially any place in Shopify that allows you to define content for your Online Store can be used with form shortcodes, including:

  • Page content

  • Product descriptions, collection descriptions

  • Blog post content

  • Theme code

  • HTML blocks in the theme editor

After pasting a shortcode, make sure to save your changes. Once your changes are saved, test and confirm that the form is working by viewing the page on the storefront.

Did this answer your question?