Contact Form 7 Extension

Overview

The ActiveMember360 Contact Form 7 Extension provides a deep integration with Contact Form 7 customisable for each form defined.

The ActiveMember360 Contact Form 7 Extension Highlights:

• Automatically populates ActiveCampaign fields defined within the form for a remote user
• Automatically creates or updates the ActiveCampaign contact after the Contact Form 7 form is successfully submitted
• Automatically updates an ActiveCampaign contact with actions after the successful Contact Form 7 form submission including:
  • Add ActiveCampaign tags
  • Remove ActiveCampaign tags
  • Add to ActiveCampaign automations
  • Remove from ActiveCampaign automations
  • Subscribe to ActiveCampaign lists
  • Unsubscribe from ActiveCampaign lists
• Redirects to any chosen page/post after the successful Contact Form 7 form submission
• Provides an autologin option for a contact after the successful Contact Form 7 form submission
• Supports ActiveCampaign Event Tracking for successful Contact Form 7 form submissions

Activation

The Contact Form 7 plugin must have previously been installed and activated on your site in order to be able to activate the ActiveMember360 Contact Form 7 extension.

Steps to activate Contact Form 7 Extension

1. In WordPress administrator main navigation click ActiveMember360, Extensions.
2. In ActiveMember360 Extensions tabs click Contact Form 7.
3. Set Enable Contact Form 7 Extension to Yes.
4. Click Save Settings.

Form Settings

Every individual form can be selectively configured to integrate with ActiveCampaign using the ActiveMember360 Contact From 7 Extension.

Steps for specifying ActiveMember360 form integration settings

1. Select the ActiveMember360 tab.

2. Check Integrate with ActiveCampaign to Yes if you wish the form to integrate with ActiveCampaign.

   Important

   This will enable the other ActiveMember360 settings for the form as detailed below and within Form Fields.

   When a remote user is shown the form any ActiveCampaign fields defined within the form will be automatically populated from the ActiveCampaign contact record.

   When a form is successfully submitted containing the ActiveCampaign field named email, if a contact with the submitted email address exists within ActiveCampaign that contact will be updated, otherwise they will be created as a contact with that email address.

3. Check Do not send an email as required.

   When checked the emails defined within the Contact Form 7 form Mail tab will not be sent after a form submission.

4. Check Log form submission as required.

   When checked a form submission event will be logged within ActiveCampaign. The name of the event will match the name of the Contact Form 7 form.

   In order to track the Contact Form 7 form submission events you must also have the enabled and configured the ActiveMember360 ActiveCampaign Tracking Module.

   The tracked event can be used to trigger an automation within ActiveCampaign as detailed within Using Event Tracking to trigger automations.

5. Check Autologin as required.

   The Autologin option allows validated ActiveCampaign contacts to autologin to the WordPress ActiveMember360 site after successful submission of the form.

   In order to use the autologin feature the form must have an ActiveCampaign field named email specified.

   Also the ActiveMember360 Autologin module must be activated as detailed within Activate the Autologin module and a security code defined within ActiveMember360, Settings, Security, Security Codes.

   The code used for the autologin will be the first in the list of defined codes.

   Important

   Be aware that the autologin URL used as a thank you page URL for a form is not secure. As with any login credentials if the autologin link is shared someone could login as you.

   For that reason autologin is not recommended and if used should be done so with due diligence.

6. From the Redirect page after successful form submission drop down select a page/post where you want to send your contacts after a successful form submission.

   The page/post selected will be used in all situations including for a visitor, logged in user and where autologin is used see step 5 above.

7. From the Add tags select box select the ActiveCampaign contact tags to be added after a successful form submission.

   Scroll or start typing any consecutive characters of the contact tag name to refine the list and aid selection.

   Then click on the required tag.

   Multiple tags can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

   Individual tags can be removed from the selection by clicking a different tag or when using multiple select by clicking them again.

   Default: None

8. From the Remove tags select box select the ActiveCampaign contact tags to be removed after a successful form submission.

   Scroll or start typing any consecutive characters of the contact tag name to refine the list and aid selection.

   Then click on the required tag.

   Multiple tags can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

   Individual tags can be removed from the selection by clicking a different tag or when using multiple select by clicking them again.

   Default: None

9. From the Add to automations select box select the ActiveCampaign automations to which the contact will be added after a successful form submission.

   Scroll or start typing any consecutive characters of the automation name to refine the list and aid selection.

   Then click on the required automation.

   Multiple automations can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

   Individual automations can be removed from the selection by clicking a different automation or when using multiple select by clicking them again.

   Default: None

10. From the Remove from automations select box select the ActiveCampaign automations from which the contact will be removed after a successful form submission.

    Scroll or start typing any consecutive characters of the automation name to refine the list and aid selection.

    Then click on the required automation.

    Multiple automations can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

    Individual automations can be removed from the selection by clicking a different automation or when using multiple select by clicking them again.

    Default: None

11. From the Subscribe select box select the ActiveCampaign lists to which the contact will be subscribed after a successful form submission.

    Scroll or start typing any consecutive characters of the list name to refine the list and aid selection.

    Then click on the required list.

    Multiple lists can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

    Individual lists can be removed from the selection by clicking a different list or when using multiple select by clicking them again.

    Default: None

12. From the Unsubscribe select box select the ActiveCampaign lists from which the contact will be unsubscribed after a successful form submission.

    Scroll or start typing any consecutive characters of the list name to refine the list and aid selection.

    Then click on the required list.

    Multiple lists can be selected as required using standard operating system controls i.e. for Windows the ctrl key.

    Individual lists can be removed from the selection by clicking a different list or when using multiple select by clicking them again.

    Default: None

13. Click Save to save your settings.

Form Fields

To define the form fields that will populate ActiveCampaign follow the steps below:

Steps for selecting ActiveCampaign contact fields

1. When creating or editing a Contact Form 7 form select the Form tab.

2. Select ActiveCampaign Contact Fields form tag.

   The form tag generator for ActiveCampaign contact fields will then display.

Steps for specifying form fields using ActiveCampaign contact fields

3. From the Field Name drop down select the ActiveCampaign field.

   The fields shown for selection are those already defined within your ActiveCampaign application.

   Important

   The ActiveCampaign field named email is the unique identifier for the contact.

   For any form to be integrated with ActiveCampaign it must have an ActiveCampaign field named email selected.

   When a form is successfully submitted containing the ActiveCampaign field named email, if a contact with the submitted email address exists within ActiveCampaign that contact will be updated, otherwise they will be created as a contact with that email address.

4. From the AC Field Type drop down select the field type.

   This is used to determine the other options for this field type and the field validation.

   • Text - This is the equivalent of the ActiveCampaign Text Input field type.
   • Email - This is the equivalent of the ActiveCampaign Text Input field type.
   • URL - This is the equivalent of the ActiveCampaign Text Input field type.
   • Phone - This is the equivalent of the ActiveCampaign Text Input field type.
   • Number - This is the equivalent of the ActiveCampaign Text Input field type.
   • Number - This is the equivalent of the ActiveCampaign Text Input field type.
   • Date - This is the equivalent of the ActiveCampaign Date field type.
   • Text Area - This is the equivalent of the ActiveCampaign Text Area field type.
   • Checkbox - This is the equivalent of the ActiveCampaign Checkbox field type.
   • Radio - This is the equivalent of the ActiveCampaign Radio Button field type.
   • Drop Down - This is the equivalent of the ActiveCampaign List Box and Dropdown field type.

Text

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Check Akismet as required.

   This will set the Contact Form 7 akismet variable to author-name.

   The WordPress Akismet plugin must be activated for this setting to have effect.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Email

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Check Akisimet as required.

   This will set the Contact Form 7 akismet variable to author-email.

   The WordPress Akismet plugin must be activated for this setting to have effect.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

URL

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Check Akisimet as required.

   This will set the Contact Form 7 akismet variable to author-url.

   The WordPress Akismet plugin must be activated for this setting to have effect.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Phone

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

8. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

9. Check Required field as required.

   When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

10. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Number Spinner

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Specify within the Range inputs the Minimum and Maximum number values permitted.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Number Slider

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Specify within the Range inputs the Minimum and Maximum number values permitted.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Date

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Specify within the Range inputs the Minimum and Maximum date values permitted.

   Date pickers will be shown for the user to select the required values.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Text Area

5. Specify any required Default Value for the field within the form.

6. Check Use this text as the placeholder of the field as required.

   When checked the Default Value will be used as placeholder text rather than the default value for the field.

7. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

8. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

9. Check Required field as required.

   When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

10. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

11. Check Required field as required.

When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

12. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Checkbox

5. List the various options for the checkboxes.

   Specify each option on a separate line.

   These options should be set to mirror the field option settings for the ActiveCampaign contact field selected in step 2 and specified within ActiveCampaign.

6. Check Put a label first, a checkbox last as required.

7. Check Wrap each item with label element as required.

   When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

8. Check Make checkboxes exclusive as required.

   When not checked this is equivalent to the the ActiveCampaign Checkbox field type.

9. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

10. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

11. Check Required field as required.

When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

12. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Radio

5. List the various options for the radio buttons.

   Specify each option on a separate line.

   These options should be set to mirror the field option settings for the ActiveCampaign contact field selected in step 2 and specified within ActiveCampaign.

6. Check Put a label first, a radio button last as required.

7. Check Wrap each item with label element as required.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Drop Down

5. List the various options for the checkboxes.

   Specify each option on a separate line.

   These options should be set to mirror the field option settings for the ActiveCampaign contact field selected in step 2 and specified within ActiveCampaign.

6. Check Allow mutiple selections as required.

   When checked this is equivalent to the the ActiveCampaign List Box field type.

   When not checked this is equivalent to the the ActiveCampaign Dropdown field type.

7. Check Insert a blank item as the first option as required.

8. Specify the CSS Id attribute required for the <input> HTML tag for the chosen field.

9. Specify the CSS Class attribute required for the <input> HTML tag for the chosen field.

10. Check Required field as required.

    When checked the form validation will ensure a value is entered for the field before the form submission is fully processed.

11. When Insert Tag is clicked the form code will be inserted at the current cursor location in the form.

Important

Please note that when defining the Contact Form 7 form fields the ActiveCampaign contact field definition stored within ActiveCampaign is not updated i.e. the field type is not changed nor options for list, dropdown, radio and checkboxes updated.