Templates > MightyMerchant Component Layouts > Forms Component Layout

Forms Component Layout

Overview

Category component identifier for main category: forms

Subcategory component identifier: «formFileName»form (e.g., contactform)

Category Fields

Order Field Label
1 hide_cat
1.5 cat_order
2 cat_name Page Title
3 doc_name web-page-address
3.1 cat_custom1 Form Legend Title*
5 cat_form1 Which Form
4 cat_blurb1 Intro text for form
5 submission_response
6 email_submissions_to
7 cat_flag1 Save items to category
8 template_name
9 list_action
10 parent_id
11 hide_search
12 cat_nav_flag
13 cat_nav_footer_flag
14 component_identifier

*Form Legend Title will replace the default legend on the form. This is new as of 8/13/15, so earlier site-specific forms might not have this field set up.

Implementation

1. Use a default form or create a form

  • Forms should be set up with the “saveform” action. 
  • Each form is a file within the _inserts directory.
  • Default set of forms: contact.html, mailinglist.html, and returns.html
  • Other available forms: contact-phone.html, contact-address, creditapp.html, requestquote.html

2. Add a list in the “lists” manager with these settings:

Cat Id: Forms
Which Table: categories
List Name: cat_form1 (you may need to add this field to database)
List Items (one per line): contact.html, mailinglist.html, plus any others you may add
Locked: yes
Admin Only: yes

3. Add a subcategory for each form and point it to a specific file in the _inserts directory

4. Form submissions can be flagged to save fields to the Site Manager, so if you expect that a form will be saved, be sure to set the field names to corresponding database product fields.

Update History

Forms Updates to Buttons and Mobile Layout

Added 1/27/15

I've made a couple updates on the shared forms and forms templates on alphadev.

  • Changed the button to btn-primary on _inserts/forms, since that's normally the primary action on those pages.
  • Changed the layout of the forms templates on mobile. Shortcat_blurb1 will now display above the form, along with a read more link. The link toggles the full blurb. This way you know there is text, but can also see there is a form without scrolling.

Removed Captcha on Forms

Updated 6/10/15

I've updated the forms in the shared alphadev templates to remove the captcha. You will need to do this on site-specific forms.

forms/default

  • uses its own no-sidebars columns.html that includes a script for adding the alternate legend
  • mobile layout displays shortcat_blurb1 above the form with a read more link that toggles the full cat blurb

forms/one-column

  • uses the default columns.html
  • mobile layout displays shortcat_blurb1 above the form with a read more link that toggles the full cat blurb

forms/full-width-title-2col

  • uses default columns.html
  • this is for layouts where you want the page title needs to span both columns
  • page title has a class of “fullwidth”

forms/_modaltest

  • This was a test set and not for production use