• Knowledge Base

Tutorials

• Add Custom Templates to the Template Library

  Learn how to add custom templates to the WS Form 'Add New' page.

• Add Row Numbers to Repeatable Sections

  This tutorial demonstrates how to add row numbers to repeatable sections.

• Add Select2 to a WS Form Select Field

  This tutorial explains how to add the Select2 jQuery plugin to any select field in your form.

• Allow Users to Add Custom Terms to Posts

  You can allow users to add custom terms by enabling tagging on a select field.

• Assign a Form to a WooCommerce Product

  WS Form PRO can be used to customized WooCommerce products.

• Automatically Login Users After Registration

  Using the User Management add-on, it is possible to automatically login a user after they have been registered.

• Build a WordPress Form with the Advanced Custom Fields (ACF) Plugin

  Automatically create forms that contain the fields you have made in ACF for any post type.

• Build a WordPress Form with the JetEngine Plugin

  In this tutorial, we’ll show you how to integrate WS Form PRO with the JetEngine plugin.

• Build a WordPress Form with the Meta Box Plugin

  Automatically create forms that contain the fields you have made in Meta Box for any post type.

• Build a WordPress Form with the Pods Plugin

  In this tutorial, we’ll show you how to integrate WS Form PRO with the Pods plugin.

• Build a WordPress Form With the Toolset Plugin

  In this tutorial, we’ll show you how to integrate WS Form PRO with the Toolset plugin.

• Change Form Submission Limit Settings Using PHP

  Sometimes you might want to change form settings dynamically using PHP prior to the form being rendered on your website.

• Change Required Field Indicators

  You can change field required indicators to use any HTML you wish.

• Change Tab Labels Using PHP

  Sometimes you might want to change a tab label dynamically using PHP prior to the form being rendered on your website.

• Combine First and Last Name Fields into a Full Name Field

  Using WS Form PRO conditional logic you can easily create a full name field that is automatically updated when a user enters their first or last name.

• Confirmation Fields

  Confirmation fields require users to verify an email address, password, or other text information that has been typed into a form.

• Control Actions With Conditional Logic

  It is possible to control when WS Form PRO actions run by using conditional logic.

• Create a Contact Form in WordPress

  In this tutorial, we’ll show you how to create a contact us form for WordPress using  WS Form.

• Create a Customizable T-Shirt Product

  This tutorial explains how we created the customizable t-shirt product demo.

• Create a Discount Code Field

  This tutorial shows you how to add a discount code field to your e-commerce form.

• Create a Field Prefix or Suffix

  Using WS Form you can easily add prefixes and suffixes to your WordPress form fields.

• Create a File Upload Progress Bar

  Show the progress of a file upload by using a combination of file upload and progress fields.

• Create a Forgot and Reset Password Form

  Learn how to create a custom forgot and reset password page.

• Create a Form Recipient Selector

  In this tutorial we'll show you how to allow a user to select a recipient by enabling and disabling 'Send Email' actions using conditional logic.

• Create a Form Summary

  On a long form you may wish to add a summary of the fields the user has completed.

• Create a Redirect Selector

  In this tutorial we'll show you how to set up form redirects using conditional logic.

• Create a State / Province by Country Selector

  Download a demo form showing how to create a simple state / province selector filtered by country.

• Create an ‘Other’ Option

  A common scenario on a form is the case of an 'Other' option as part of a list of options in a select, checkbox or radio field.

• Create an Email Notification

  You can add any number of additional 'Send Email' actions to your form.

• Create Floating Inside Field Labels With CSS

  Floating field labels appear inside a field when it is empty and move outside the field when it contains content.

• Create Random Values

  WS Form has two functions that can be used to create random numbers and string.

• Create Select, Checkbox, and Radio Cascading Lookups

  Cascading select and radio fields allows you to create choices that change based on a previous selection.

• Custom Server-Side Form Validation

  WS Form allows you to perform your own server-side validation of submitted fields values.

• Customize Appearance

  The WS Form customize appearance feature allows you to edit the colors, fonts, and other style elements of your form in much the same way you would change the style of your website theme.

• Customize the Visual Editor Toolbar

  Learn how to customize the visual editor toolbar in WS Form on Text Area fields.

• Data Grid Column Mapping

  Column mapping allows you to map different columns of your data grid to different parts of your field.

• Data Grids

  WS Form data grids make entering a list of information quick and easy. Data grids work in much the same way as a spreadsheet and provide a powerful way of managing more complex types of data in WS Form.

• Data Sources

  WS Form data sources allow you to pull data from elsewhere into data grids for select, checkbox and radio fields.

• Data Sources: WordPress Filter Hook

  The WordPress Filter Hook data source allows you to dynamically populate a data grids with your own data for fields such as Select, Checkboxes and Radios.

• Deduplicating Form Submissions

  If a duplicate value is submitted into a field you can configure it to show a validation error.

• Disable the Virtual Keyboard on Mobile Devices for Date/Time Fields

  When using date/time field on mobile devices, the virtual keyboard can make interacting with the calendar distracting. Learn how to disable the virtual keyboard.

• Display Checkboxes or Radios in Columns

  It is possible to use the grid orientation setting in checkbox and radio fields to display checkboxes or radios in a grid format.

• Duplicate / Copy Field Values With #text

  The #text(...) variable is used to duplicate the value of field(s) in real-time.

• Dynamic Label, Placeholder and Help Text With #text

  The #text variable can be used in the 'Label' and 'Help Text' settings of fields to create dynamic labels and help text.

• Dynamically Set a Select Field Value Using a Query Variable

  You can use conditional logic to dynamically set the value of a select field from a query variable.

• Email Validation

  It is possible to validate a users email address by sending them a validation link.

• Enable and Disable Dates and Times Using PHP

  This tutorial provides code samples for disabling and enabling dates and times in Date / Time fields.

• Extract Select, Checkbox & Radio Labels

  WS Form PRO has various variables that can be used to extract the chosen text from a select, checkbox or radio.

• Filter Disposable Email Addresses

  Reject form submissions from unwanted email addresses using this WS Form filter.

• Find the ID of a Field

  WS Form uses field IDs for variables, here's how to find them.

• Form Abandonment – Saving Partial Form Submissions

  Learn how to automatically save partially completed forms in case a visitor abandons a form.

• Formatting Numbers Using #number_format

  Numbers can be formatted in WS Form using the #number_format variable.

• Geolocation Lookup by IP

  The WS Form Geolocation by IP Lookup setting in Form Settings can be used to populate form fields with approximate geographical information.

• How To Add Tooltips to Checkboxes and Radios

  If you are using the WS Form framework you can use the following HTML to add Tooltips to Checkboxes and Radios.

• How to Enable File Previews in Emails and PDF Templates

  WS Form will, by default, display both a preview and file information when a file is shown in an email or PDF document. If you are not seeing a preview image or perhaps wish to hide the file information, you can change these settings. Click on WS Form in the WordPress admin menu. Click on...

• How to Make a Custom Button Redirect to a Page

  This tutorial explains how to make a button redirect to a URL when it is clicked.

• How To Run Condition Logic on Form Render

  To run any conditional actions when a form is rendered, you can use the Form > Rendered combination.

• How to Set a ‘Reply To’ When Sending Emails

  When sending an email, the 'Reply To' setting allows you to specify the email address to which recipients will reply.

• Insert Cookie Values into Fields

  You can insert the value of a cookie into a field using the #cookie_get variable.

• Limit a Number Field to Whole Numbers

  HTML number fields enable a user to enter any floating point number. This tutorial explains how to limit this to whole numbers.

• Linking to Tabs on a Form

  It is possible to link directly to tabs on a form. There are two methods for doing this.

• Make a Field Read-Only

  Making a form input field read-only means it cannot be modified, however, a user can tab to it, highlight it, and copy the text from it.

• Manipulate Submission Data Using WordPress Filter Hooks

  When WS Form read or writes submission meta data, it can be filtered using WordPress filter hooks.

• Number Rounding Examples

  Learn how to round numbers using calculated fields.

• Passing Data from One Form to Another Using a Query String

  It is possible to transfer data from one form to another using query string parameters.

• Populate a Field With Query String Data

  It is possible to populate a field with the value of a query string parameter using the WS Form variable.

• Populate a Form With Post Data

  It is possible to pre-populate a form with WordPress post data using the Post Management add-on. The data could be from a page, post or any other custom post type registered in your theme.

• Populate a Form With User Data

  It is possible to pre-populate a form with WordPress user data with the User Management add-on. This is useful for creating an 'Edit Profile' form.

• Populate Select, Checkbox and Radio Fields Using PHP

  You can use WS Form functions to dynamically populate select, checkbox or radio fields.

• Populate the Default Value of a Field Using PHP

  You can use WS Form functions to dynamically set the default value of fields.

• Populating Field Values with Post Data

  There are various different ways you can populate the value of a field using post data.

• Preventing Users from Saving Markup in the Layout Editor

  If you do not want to allow users to save markup in WS Form settings, use the unfiltered_html capability in WordPress.

• Process Submit Data with a WordPress Hook

  You can use the ‘Run WordPress Hook’ action in combination with some simple code to intercept submission data and use it in your own PHP scripts.

• Push Form Submissions to a JetEngine Custom Content Type

  In this tutorial we'll learn how to push a form submission to a Custom Content Type created with the popular Crocoblock plugin JetEngine by using the WS Form Webhook action.

• Redirect Existing Users by Role During Registration

  When a user registers on your website using the User Management add-on you can redirect existing users by their role or other criteria.

• Redirect Users by Role After Login

  When a user logs in to your website using the User Management add-on, you may wish to redirect users by their role or other criteria.

• Run JavaScript on Form Load

  Learn how to run your own JavaScript when a form loads.

• Run WordPress Hook

  The 'Run WordPress Hook' action runs a WordPress action or filter when a user saves or submits a form.

• Save & Continue

  The WS Form save & continue feature allows someone completing a form to save their progress and then continue the form later.

• Select

  The Select field creates a drop-down list with options.

• Send File Attachments in an Email

  WS Form can attach file uploads to email notifications.

• Setting Which Post ID to Populate With Using PHP

  In this tutorial we show you how to change the 'Post ID' setting found in Form Settings > Data > Populate Using Action by using a simple PHP script.

• Setting Which Post ID to Update in the Post Management Action

  Adding or updating a post is determined by using the 'Post ID' setting in the post management action.

• Show a Loader During Form Processing

  WS Form supports a variety of customizable built-in loaders as well as being able to implement your own loader HTML.

• Show Form Submission Count for a Specific Form

  A PHP example showing how to create a shortcode that returns the total number of submissions for any form ID.

• Show Select, Checkbox and Radio Labels in Emails

  Choose which data grid column to use for select, checkbox and radio choices in email templates.

• Style Checkboxes

  If you are using the WS Form framework you can use classes to style checkboxes.

• Style Radios

  If you are using the WS Form framework you can use classes to style radios.

• Style Tabs

  If you are using the WS Form framework you can use classes to style tabs.

• Styling Forms with CSS

  This article describes how to use CSS to style form elements.

• The Date/Time Cheat Sheet

  Dates can be complex! On this page we provide a variety of Date/Time field examples.

• The Variable Cheat Sheet

  While you can achieve a whole lot in WS Form without using variables, you can create even more dynamic and powerful forms using them.

• Transforming Strings

  WS Form can transform the text entered into fields as well as transforming strings using WS Form variables.

• Translate Forms

  WS Form provides full control over the copy used in your form.

• Updating Posts Using the Post Management Add-On

  Learn how to update a WordPress post using the Post Management add-on.

• Use Fields To Change Repeatable Section Row Counts

  WS Form can set the number of rows in a repeatable section by using the value from another field.

• Use Repeatable Section Count in Calculations

  How to use the #section_row_count variable with repeatable sections to calculate other fields.

• Use Shortcodes In Forms

  WS Form PRO allows you to add WordPress Shortcodes to Text Editor, HTML and Message fields.

• Using #field With Delimiter and Column Parameters

  The #field variable 'delimiter' and 'column' parameters allow you to extract data from any column in a data grid as well as separate multiple choices by any character or string you wish.

• Using Cascading Fields to Filter Posts by Terms

  Cascading fields can be used to filter a list of posts by terms.

• Vertical Range Sliders

  Use CSS to rotate the range slider and associated components.

• Website Policies Waivers

  Before you launch any website, protect your own agency by having your client first sign a Website Policies Waiver form on your website.

• Writing Custom HTML for Email Content and PDF Templates

  This article outlines some of the variables that are helpful when developing templates for email content and PDF templates.