Getting started with form landing pages for your WordPress forms

Similar to pre-built WordPress themes designed for specific business categories, a form landing page is a pre-designed web page built for specific form use cases. When building WordPress websites as a professional web developer, a pre-built form landing page can help save on development cost, improve conversions, and streamline your workflow.

Form landing pages vs templates

A template is a pre-built form file that contains an arrangement of input fields with pre-added labels that are specific for the type of form or category. For example, a login form template would generally include an email address field and a password field. A form landing page does not include input fields, but instead is designed to primarily focus its functionality on displaying the form.

Since form landing pages auto-create webpages and automatically insert your WordPress forms, they include their own customization settings and are packaged as individual plugins. For each landing page plugin, the plugins offer unique customization settings designed specifically for building the final landing page. Settings vary for each landing page plugin, but generally include the following settings:

1. 1. The ability to use your own header and footer.
2. 2. Add a top bar with a welcome message.
3. 3. Add your logo and company icon.
4. 4. Add text for specific elements.
5. 5. Add photos such as background images, cover photos, and/or product images.
6. 6. Enable or disable search engine indexing.
7. 7. Choose a slug or URL for the generated form link.
8. 8. A branded page pre-loader icon/logo.

Form landing page available designs

As of today, Likeable Forms includes 7 unique landing page designs. Each design comes packaged as an individual plugin and can be downloaded from your Likeable Forms online account upon logging in.

All designs come fully mobile responsive out of the box and cross browser compatible.

Log In

The login form is designed to replace the standard WordPress login form and features a perfectly centered form that goes far beyond a basic design. It includes a sign-up link in the main navigation that links to the sign-up URL specified in its plugin settings. The design also includes underneath the form a password reset link that either can link to your own custom forgot password URL or the default WordPress forgot password URL. The login form auto-centers itself regardless of the height of the device it’s being viewed on.

Conversational

The conversational form is a truly unique form layout. The form displays one field or input at a time, has a next, previous, and continue button for easy navigation, and a smooth auto-scroll that centers the next input as you advance. Conversational forms are known to be distraction free and boost form conversion rates.

Product

The product theme design is a straightforward and extremely easy to use ecommerce store. It includes a product image gallery with a built-in light box for enlarging images. A two column layout on desktop, tablet, and iPad. Customizable text for a SKU, stock availability, and tracking. Navigation breadcrumbs and also a payments icon collage.

Default

The default theme is for when you need a simple yet distraction free form. It’s designed to be highly compatible with all standard web themes and is the most traditional form layout users are accustomed to seeing. The default design can also be applied without a form landing page plugin by using the WordPress form short code generated by the form builder when a form is saved. This is the default design for all short codes that do not use this plugin.

Sign Up

The sign-up form is an exact replica of the login form design, except it includes different link logic. The sign-up form includes a login link in the main navigation and a sign-in link beneath the form, as opposed to a forgot password link and a sign-up link.

Multistep

The multistep design is a multistep form with a two column layout. The left side of the screen is a full height image, and on the right side the multistep form. This design displays one field at a time, similar to the conversational form design except without auto-scrolling. The multistep design includes navigation to move forward or backwards to complete the form.

Social

The social theme is designed to resemble a social media profile page. It includes various elements such as a cover photo, a profile photo, a company description, website URL, and also tabs for the form, company information, location, and office hours.

Enabling form landing pages for your WordPress forms

Form landing pages have their own dedicated tab inside the Likeable Forms form builder. To access the settings item and choose a design, hover over the settings menu item in the top navigational bar, then select the templates option. 

The templates modal displays all available template designs, e.g., form landing page designs, and each template's settings can be opened by selecting the design cover image. Note: You must first install the plugin before being able to access its settings.

The settings are enabled on a form-by-form basis. Once you select the design, in order to configure and apply the design to your WordPress forms, you need to then select the enable settings button located in the center of your screen. Once enabled, the landing page settings will automatically be generated, and the enable button will disappear.

While each plugin offers its own customization settings, in general you can always enable a top bar and include a welcome message. The top bar can be great when wanting to add an attention grabbing headline or to communicate something specific about the current form. 

Enable the theme header and footer or use your own WordPress header and footer. Depending on the design, you may be prompted to either upload your company logo or icon and add two links to the main navigation to custom URLs with unique text.

You can allow or disallow search engines from indexing your form landing page.

Lastly, for each form, you can choose your own unique slug/URL. Before saving the form, you can run the availability check on the slug you enter to make sure it is available. 

Form landing pages are workflow shortcuts

Form landing pages serve as a shortcut for creating and publishing professional-looking forms. Take for example the typical flow for building a simple page for a login form:

1. 1. Create a new page or post.
2. 2. Add a three column layout or section/block.
3. 3. Add a short code block to the center column.
4. 4. Paste your login form short code inside the short code block in the center column.
5. 5. Style the page with CSS to add mobile responsiveness and match branding.
6. 6. Save the form.

By implementing one of our form landing page plugins, you get to take advantage of the quality work of experienced web developers, while bypassing this workflow altogether.

Designing a professional webpage that practices modern web design best practices can take years to develop the adequate skill sets required in order to create similar high quality webpages and form designs. This may include experience with wireframe software, photo editing software, CSS and WordPress knowledge, as well as the time investment in order to implement the designs.