Display WordPress form using HTML code
We already have the idea that a WordPress page with a form is published using a shortcode. Then why use HTML code to do the same thing? This blog discusses why and how do we display WordPress form using HTML code. Adding an HTML code rather than a shortcode enhances your options. With HTML codes, you can add or remove elements according to your necessity.
WordPress allows us to display WordPress form using HTML code. This is carried out by completing a few steps from your WordPress dashboard itself. On the other hand, you can also download plugins helping you add custom HTML codes to your WordPress form.
Using HTML, your form is guaranteed to attract more attention as it will be highly customizable compared to the rest of the content. For example, using HTML codes you can embed images to your form to make it alluring. To summarize, your form will now have more viewers willing to submit the form.
In this tutorial, we learn to display WordPress form using HTML code.
Fetching the pre-generated HTML code
If you haven’t created a form already, then make it your priority. In this example, we go ahead and tweak the form already created with RegistrationMagic.
From your WordPress dashboard go to your RegistrationMagic plugin. Click “All Forms” to land on the page consisting of a collection of forms. To demonstrate, the form we select here is a General-Purpose Registration Form. This form is located right next to the Login Form.
Hover your cursor across the form envelope to discover the “Dashboard” hyperlink. Click it to visit the dashboard of the selected form. This is the section where you can visualize the graphs related to submissions. It also displays “Field Analytics” and allows modification of certain specks present in the form.
In the meantime, you can use this Dashboard page to edit, configure, integrate and publish form content. Hence scroll down directly to the “Publish” section. Underlying is a sub-heading tagged “HTML Code”. Click on it to configure your WordPress form with an HTML code.
A pop-up appears with “Publish” as the heading. This pop-up prompts you to publish your WordPress page using the HTML code placed below. This code defines class attributes as well as particulars like width and height of the form.
Click the “COPY” link underlying this code. This copies the complete HTML code used to generate the form.
Publish WordPress form using HTML code.
Navigate all the way back to Pages >> Add New. This is the section from where you publish your form using the HTML code. Clicking “Add New” creates a new page with the heading “Add New Page”.
Assign a unique name to the page. In this example, we name the page as “Display Form”. From the body section of the email-like page click “Text” placed to the right beside “Visual”.
Paste the complete HTML code in this section. The text part accepts HTML codes while the visual part doesn’t. HTML tags are generated only if they embed themselves under the “text” section.
Click “Publish” to print the form on the page. Your page is now successfully published.
Finally, you can click the “View Page” hyperlink to relish a view of your page. A roundabout to this is clicking the permalink below your page name. Both the options are approved ones.
To summarize, this is how you display WordPress form using HTML code. To illustrate, shared below is a screenshot of your form embedded in your “Display Page”.
- How to Allow WordPress Login and Registration using Email - October 5, 2018
- How to Display WordPress Member Directory - October 1, 2018
- How to Create WordPress Form With Payment Option - September 30, 2018
- How to Disable WordPress Admin Bar for all Users Except Admin - September 29, 2018
- How to Disable New User Notification Emails in WordPress - September 28, 2018
- How to Add New Users And Authors in WordPress Blog - September 27, 2018
- How to Restrict WordPress User Access by Passphrase Code - September 26, 2018
- How to Restrict User Access by Date in WordPress - September 25, 2018
- How to Restrict WordPress Forms by User Roles - September 24, 2018
- How to Configure Registration Form in WordPress - September 12, 2018