Note: This article is related to the Form element, not the Form Box Element. 

To find out if you are using a Form element, visit the layout tab of your editor - if this contains a 'form' element, then this is the article for you.

If it contains a Form Box element then you are using the latest element. If you are using our Form Box element, check this help article for more information.

Forms are great for receiving messages from and collecting emails from your customers and visitors. Form Elements will use your theme's styling by default.

How to add a form to your Shogun page

To get started with the Form Element, simply drag a Form Element onto your page.

How to add a new form field

Adding a new form field to the Form Element is easy! Simply click the 'add new field' button in the right-hand menu of the editor to get started.

When adding a new field, you will notice that there are different options to customize this new field.

Field Label allows you to customize the title of the field, and Field Placeholder allows you to inform the user of what input is to be expected within the field. This is used as the header for the columns when you export the form data CSV file.

Field Type allows you to set which type of input is allowed in the field.

  • Email means that the field will expect an email input into the field

  • Text allows the user to insert a small, one line sentence, such as a subject

  • Textarea gives the user a bit more space to type, this would be good for a message that the user might want to send

Required? determines if the user can submit the form without filling in the field or not. Toggle this on a field of important information to ensure that your user does not submit the form without it.

Customizing the confirmation message

The confirmation message is displayed to your visitor once they have submitted the form. You can customize this to change the message that is displayed to the user, and how it is displayed.

The Text field allows you to change the message that you send to your user once they have submitted the form.

The Background Color allows you to change the color of the background of the message, whereas the Text Color option allows you to change the text color.

Customizing the submit button

The submit button on your Shogun Form Element can also be customized to fit your needs.

The Text Color option allows you to change the color of the text inside the submit button, while the Background Color option allows you to change the background color of the button.

You can change the Default Submit Text to better reflect what action the user is performing.

Alignment allows you to change the alignment of the button, from the right, left, or middle.

Customizing your input fields

You can change the font of your input fields using the Google Fonts API. Simply start searching for a font in the Font field.

You can also change the Size of the font and the Text Color.

Customizing your label text

Just like the Input Fields, the Label Text can also be customized to better suit your needs. This field also uses the Google Fonts API to allow you to select a font to use.

You can also change the Size of the font and the Text Color.

Receiving form notifications by email

Messages from the form are emailed to the address entered in the "Send submissions to" field. 

The Internal Form Name serves two purposes. The text entered into this field is included in the subject line of the email notifications. It also appears in the exported form data (see below). This field is best used as an identifier if you have multiple forms throughout your site.

Exporting form data as a CSV file

Submissions from all of your Shogun forms are also stored in the Form Data section of the Shogun dashboard. Simply navigate to the Advanced section of the Shogun dashboard and to the Form Data tab.

In this section, you can export all form submissions as a CSV file. The file will contain all of your form data, including the date & time of each submission, the internal form name, and the visitor's email address. Once the "Export to CSV" button is clicked, a CSV of all your forms' data will be generated and emailed to you.

If you'd like a form that integrates with your existing mailing list/contact management service or one that offers more complex options, such as file uploads, it is possible to embed third party forms into your Shogun page using the HTML element.

Did this answer your question?