How to Add a Contact Form in a WordPress Sidebar Widget

How to Add a Contact Form in a WordPress Sidebar Widget

Do you want to add a contact form in your site’s sidebar? Adding a contact form in your sidebar makes it easy for users to find and get in touch with you.

In this article, we’ll show you how to add a contact form in a WordPress sidebar widget.

If you don’t like the video, or need more instructions, then please continue reading.

Before you can add a contact form in your sidebar widget, you need to first create a contact form.

Start by installing and activating the WPForms plugin. For more details, see this step by step guide on how to install a plugin in WordPress.

WPForms is the best WordPress Form Builder plugin. Get it for free!

Next, go to WPForms » Add New to create a new form.

Add New WPForm

On the setup screen, name your form and select the Simple Contact Form template.

Simple Contact Form Template

WPForms will create a simple contact form.

Here, you can add additional fields by dragging them from the left hand panel to the right hand panel. Then, click on the field to make any changes.

You can also click on a form field and drag it to rearrange the order on your contact form.

Simple Contact Form

Once you’re done, make sure to save your changes.

Add a Contact Form in a Sidebar Widget

Now that your form is created, you can add it to your site’s sidebar widget area.

Go to Appearance » Widgets and click on WPForms from the available widgets.

Drag the widget to the right side widget area. Next, select your form from the dropdown menu and click Save.

Add Widget to Sidebar

Once done, you can view your site to see the published form.

Here’s an example of how a contact form looks in our sidebar:

Contact Form Sidebar Widget

If you want, you can also add your contact form to your site’s posts or pages by going to the post or page you want to add it to and clicking the Add Form button.

Then, choose your contact form from the dropdown menu.

Add Form

Save the published post or page, and view your form.

You can also combine this contact form with our integrated email marketing services:

This allows you to automatically add all leads to your email marketing list. You can even add them into various marketing automation sequences from there.

Next Step: Generate More Leads

And there you have it! You now know how to add a contact form in a WordPress sidebar widget to get more leads.

Wondering where else you should put your contact form? Check out our recommended top 3 places to put your contact form. You can also create a contact form popup or even add a contact form to a slider.

So, what are you waiting for? Get started with the most powerful WordPress forms plugin today.

And don’t forget, if you like this article, then please follow us on Facebook and Twitter.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Comments

    1. Hi Vanusa,

      Your form’s font should, by default, inherit the fonts from your theme. If it’s not inheriting the fonts you’d like, though, you can customize this with a bit of custom CSS. Here’s an example that will change the font for any forms in a sidebar to Arial:

      .sidebar .wpforms-container { font-family: arial; }

      You can replace ‘Arial’ with any font you have available on your site. The easiest way to add this to your site is to use the built-in WordPress CSS editor. This takes just a few clicks, and there is a great video tutorial here.

      And here’s a W3 schools page with more information on how to use font-family in CSS, in case that’s helpful.

  1. How can I edit the format of the forms? At the moment the two boxes for name and number are squished onto one line. How can I space them over two lines in my sidebar?

    1. Hi Eddings!

      We have actually a great article on how to edit the form layout and turn a form into a multicolumn. So you can actually use this to change the layout to the single-column form.

      I hope this helps!

      Have a good one 🙂

    1. Hi Jessica!
      You can replace the Name field with two Single Line Text fields instead. This way you will be able to have them on different lines and also separate them in your notification email/ confirmation message by using the fields’ Smart Tags.
      I hope this helps.
      Have a good one 🙂

    1. Hi!
      You can assign it under Notification settings in the form builder. For more details please check out this article on our site.
      I hope this helps.
      Have a good one 🙂

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.