Luckily, I have found the perfect plugin for the job, Request Form for Zendesk. It allows you to add forms onto any post or page in WordPress and they are highly customizable. And it will even match your theme automatically.

Today, I will demonstrate how to use the Request Form for Zendesk plugin to add business forms in WordPress.

What Can I Use Request Form for Zendesk For?

This plugin is intended to help websites set up a method of contacting you or your staff. As a result, it can be used for a variety of purposes.

For instance, you can add Zendesk ticket forms so that customers can send support tickets to your staff. Each form is highly customizable, so you can ensure customers add the necessary information your team needs to solve the problem.

Zendesk contact forms can be used for a variety of other tasks outside of support.

Some businesses use contact forms to receive new requests from customers. For example, many home repair sites will allow customers to list the work they need to be done and the contractor can reply with their quote.

Of course, you could also use them for collecting information about your website. The only limitation is your creativity.

How to Use Request Form for Zendesk

Step 1: Install Request Form for Zendesk

Request Form for Zendesk is a contact form plugin for WordPress. Forms can include various elements like textboxes, number input, URL input, email field, checkboxes, drop-down boxes, date and time box (great for appointments), and more.

The plugin does require users to obtain a Zendesk API key, and there is a 14-day free trial you can use to test it out. However, once the trial runs out, you will need to pay for an account.

Let’s begin by installing the plugin.

Click on Plugins and select the Add New option on the left-hand admin panel.

Search for Request Form for Zendesk in the available search box. This will pull up additional plugins that you may find helpful.

Scroll down until you find the Request Form for Zendesk plugin and click on the “Install Now” button and activate the plugin for use.

Step 2: Obtain API Key

The plugin will not work without a Zendesk API key, which is why we are going to get one right now. All this requires is setting up a free account with Zendesk.

First, visit the Zendesk website and register for the 14-day free trial.  You will have to provide an email, phone number, and set up a password. You do not need to enter any credit card information during the sign-up process.

Note: Take note of the subdomain name you create. You will need this later on.

You will then need to verify your email to access your account. Once you are in your account, click on Settings Wheel, locate the Channels section, and select the API option.

Agree to the terms and conditions by checking the box and click on the “Get Started” button.

You have two options for API. The first is to allow agents to use their sign-in credentials and the second is to use an API token. It is recommended by Zendesk to use the token to protect agent credentials.

Enable API Token access by using the slider.

Click on the “Add API token” button.

Zendesk will now generate the API key. You can add a short description for the API key, which is helpful if you need multiple keys for different sites. The API Key is located underneath this. Copy the API key.

Note: You must copy the API key before clicking the “Save” button. Once, you click the button, the API key will disappear and you would need to generate a new one.

And finally, click on the “Save” button.

You should take this time to set up your Zendesk account. You will receive all of the information and inquiries the plugin collects from this account, however, that is not necessary for the plugin setup itself. So, you can skip it for now and come back later.

The API key is now ready for use, let’s head back to WordPress.

Step 3: Configure the Plugin

With the API key in hand, it is time to set up the plugin.

On the left-hand admin panel, click on Settings and select the Zendesk Form option.

At the top, you will see the Main Settings section. This is where you will enter all of your Zendesk information, which includes the API key, the email address you used during sign-up, and the Zendesk subdomain.

Enter all of the information and click on the “Save Changes” button.

Next is the Custom fields section. This allows you to create unique field options for customers to fill out. You can add a new field, or manage existing ones. And below this segment, you can group the custom fields you make.

The next two sections contain shortcode information. To add Zendesk forms in WordPress, you will have to enter the correct shortcode parameters. This can be somewhat tricky if you are putting the shortcode together yourself, but that isn’t necessary.

Instead, the plugin provides a Shortcode Generator section. In it, you can edit the elements you wish to add and the shortcode will be generated. If you do not want to use a specific element, leave it blank.

However, the shortcode generator has limitations. Underneath it, you will find a full list of shortcode options with detailed information on how to use each one. Using this will help you build your own Zendesk custom forms.

That concludes the settings of the plugin.

Step 4: Display the Request Form

All that is left is to copy the shortcode from the generator or to build your own and paste it on a page or post.

Go to any existing post or page that you wish to display the form on and add the shortcode via a shortcode block. Alternatively, you can create a new post or page.

It is recommended that businesses have a Contact Us page to help customers find the forms easily.

Once you paste the shortcode, you can view the form on the front end of your website.

Congratulations on setting up the Request Form for Zendesk plugin. Remember that once the trial runs out, you will need to purchase a Zendesk account to continue using it.

Make A Contact Us Page

Just about every website has a Contact Us page, and I’m not just talking about business pages. Most blogs even have these pages because they allow not just customers to contact them, but also potential partners and collaborators.

Having a professional contact form available on this page is a great choice. It shows all potential contacts that you are serious about their inquiries. And trust me, that makes a very big difference in some cases.

How easy did you find the Request Form for Zendesk plugin to use? Do you think WordPress should have a built-in contact form block?

The post How to Set Up a Request Form for Zendesk in WordPress appeared first on GreenGeeks.

As stated above, there are a lot of good form plugins that will allow you to create a customer contact form on your website. Really, the choice comes down to a lot of personal preference options. That being said, you need the right one in place to help people contact you easily.

Why Have a Contact Form on Your Website?

There are a couple of really good reasons to have a contact form in an easy-to-find area on your website. You want to be able to provide customers a way to contact you simply and easily.

You also want to have one to help boost conversions over the site. And forms are not relegated to simply contact. You can use them for discussions, questions and answers, selling products, and much more.

In this article, I am going to show you how to use HappyForms to easily add a form to your website. Let’s take a look at the plugin in question and see what all it has to offer.

HappyForms

HappyForms provides you with one of the easiest ways to build forms and communicate with your customers. The plugin provides a simple-to-use, drag-and-drop form builder for WordPress.

This means that you can easily add fields, switch them around, and build the form exactly how you want. All this without ever having to mess with any type of code. 

The HappyForms contact form for WordPress will allow you to build just about any type of form you can think of. This includes contact forms, lead generation, feedback, quotes, survey forms, and more. 

This plugin is so easy to use that we will have it set up and running in no time at all. It provides more conversions, reliable message delivery, no spam messages, free support even for the free version, and a live preview as you build it.

And this is just the start of the features. Other great features and tools the plugin gives you access to include:

• Drag-and-Drop Builder
• Gutenberg Friendly
• Easily Add Forms Anywhere
• Multiple Forms on the Same Page
• Duplicate Forms
• Mobile Responsive
• One-Click HoneyPot Spam Prevention
• 50 Style Controls
• GDPR Compliant
• Unlimited Forms
• Live Preview

Form Fields

It gives you everything you need to build fully responsive forms on your site. The free version will include the following:

• Short Answer
• Long Answer
• Email Address
• Multiple Choice
• Single Choice
• Dropdown
• Number

Let’s get the form plugin installed and set up so that you can start using it to build forms.

Note: There is a pro version of this plugin that gives you access to a lot more fields and features. If you think this is something you need, then feel free to check it out. The rest of this tutorial is based on the free version of the plugin.

Add a Contact Form Using HappyForms

Step 1: Install and Activate the Plugin 

Before you can add customer contact forms using the HappyForms plugin, you first need to install and activate it. You can do this by heading over to the Plugins page in the WordPress admin dashboard.

Simply use the search field that is available on the top-right of the page to search the plugin by name. Once you see it pop up, go ahead and install and activate it right from there.

Step 2: View the Sample Form

Now that the plugin is installed, it will provide you with a sample form to either use, view, or copy. You can take a look at that form by clicking on Forms > All Forms, located on the left side menu area of the dashboard. 

You can see that this is an available option in the menu because you have activated the plugin.

Feel free to view the default form and see how it is set up if you would like. From here, you can add your own using the fields that are included in the free version of the plugin.

Step 3: Add a New Form

Click on Forms > Add New, on the left menu area of the dashboard. 

This opens up a blank drag-and-drop builder for a form. From here you can start adding fields.

Step 4: Add Form Fields

You can now start adding fields to the form. To do so, click on the “Add a Field” button.

When you do, a dropdown menu will display showing you all the available fields.

Click on any of the fields you want to add to the form. Continue to add as many as you want.

Note: You will see a lot of grayed-out fields as well. These are only available for use if you have the pro version of the plugin.

Step 5: Drag and Drop Form Field Positions

When you have added form fields and set them up how you want, go ahead and drag and drop the fields where you want them to be.

You notice that the form preview is located on the right. You can see exactly how your HappyFrom will look on the front end of your website.

Step 6: Finish Setup and Styling

You can see that there are some other tabs to go through on the top-left of the form. These include:

• Build
• Setup
• Email
• Messages
• Style

These are the common tabs you will find on any form builder. Go ahead and go through them. Create a notification response, set up the email you want the form to go to, and style your forms how you want.

Note: You will notice a lot of grayed-out configurations. Again, you will need the pro version of the form plugin to access these.

Step 7: Add Form to Page

Now that your form is finished, you want to add it to a page. Simply copy the shortcode given for the form and place it on a page.

You can select any of the shortcodes from any form you built. You may also select multiple shortcodes to put more than one form on a page

Step 8: View the Live Form

Go ahead and publish the page you added the form to and then take a look at the live form on your site.

If you want to make any adjustments or styling changes, then visit the editor and make updates.

That’s it! You can use the steps above and create as many forms as you want.

Adding Form Using a Widget

The form you created with HappyForms can also be added to any widget area. Simply go to your widgets page, drag a text widget to the widget area you want the form to display on, and then add the shortcode to the text widget.

Your form will display automatically in the widget area. You can also do this as many times as you want with as many different forms as well

Final Thoughts 

Adding forms to your website allows for better conversions and gives your audience an easy way to contact you when needed.

I hope this tutorial was able to show you how easy it is to add forms to your site using the HappyForms plugin.

Have you been adding forms using a different plugin? What is your favorite form plugin?

The post How to Add a Contact Form to WordPress with HappyForms appeared first on GreenGeeks.

It is important to remember that while many WordPress form plugins are free, Gravity Forms is not. You will have to purchase a license from them in order to use the product.

That being said, you can demo Gravity Forms for free for 7-days and see if it is a fit for you.

It is also important to note that while the Gravity Forms WordPress plugin is a premium plugin, there are several great free plugin add-ons that can be used with it. I will show you some of those below.

This demo will give you access to all the functionality the plugin provides and allow you to build several different Gravity Forms examples that you can view and play with.

What is Gravity Forms?

Originally built for contact form creation, Gravity Forms has now morphed into a plugin that allows website owners to create a number of different forms that collect information. 

The plugin can be used for contact forms, employment information, calculators, post creation, products, donations, and payments. As of right now, the plugin gives you the ability to build just about any type of form imaginable. 

The premium version also comes with a ton of built-in add-on options that you will find in your account. From signature boxes to payment gateways, this plugin has it all.

Furthermore, this is an open-source plugin. All of the code included is unencrypted and easy to modify. There are also dozens and dozens of hooks and filters that allow you to customize without limits.

The form builder is written in PHP and uses many of the WordPress built-in functions and features to power the plugin. The setup also uses the very same MySQL database system as WordPress. The main difference is that it stores all forms and entries in its own tables.

How to Use Gravity Forms

Step 1: Install and Activate the Plugin

The Gravity Forms for WordPress plugin is installed and activated just like most other plugins. However, it will not be available as part of the Plugins library in the WordPress dashboard. 

Once you purchase a license, you will have access to everything. You simply go to your “Downloads” page and download the plugin to your machine.

Once the plugin is downloaded to your machine, head over to the website you want to install it on. Inside the dashboard, click on Plugins > Add New, located on the left menu area.

From here, click on the “Upload Plugin” button.

Now, click on the “Choose File” option that is displayed. Select the Gravity Forms plugin from your machine and upload it. 

Go ahead and activate it now.

Step 2: Enter License Key and Other Configurations

When you activate the plugin, you will automatically be taken to where you need to enter the info for the license key and select some other configurations.

Go ahead and do that now and click on the “Save” button.

Step 3: Add a New Form

At this point, Gravity Forms is installed and fully running. You can add a new form by clicking on Forms > New Form.

A popup box will appear. Add a form title and form description here and then click on the “Create Form” button.

From here, you can create any type of form you want. The entire interface is drag-and-drop. All the different fields have different servings you can manipulate and design once you drag them over. 

The fields you have available will differ based on whether or not you have installed any add-ons to the form builder or not.

Step 4: Add Form to Page

Now that you have created your first form and added all the fields and settings you want, it is time to place it on a page. Click on the Pages section of your dashboard and add a new page.

Once the editor is opened, click on the blue + symbol on the top left of the page to open all of the available blocks. Gravity Forms has its own block. You simply select that block and insert it into the page.

Once the block has been added, select the form you want to add from the dropdown menu.

Step 5: View the Form Live

Your form is published now. View it on the page you published it on and see if you want to make any changes.

That’s it! You have successfully started using Gravity Forms. You can build and design as many forms as you would like.

Free Gravity Forms Plugins 

Yes, as stated above, Gravity Forms is a premium plugin only. However, once you purchase it, you have access to a ton of high-end add-ons that help you create anything you want. 

There are also a few free add-on plugins that you can get in the plugins library that can help add functionality. If you type the term “Gravity Forms” into the search field on the Plugins page of your dashboard, you will see that dozens of add-ons pop up. 

Here are a few of my favorites to consider:

Gravity Forms Entries in Excel

Gravity Forms Entries in Excel allows you to easily export all entries from your forms directly to an Excel spreadsheet. It does this by using a unique and secure URL. There is no need to log in or create a user account for people. Just copy the URL, and give it to whoever needs it.

Multiple Columns for Gravity Forms

Multiple Columns for Gravity Forms will allow you to split all the Gravity Form elements into columns. Simple as that. The columns are implemented by three new elements (Row Start, Column Break, and Row End) which are introduced into the Gravity Forms administration area in a group labeled as Multiple Columns Fields.

Styles and Layouts for Gravity Forms

Styles and Layouts for Gravity Forms allows you to use the WordPress customizer to create beautiful styles and designs on your forms. You will be able to see all the design changes you make in real-time, so you will know exactly what the form is going to look like before you publish it.

Gravity Forms Premium Add-Ons

Once you purchase Gravity Forms for WordPress, you will notice that there are a lot of available premium add-ons that come with your account. Gravity Forms has three different license types:

• Basic: $59
• Pro: $159
• Elite: $259

Note: All of these are yearly subscriptions and need to be renewed every year.

The number of available add-ons in your account will vary based on your subscription tier. Depending on our tier, you can expect to see available elements like:

• ActiveCampaign
• AWeber
• Constant Contact
• GetResponse
• Mailchimp
• Agile CRM
• Freshbooks
• DropBox
• PayPal Commerce
• Pipe Video Recording
• Slack
• Stripe
• Trello
• Zoho CRM
• Signature
• Survey
• User Registration
• Webhooks

Again, these are just a few integrations and features of the massive library available when you purchase a license. 

You can use these add-ons in conjunction with the form system to really do a lot of different things right from your website.

Final Thoughts

Gravity Forms is arguably the very best WordPress forms plugin available today. Yes, you will have to purchase a license. But if you do, it will allow you to build and design any type of form you can imagine.

I hope this article was able to show you how much Gravity Forms can offer if you choose to take the leap.

What form plugin have you been using? Are you satisfied with it or would you like a change?

The post How to Improve Relations with Gravity Forms for WordPress appeared first on GreenGeeks.

Not only can this help match the rest of your website’s character, but it can also help make your forms more accessible. After all, using conversational forms gives you an opportunity to use simpler language, which is easier to understand.

Today, I will demonstrate how to to build conversational forms with the Tripetto plugin in WordPress.

Why Add A Conversational Tone in Forms

For some websites, it’s not appropriate to use a conversational tone. However, there are many it would suit quite well. It provides those websites with quite a few benefits.

It’s well documented that in most cases, visitors are more willing to provide information to other people instead of machines. While it is still a form, adding a conversational tone, adds a human element. As a result, some visitors are more willing to share.

If web developers are skilled enough, you can customize a form to respond in a more human-like way once data is entered. For example, let’s say you ask a visitor to enter their date of birth. It is possible to program a form to respond with the visitor’s zodiac sign.

Of course, this is a bit advanced and requires coding knowledge.

Without a doubt, the biggest advantage is using these forms to better match the nature of your website. It can feel really out of place when a casual blog starts running surveys that sound like they are from a law firm. Matching your website’s tone will help increase immersion and engagement.

How to Use Tripetto to Build Conversational Forms in WordPress

Step 1: Install Tripetto

Tripetto is a Typeform alternative that can help you easily and freely build forms for your website. Of course, unlike other form creators, Tripetto focuses on adding a conversational tone to websites, thus, it isn’t intended for websites that want a professional pitch.

That said, it is highly customizable and could easily work for just about every website. It offers users three form options that include Autoscroll, Chat, and Classic. Each of these provides a unique solution for websites and are easy to implement.

Let’s start by clicking on Plugins and selecting the Add New option on the left-hand admin panel.

Search for Tripetto in the available search box.

Scroll down until you find the Tripetto plugin and click on the “Install Now” button and activate the plugin for use.

Upon activation, you will be asked if you would like to receive features and security notifications. Feel free to either opt-in or skip it for now. It will not impact using the plugin.

Step 2: Creat a Tripetto Form

On the left-hand admin panel click on Tripetto. Here, you can get a quick overview of how your forms are doing. This includes things like the number of results.

Click on the “Start creating your first Tripetto form!” button.

This will open up the form builder. While it may look intimidating at first, it’s actually pretty easy to use.

Click on the Settings wheel at the top of the editor. This will allow you to enter a title, description, keywords, and select the language.

You should now decide what type of form you want to build. There are three options to choose from that include Autoscroll, Chat, and Classic. Pick the one that best suits your needs.

Note: You can actually change this at any time and the elements you add will automatically match the type. So don’t be afraid to change the type to see how different elements look.

You have two choices for the text within your form: test with logic and test without logic.

Test with logic allows you to create a set of conditions that will dictate how the form will respond to certain visitor inquiries. Test without logic is the basic form structure where you ask a question, they answer it, and the next item is presented.

Note: While you can customize the logic, it is done automatically. This is the simplest form and will display elements in the appropriate order. Any interactive elements must be filled in before the text advances.

Click on the mode you wish to use.

Note: You can once again change this at any time. However, I recommend testing all logic immediately as it can easily produce the wrong results.

Step 3: Add Elements

With the general options out of the way, you are ready to start adding elements to your form.

Form elements are easy to add. On the left-hand side of the editor, you should notice a green and orange button. The green button is what you press to add the beginning of the form, and the orange button is what you use to add the ending of the form.

In between these, you should notice a “+” button. this is how you add everything in between. You can add multiple elements in the middle.

Let’s start by clicking on the green button to set up the beginning.

Click on the text and add what visitors will see when they begin a form. Keep in mind the type of form you are building. In this example, I am choosing a Chat format, thus, I will make sure everything I add makes sense in that context.

On top of text, you can also add images, videos, and buttons to any element. That said, make sure it fits the form you are creating.

The orange button works identically to the green, but this should be your conclusion. a good way to end a form is to thank the visitor for their time and wish them a good day.

Of course, you are going to need elements in the middle. Click on the “+” button that separates the green and orange options.

These elements come in a variety of formats. You can choose what type of element it is by using the change type drop-down box.

Each element works differently, but they are all relatively simple and most can be mastered in under a minute. You can add as many elements as necessary by clicking the same “+” button.

Step 4: Add the Form

After your form is ready, simply, click on the share button. You can either use the URL link it provides or the WordPress shortcode.

Simply add either to the desired location on your website and it will appear.

Congratulations on setting up the Tripetto plugin in WordPress. You can use it to create as many forms as necessary.

Collect Information

Collecting information is an essential part of any business. The more you know about your userbase, the better the experience you can provide. This also helps identify what types of services, products, or content the user base is interested in.

Of course, it isn’t just for business use, you can also just ask fun questions. For instance, ask them what video game they are most excited about in the upcoming year. This can help you tailor content to the results.

What types of forms did you make? How easy did you find Tripetto to use?

The post How to Add a Conversational Tone to Forms with Tripetto in WordPress appeared first on GreenGeeks.

A floating contact form can appear in your sidebar area and be visible anywhere on your website. This makes it extremely useful when communication is necessary.

Today, I will demonstrate how to use the All-in-one Floating Contact Form plugin to accomplish this.

Who is a Floating Contact Form Useful For?

Not every WordPress website is going to need a floating contact form. You might get by just by adding a contact form to your nav menu. But, it doesn’t have that nice appearance a floating one can offer.

This is for websites that heavily rely on communication to receive work. For example, many graphic designers have their own website that acts as a portfolio. This is to help potential customers see their work and decide if they want to hire them.

They rely on receiving work orders to do business, which would make a floating contact form useful.

However, if you have a basic personal blog, this probably isn’t a feature you need. A normal contact page will suffice.

Not a Replacement for a Contact Us Page

If you are thinking you will not have to make a Contact Us page because you have a floating contact form, you are mistaken. This is not a substitute.

The Contact Us Page not only allows you to provide more information, but gives you a page to sell yourself to potential customers. The floating contact form will only allow visitors to leave their information and not display yours.

On top of this, having a picture of yourself visible really does a lot to remind visitors that you are a real person and not just some guy on the internet. Thus, a Contact Us page is one of the most important pages you should make.

Not to mention the fact that contact information can play a role in SEO as it’s part of expertise, authenticity and trustworthiness.

Installing All-in-one Floating Contact Form

All-in-one Floating Contact Form is a sticky contact form WordPress plugin. This means it delivers forms that stay on pages and posts. This is great for pushing products, services, or even social media accounts. Luckily, the plugin is really easy to set up and it has a lot of customization options.

Let’s start by clicking on Plugins and selecting the Add New option on the left-hand admin panel.

Search for All-in-one Floating Contact Form in the available search box. This will pull up additional plugins that you may find helpful.

Scroll down until you find the All-in-one Floating Contact Form plugin and click on the “Install Now” button and activate the plugin for use.

Upon activation, you will be asked if you want to receive notifications about upcoming features. These will be in the form of emails and are not required. So feel free to accept or skip.

After this, the plugin will display a popup with a video tutorial on how to use the plugin. I recommend watching it because it is very informative and it’s not even two minutes long.

Setting Up A Floating Contact Form

I was not lying about how simple this plugin is to use. And by default, it’s good enough for most websites. On the plugin’s settings page, you will find three sections, Contact Form Tab, Social Channels Tab, and General Settings.

Contact Form Tab

The Contact Form Tab is where we will start. This is what determines what will be included in the form and what it will look like.

By default, the contact form will ask for Name, Phone, Email, and a message. You can customize any of these elements by clicking on them. To the right of the element, you will see a required checkbox. simply check the box if that piece of information is required.

You can also rearrange the order by dragging the eight dot icon.

Next, you can change the appearance of the contact form button. By default it is purple, but you can change it to any color, just makes sure it is visible. You can also select the text and text color as well.

The rest of the settings are cosmetic as well. Go through them until you are satisfied. You can see what the button looks like in both desktop and mobile views on the right-hand side.

Social Channels Tab

The Social Channel Tab deals with everything social media related.

In the free version of the plugin, you are allowed to display two social media icons. If you want more, you will need to upgrade to the pro version.

There are 48 social media icons to choose from, and they look really good. Simply check the two that you want to display or more if you have the pro version

Underneath the icons, you can insert a link to your account or the account you want to link to. Make sure the information is correct.

Once, again, you can preview these changes by looking on the right-hand side.

General Settings

The general settings allow you to change how the buttons look and where it appears.

You can select one of eight different templates that change the design of the buttons.

Underneath the template selection, you can change the size and location of the buttons. Again, make sure to check it on the right-hand side preview.

Once you are satisfied, click on the “Save Changes” button.

View it in Action

You can now visit your website to see the floating contact form in action.

Congratulations on setting up the All-in-one Floating Contact Form plugin. You can change the settings at any time.

Make Sure It Is Visible

A big mistake beginners often make is adding features that are hard to see or read.

For example, if you happen to have a background color of purple, it would be really hard to see the purple contact form button. It is important to make sure everything you add looks like it belongs on the page and that it is easy to read.

Not only does this help ensure features are used more, it helps make your website more accessible. Oftentimes, new web developers forget about those with poor vision or vision impairment like color blindness.

Accessibility is key for any website.

Consider Other Communication Options

Depending on your website or business type, you may want to consider live chat options.

Luckily, WordPress has a lot of live chat plugins available. These can help customers communicate with you and your staff. The easier you make communication, the better the user experience you will create.

Another great way to communicate with people is through social media. Social networks like Facebook allow you to create business pages. You can use these to answer questions and provide contact information. The same is true for other platforms too, like Twitter.

Forums are another excellent option to consider. These let visitors ask questions and you or staff can answer them. On top of this, forums are a great way to build a community and encourage communication not only between business and customers but between customers and customers.

Why did you add a floating contact form to WordPress? Are there any other sticky side button contact form plugins you would recommend?

The post How to Show a Floating Contact Form on All WordPress Posts appeared first on GreenGeeks.

Allow me to introduce another plugin to consider when you’re looking for a contact form to use in WordPress, Everest Forms. If you’re the “Just give me a form that works” type, there are templates for you. If you have specific needs, you can build a form from scratch.

There’s something for everyone.

Since the dawn of time, humans have been all about communication. And since the dawn of the web, much of that communication has come about through the use of contact forms. Just try to think of another early web technology that we still use as much as we use contact forms. It’s not easy.

Well, outside of email anyway.

Image maps? Frames? ? No. Just…no.

But every website still needs a contact form.

You already know the basics, so let’s get to the specifics.

Installing the Everest Forms WordPress Plugin

Log in to your WordPress admin panel.

In the left column navigation, mouse over the “Plugins” link and click the “Add New” link.

In the “Search plugins…” box, enter “Everest Forms.”

Once you have located the plugin, click the “Install Now” button.

When the plugin has been installed, click the “Activate” button.

Using Everest Forms

After activating the plugin, you should be redirected to a “Welcome to Everest Forms” page in WordPress admin. The welcome page contains a video, a link to in-depth Everest Forms documentation, and a link to create your first form.

We’re not going to use anything on that page (though you may want to bookmark the “Read The Full Guide” URL).

In the left column navigation, mouse over the “Everest Forms” link and click the “All Forms” link.

As you can see, a form has already been created by the plugin.

Configuring the Default Form

Click the “Edit” link.

The form is on the right, and the available drag and drop field additions are on the left.

The field options that are greyed out are not available in the free version of the plugin.

Drag the field that you want to add from left to right.

Then customize the field on the left side.

The available Field Options vary depending on the field type.

Advanced Options

• Placeholder Text – text that appears in the field before the user enters anything. Usually used to show an example, the preferred format, or other instructions or suggestions.
• Hide Label – checking this box hides the field label from the user.
• Default Value – is similar to placeholder text, but you can choose a variable from the list to insert. If you select a default value, it will replace any placeholder text.
• CSS Classes – if you want to make a field visually different from the rest of the fields on the form, you can enter CSS here that will only apply to this field.
• Input Mask – if you need the input to follow a specific format, you can force the user to follow it by using an input mask. You can find more details from the Everest Forms documentation.

Click the “Save” button to save any changes or additions.

Creating a New Form

In the left column navigation, mouse over the “Everest Forms” link and click the “Add New” link.

The first page is where you name the form and choose to start with a blank form or use the basic contact template. Since we already saw that basic contact form template (that’s what the demo contact form was), we’ll start from scratch.

Now you can see that we’re back to the same layout as before. The form is on the right, and the available drag and drop field additions are on the left.

One thing worth noting is the row format on the right, in the blank template. By default, it creates a row with two fields.

That might be useful for forms with a lot of short fields. But more often than not, you’ll want one field per row. Here’s how you change that.

Mouse over the row, and you’ll see two icons pop up: a trash can (delete), and a pencil (edit). Click the pencil.

A “Row Settings” popup will appear. Click the single field row image on the left.

That results in a single field row.

Now you can drag your fields over and edit them.

To add fields, you can either click the “Add Row” button for a new row or drag a field into an existing one.

Displaying a Form on a Page or in a Post

After you’ve created a form, you place it onto a page or post using a shortcode. The shortcode is created when the form is created, in this format: “[everest_form id=”1363″].”

You can find the shortcode in the list of forms:

You can also find the shortcode directly from the editing screen of the form itself.

Copy the shortcode, open a shortcode block in a new or existing page or post, and paste in the shortcode. (If you’re using the classic WordPress editor, paste the shortcode into the page or post wherever you want it to appear.)

The Gutenberg Block

If you are using the WordPress Gutenberg editor, there’s an easier way to insert a form into a page or post.

The plugin creates an “Everest Forms” block you can find in the Widgets section.

Just click it and choose which form you want to insert from a dropdown menu.

Viewing Form Responses

In the left column navigation, mouse over the “Everest Forms” link and click the “Entries” link.

By default, the responses to the first form in your list are displayed. To see responses from another form, select it from the dropdown and click the “Filter” button.

Click the “View” link to see the form response.

Downloading Form Responses

Viewing responses one by one is okay if you aren’t dealing with a lot of messages. But if you do have a lot of responses, you can download all of them in a CSV file.

Click the “Export CSV” button.

There’s More to Everest Than Meets the Eye

This is an introductory tutorial, so we’ve only covered the fundamental functions of the plugin. But as you become more familiar with Everest, you’ll uncover more features that can take your forms to the next level.

There are also some cool add-ons available, but they all require upgrading to the paid version of the plugin, so I won’t cover them here. To see them, mouse over the “Everest Forms” link in the plugin navigation and click the “Add-ons” link.

To me, the benefit of a plugin like Everest Forms is that it stores the form responses in the WordPress database. That’s preferable to using a simpler snippet of form code that can only email responses to an address. This is additionally helpful in a team environment when you need multiple people to see the responses.

You can write code to access the responses in the database, or even work out integrations to other applications.

I’m not going to ask if you use a contact form, because I know that you do. 😉 But do you use a form that stores responses in a database, or one that emails responses? Can you see any benefit to having form responses in a database? Let me know in the comments.

The post How to Make Forms in WordPress with Everest Forms appeared first on GreenGeeks.

This is a simple addition that allows you to show information like an email address, phone number, fax number, address, social media profiles, and more.

Displaying this type of information is essential for business opportunities and customer convenience.

Today, I will demonstrate how to add a WordPress contact widget by using the Contact Information Widget plugin.

Why Add Contact Information?

Depending on the nature of your website, giving visitors the ability to contact you may be vital.

For example, if you are a freelance writer, it is quite common for customers to contact you through email. Thus, displaying that information on your website is essential for success.

However, there are plenty of other reasons.

If you own a physical location, your website is most likely intended to help people find where you are. Thus, displaying your address is imperative and you can even go a step further by using Google Maps.

How to Add Your Contact Information in the Sidebar

Contact Information Widget is a simple plugin that adds a new widget to WordPress. This widget allows you to display your contact information including the company name, address, phone number, and email address.

There’s not much to it, but it’s a great way to display your contact information in the sidebar.

Step 1: Install Contact Information Widget

Click on Plugins and select the Add New option on the left-hand admin panel.

Search for Contact Information Widget in the available search box. This will pull up additional plugins that you may find helpful.

Scroll down until you find the Contact Information Widget plugin. This tutorial is for the one created by Shital Marakana. It has over 5,000 active installs.

Click on the “Install Now” button and activate it for use.

Step 2: Add the Contact Information Widget

First, go to the widget area of WordPress. To do this, click on Appearance and select the widgets option. Once inside, you simply need to pick the widget area you want to use.

I am picking the sidebar in this case, but the process is identical for any widget section.

Simply click the “+” button and search for the Contact Information Widget. Click on it to add it to the sidebar.

Step 3: Enter Your Contact Information

All you need to do is now fill in the widget. You’ll be able to enter a title, which should probably be “Contact Information” for clarity, company name, address, phone number, and email address.

After you are done, click on the “Update” button on the top right to save the changes. Afterward, you can check to see the widget on your website.

Congratulations on learning how to add your contact information to the sidebar of your WordPress website. You can revisit this widget area to update the information as needed.

Note: If you want to provide multiple contacts, you can add the same widget to the same area and fill it in with different information. You can help differentiate the two of them by changing the titles of each to reflect whose info it is.

Can I Add A Contact Widget to the Footer of My Theme?

Absolutely. But not all themes have a footer area. If your theme contains a footer area, you’ll see it in the widget section labeled Footer like so:

And then just like in the tutorial, add the Contact Widget into the area and customize it for use.

If you do not have a footer area on your website, then you would need to change your theme. The good news is that most modern WordPress themes offer users a footer area for widgets.

Other Contact Widget Plugins to Try

While the Contact Information Widget is a great option, there are no shortages of awesome alternatives you can try.

Here are a couple of options that you may consider using if you would like something else:

Contact Widgets For Elementor

If you are one of the millions of users that have built a website using Elementor, then you should install the Contact Widgets for Elementor plugin. It offers you everything you could want.

Of course, since this is an add-on for Elementor, you will need Elementor installed to use it.

With it, you’ll be able to add six options to a contact widget. They include WhatsApp, SMS, Email, Facebook, Phone, and Waze. Each one allows you to enter your business information so customers can use the platform of their choice to contact you.

Design-wise, you’ll have a ton of customization from the way each item appears to writing a custom description for each. For instance, you could add if your phone services are available for a certain time.

Benefits of Using Contact Widget for Elementor

• Includes the official icons of each platform
• The Pro version allows you to make any file downloadable
• Customizing the widgets is easy

Contact Information Widget

Now I know what you are thinking, this is the same plugin as the tutorial. And yes, they have the same name, but they are actually separate plugins. The Contact Information Widget is a great alternative.

And that’s because it works very similarly to the original plugin.

You’ll be able to enter the information you want into the plugin into their own fields. These include things like business name, location, phone number, fax number, email, and you can even include a Google Maps link.

Each field has an icon associated with it, but you can freely change these by editing the appropriate CSS. Ultimately, it’s a simple plugin to use that meets the needs of any website looking to add contact information to a widget area.

Benefits of Using Contact Information Widget

• Allows users to include as much or as little information as they wish
• You can modify the code to change the order of the items
• Completely free to use (no Pro version)

Create An Email Address Specifically For This

Unfortunately, providing your contact information can leave you wide open to spam bots.

This is especially true for any email address. For this reason, you should make sure the email you include is for business only. Using your personal address not only looks unprofessional, but bots will just flood it with spam.

The best options are to use your real name as the email address, or your company name.

Make Yourself Available

The entire point of displaying your contact information is so visitors can actually contact you. Thus, you need to make sure you regularly check what is posted.

You do not want to miss a customer’s email or phone call. Odds are if you miss it once, you will never hear from them again. You should also consider adding some social media icons as well.

These will help your visitors connect with you on the various platforms you are located on. Of course, that does mean you should take the time to actually build those profiles up to make them worth following, to begin with.

In any event, I hope this tutorial was helpful.

How long did it take you to add your contact information on WordPress? Did you display a map on your sidebar?

The post How to Add a WordPress Contact Widget in the Sidebar appeared first on GreenGeeks.

This gives the visitor a chance to stay on the page and finish without losing his or her information.

Think about it, how often does the confirmation to “stay” or “leave” save you when accidentally leaving a post you’ve spent hours creating? I know I cannot count the number of times WordPress has saved me time and effort because I accidentally clicked on something.

In this tutorial, I’ll show you how to create a confirm navigation popup plugin in WordPress. Don’t worry, it’s relatively easy and straightforward. In fact, you don’t need to know a lot about coding for this to work.

Creating Your Popup for Navigation Confirmation Plugin

Plugins are arguably the bread and butter of WordPress. They expand what you can do on the site and often boost engagement from your visitors.

Today, you’ll build a small plugin of your own to show an empty form confirmation.

Creating confirm_leave.php

The confirm_leave.php file is what will drive this plugin. First, create a new folder on your computer called, “confirm-leaving-form.”

Now you’ll create a new file inside this folder. Open a plain text editor application from your computer. For example, Windows users have Notepad.

Paste the following code in your text editor (replace “ggexample.com” with your domain):[ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]<?php
/**
* Confirm Leaving
* Plugin Name: Confirm Leaving Form
* Plugin URI: https://www.ggexample.com
* Description: This plugin shows a warning to users when try they forget to hit submit button on a comment form.
* Version: 1.0.0
* Author: Your Name or Business
* Author URI: https://www.ggexample.com
* License: GPL-2.0+
* License URI: https://www.gnu.org/licenses/gpl-2.0.txt
*/

function wpb_confirm_leaving_js() {

wp_enqueue_script( ‘Confirm Leaving Form’, plugins_url( ‘js/confirm-leaving.js’, __FILE__ ), array(‘jquery’), ‘1.0.0’, true );
}
add_action(‘wp_enqueue_scripts’, ‘wpb_confirm_leaving_js’); [/ht_message]

Save this file as “confirm-leaving.php” in your folder.

When saving a PHP file in applications like Notepad, don’t forget to change the “Save as file type” to “All Files.” Otherwise, you’ll create a text document and not a PHP file. This will cause the plugin to fail when trying to add it to WordPress.

Creating the JavaScript for the Confirmation Plugin

Now we need some JavaScript to control incomplete form confirmation in WordPress. Without it, the above PHP file is useless.

Create a new folder inside the one above and call it “js.”

Create a new text document and paste this code into it:[ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]jQuery(document).ready(function($) {

$(document).ready(function() {
needToConfirm = false;
window.onbeforeunload = askConfirm;
});

function askConfirm() {
if (needToConfirm) {
// Put your custom message here
return “Leaving so soon? Your data will be lost if you continue.”;
}
}

$(“#commentform”).change(function() {
needToConfirm = true;
});

})[/ht_message]

This particular code focuses on the comment section of your site. This segment is located in the code as “#commentform.” To add other forms to this code, you’ll need the form ID of each and place them in the JavaScript coding. I’ll cover a bit of that in a second.

Save this file in the “js” folder you created as “confirm-leaving.js.”

Adding Confirm Leaving Form to WordPress

Now we have our small plugin ready to help WordPress with confirming navigation from forms. All that’s left is to add it to the site and activate it.

To upload it to your site, you’ll need to use an FTP application like FileZilla. This connects your computer directly to your website and gives you access to all of its resources.

Upload the confirm-leaving-form folder to the “/wp-content/plugins/” directory of your website.

Go to the plugins section of WordPress on your website.

Find your new plugin and click the “Activate” link.

Now users will get a message when not submitting data from the comment form.

Adding Other Form IDs to JavaScript

The comment section probably isn’t the only form you’ll use on your website. What about adding others? What if you have contact forms you want people to submit before leaving?

For this, you’ll need the Form ID of each that you want to add. For this tutorial, I’m just using a very basic page using Contact Form by WPForms.

Go to your form’s page and “inspect” the element. You can do this in a number of ways. Since I am using PC, I simply right-clicked the form area and clicked inspect. MAC users will use Command+Click.

Look for the form ID within the code. It will start with “<form”. Unfortunately, every form creation plugin is different. This means you’ll have to dig around a bit to find the correct ID of the form you wish to include.

As you can see from the image, my ID is “wpforms-form-1835.” I get this from the ID= portion of the code. Look in an area like this to find your form’s ID.

Input your form ID into the JavaScript coding. You do this by using a “#” and then the ID. For instance, the segment of JavaScript I would use looks like this:[ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]$(“#commentform,#wpforms-form-1835”).change(function() {[/ht_message]
This tells WordPress to launch the popup for both the comment section and the contact form. Be sure to separate each form by using a comma.

Make it Easier on Guests

Incomplete form confirmations in WordPress help people remember to submit data or prevent losing it by accidentally clicking something wrong. It’s just one of those minor improvements visitors appreciate and often take for granted. Give your guests the best experience possible and help keep their attention on forms they start to complete.

How often do you use actual code to make modifications to your WordPress website? How many forms do you have available for visitors to fill out?

The post How to Create a Popup for Incomplete Form Confirmation in WordPress appeared first on GreenGeeks.

To get the most out of this plugin, it’s best to learn how to customize your forms. Forms can be edited in many ways, the easiest is the use of custom CSS code. Therefore, editing the CSS makes the customization possibilities almost endless.

Today, I’ll demonstrate how to customize your forms in WordPress using the Contact Form 7 plugin.

Why Customize Your Website’s Forms

Design choices are one of the most important decisions a web developer can make. Many visitors will judge a website by its appearance, which can be bad for websites that don’t take design seriously.

Design choices range from the theme you install to the font you use. Forms are just as important to customize because visitors interact with them directly.

Forms are used to collect information from your visitors. And these could include things like account creation, email subscriptions, job applications, services, opinion polls, and much more. To clarify, they’re essential in helping you learn more about your community and linking your visitors to your website.

How to Customize Contact Form 7 in WordPress

There are a lot of design choices available for Contact Form 7 forms. Changes can be made using custom CSS in WordPress, but that’s not the only way.

You can also use a second plugin called Contact Form 7 Style, an add-on plugin for Contact Form 7. It has form templates that make it easy to customize a form without writing any code.

Step 1: Install Contact Form 7

If you are not interested in using the CSS method, you should also take the time to download the Contact Form 7 Style plugin. Since it is an add-on plugin, you will need to download both.

Let’s start by clicking on Plugins and selecting the Add New option on the left-hand admin panel.

Search for Contact Form 7 in the available search box. This will pull up additional plugins that you may find helpful.

Scroll down until you find the Contact Form 7 plugin and click the “Install Now” button and activate the plugin for use.

Step 2: Create a Form

Before you can use custom CSS to customize your form, obviously you need to create a form. The plugin allows you to create a form and then use a shortcode to display the form on pages and posts on your website.

In the left-hand admin panel, click on Contact and select the Contact Forms option. As a result, this will pull up the main settings page.

Feel free to make a new form that meets your needs, but I will be using the default form as an example. Copy the shortcode for the form you would like to use.

Paste the shortcode where you would like to display it. Now that your form is created and in position, it is time to customize it.

Step 3: Custom CSS Method

Adding custom CSS is easy in WordPress. Even if you don’t know CSS, you can find plenty of examples of different form designs all over the internet that can be copied to your website.

Above all, make sure to keep an eye out for any syntax errors. These can cause errors and have unexpected results on your pages. If you are not familiar with CSS, a good thing way to check is to use a subdomain as a testing environment.

In fact, this is recommended for any major change made to your website. It’s a really good technique to utilize.

In the left-hand admin panel, click on Appearance and select the Customize option.

Click the Additional CSS option on the left side. Here you can add custom CSS to your website. Here is an example, copy and paste the following code into the Additional CSS box:  [ht_message mstyle=”info” title=”” show_icon=”” id=”” class=”” style=”” ]div.wpcf7 {
background-color: #fbefde;
border: 1px solid #f28f27;
padding:20px;
}
.wpcf7 input[type=”text”],
.wpcf7 input[type=”email”],
.wpcf7 textarea {
background:#725f4c;
color:#FFF;
font-family:lora, sans-serif;
font-style:italic;
}
.wpcf7 input[type=”submit”],
.wpcf7 input[type=”button”] {
background-color:#725f4c;
width:100%;
text-align:center;
text-transform:uppercase;
}[/ht_message]

Click the “Publish” button to apply the custom CSS.

You can now view your form on your website to see the changes. Custom CSS is a very powerful tool when it comes to WordPress site design. You can always update and make changes to the CSS. In other words, you can change things like colors, margins, and fonts.

If you are not familiar with CSS, remember that you use HTML codes to select a color. This is in the form of #FFFFFF, hexadecimal format, and there are plenty of resources available to find the color you want. Also, this means you can use most image editing apps to find the hexadecimal color you want to use.

Step 4: Custom Forms 7 Style Method

NOTE: Contact Form 7 Style Plugin has been removed from the WordPress repository. We’ll update this tutorial as soon as we can. We apologize for any inconvenience this may have caused.

Install and activate the Contact Form 7 Style plugin.

This plugin offers you two options to style forms. The first and easiest to use are the premade forms. These include festive and professional templates you can choose from.

Go to a form that you want to edit. You should see a new Contact Form 7 Style Template tab that was added to the plugin. Click it.

Now, you can choose which template to use on your form. You can change this at any time.

The second method is to create a new template. In the left-hand admin panel, click Contact Style and select the Add New option.

The Contact Form 7 Style plugin page has a very detailed demo video on how to style a form. You can change the margins, background color, border color, button color, text box color, and much more. So, the plugin is very useful if you’re not familiar with CSS.

Function Over Style

While I did mention the importance of appearance to customers, sometimes there is such thing as too much. And some beginners may even make their forms hard to read as a result.

For instance, you might want to be creative and use unusual colors for your forms, and that can work most of the time. However, there are instances where you might make it hard or impossible for some visitors to read.

For example, many beginners fail to account for color-blind users. That’s right, you may think you’re being really clever by using unique colors, but they may be hard to read for these individuals, which account for 5 to 10% of the US population.

Of course, sometimes you can just make forms that are hard to read for the average person. Therefore, I highly recommend having another individual look at any form before publishing them.

Create Awesome Forms for Your Website

Forms are critical for collecting visitor information, and making them look good can be a challenge. In reality, some key rules should include creating forms that match your website’s theme. It doesn’t look good when colors do not match each other.

And bad design could potentially drive visitors away from your website.

In short, forms are not the only thing you should be concerned with. You can customize every aspect of your website to make them all blend well together. However, just throwing a bunch of good design elements into the mix is not enough. They need to feel connected and it can be quite a challenge.

Which method have you used? What style have you chosen to use?

The post How to Customize Contact Form 7 Forms in WordPress appeared first on GreenGeeks.

Unfortunately, some of the live features were removed when Microsoft acquired Skype. So instead of showing whether users are online or available, you’ll only have the ability to display the basic button to start a chat or call in most cases.

In this tutorial, I’ll show you how to add a Skype button in WordPress to help drive sales and leads. Skype is among the best productivity apps for any small business, and including it may prove to be invaluable.

Setting Up the Skype Contact Me Button

Adding the Contact Me button from Skype is relatively simple. It relies primarily on the name of your Skype account. Then, users can click to chat or call directly from your website.

Visit the Skype Contact Me Button page.

Setting Up Your Skype Contact Button

Scroll down and fill in your Skype account name.

As soon as you begin typing, the web-based app will begin building the JavaScript coding for your website.

Customize the button with either call, chat or both.

Choose the look of your button. Currently, you only have access to blue or white for color. However, the size can range from 10 to 32 pixels.

Copy the code from the window below the preview of the button.

This code is usable in nearly any location of WordPress that accepts JavaScript. For example, you can easily place it in posts, pages or directly into nav bars of your theme.

Placing the Code in a Sidebar Widget

For the sake of argument, let’s say you want to put the contact button on your WordPress website in a sidebar widget.

From the WordPress admin screen, go to Appearance and click, “Widgets.”

Drag and drop a Text widget into your sidebar.

Click the tab to select the “Text” editor in the widget. This may already be selected, but it’s always a good idea to make sure.

Paste the code you got earlier from Skype.

Click the “Save” button in the bottom right corner.

Your site will then have a Skype button in the sidebar.

Plugins for Skype

Unfortunately, changes from Microsoft has hindered some of the best Skype plugins for WordPress. In fact, many of them are no longer supported and do not work as they were designed.

However, the Skype Live Chat Messenger plugin does have potential to engage visitors. It’s a basic plugin you install that doesn’t have a lot of custom features, but it does deliver a chat window users can operate in order to send you text messages.

Perhaps the best way to include a Skype call widget is to simply use the button creator I demonstrated earlier directly from the Skype website. It’s easy to set up and use without worrying about installing outdated plugins that do not work.

Communication is Important

It’s vital you include methods that allow visitors to contact you directly. In fact, studies show how offering various methods of communication further engages consumers. Even using chatbots can deliver a better experience for visitors. Open the lines of communication and increase your sales and leads.

Have you found a valid and working Skype button plugin you’d like to share? How often do you chat live from your website?

The post How to Show Skype Status and Contact Info in WordPress appeared first on GreenGeeks.