How do I add a floating invitation button in WordPress ? - Dr. Wordpress

A floating invitation button to take action button is one of the most important items to attract a visitor to participate (or purchase ! ) .

But if the button is in a fixed position on the page, it can sometimes disappear during browsing .

The floating button triggers action for a specific action. The button can be placed in a prominent position and held there while the page is scrolling.

We’ll use the Buttonizer plug-in for the Get Action (CTA) button .

Table of Contents

Buttonizer :

It has a lot of built-in functionality. So it’s easy to create buttons that take a visitor to a URL, start a conversation, phone call, SMS, post to social media, and more.

Today, we’ll go through the process of creating the CTA button that sends the visitor to another page on your site. Then, we’ll briefly look at some of the other options available for this component .

Install Buttonizer Assistant Software

When you log on to the WordPress Dashboard in the navigation bar, mouse click on the Plug-ins link and click“Add New” .

In the “Additional” box, we write the word “Buttonizer”.

When the plug-in is selected, we click the Install Now button.

Then the option to activate.

How to use Buttonizer to create a floating button

Within the left-side navigation column, we place our mouse over the “Buttonizer” link and click the “Buttonizer” link.

hen Buttonizer opens, it also opens the home page of your site in a separate panel. This is a preview so you can see what the call button for action on the site will look like.

By default, it displays two buttons in a group that we’ll delete one of, so we can focus on the configuration of one button .

The first thing we’ll do is click on the URL key icon to access the button’s basic settings .

Here you can set the button position, animation, style, movement, and whether the button appears on a desktop or mobile screen, or both. Let’s go through each of the options.

Location :

This puts the button at one corner of the site or in any custom location. When we change the position in the drop-down menu, we can see the button move in the preview pane.

A custom location is useful if you want to set a button, for example, in the middle of the side of the page. To do this, select Custom and then from the Position drop-down menu.

Then we set the value of “Y (%)” to50

In addition, you can see that the button has moved to the middle of the right side of the page. By changing the X and Y axis values, you can place the button wherever you want on the page.

Button movement :

There are two animation options in the free version of the plugin. They both run every 8 or 10 seconds to draw attention to the button.

The shape or style of the button :

The style changes the button from round (or default) to square or rectangular.

If you choose the rectangle, the button label will appear next to the button.

floating invitation button

Button action :

Action Action: This is where you choose what the button does.

We’re setting up a button to go to a page on the site, but as you can see, there are many other options .

Popular Action

Site Link
Call (phone number)
Mail (email address)
Chat on WhatsApp
Back up
Go back one page
social participation

Start a chat :

Chat on Messenger
SMS Short Messages
Facebook Messenger Link
Twitter DM
Skype
Font
telegram
WeChat
Viper

Social media :

Facebook
Twitter
Instagram
Snapchat
necdine
Vkontakte
Wiz

Actions :

Copy URL to clipboard
Print Page

Create Link Button :

Well, once we’ve done the basic setup, let’s just create our own button, and then we’ll look at some of the other things we can do with it .

I’m going to scroll “Animation,” so we’ll leave that set to “None .”
For the “rectangle” style, this way, when I add the label text to the button, it will appear as a single rectangle. The label text will also appear in the “default” style, but the text floats nearby in a separate container.
Button Action is the Web Site URL. I’ll enter the URL in the text field just below the Button Action drop-down menu.
I’ll leave the Open New Tab setting to stop by default and leave the Show on Mobile and Desktop settings running. This is what the configuration will look like when it’s all done :

Before we save the button,

we have to adjust the text we want to show next to the button.So let’s go down to the label section .

In the Classification field, we’ll enter the text and then you can see what it looks like by previewing.

If you want a larger font size, you can also specify it .

There are two types of “vision” settings, one for the desktop and one for the mobile.

These settings allow you to hide the label on your desktop screen, or show it when a visitor hovers over it.

You can also completely hide the label on mobile devices.

Because hiding the button text will not be a good idea (we don’t want to create the ambiguity button), we will leave both set to “always show label”.

Now I will click on the “Save and Publish” button, and the button will be visible on the website. When I scroll the page the button stays in position. No matter where the visitor is on a particular page, the button is always there with them.

Button Configuration Options :

We’ve already passed two things. Let’s check

Floating Invitation Button Colors :

Here you can change the button color to suit your site design. Choose “Base” or “Interaction” to openColor Gamut .The base is the natural color of the button .Interaction is the color to which the button will change when the visitor passes over it.

border diameter shape :

Controls the rotation of the button to a value between 1 and 50. When set to a value of 50, the button is rounded. The lower the number, the larger the button becomes .

In the figure we changed the “radius of the boundary” to 25, and you can see that the button turns into a square with rounded angles.

Button label color :

The label color setting controls the background and text colors if you display the button label. Also, the button icon section, the “button icon” section, is where you specify the graphic shape on the button.
By default, the main button uses a symbol. By default, the main button uses the font “fa-user” superb icon. You can select a different icon for your button. Click in the Symbol field to open the symbol selector .
You can also scroll through icons or search through keywords.

Click an icon in the selector, and your button icon will change.

The Symbol Color section allows you to choose different icon colors for both Baseline and Interaction. By changing the colors here and in the Button Color section, you can create some interesting effects .
The Symbol Size setting controls the size of the symbol in the button.

Other features Floating Invitation button

Button Work setting is where Buttonizer shows its capabilities.
Do you want to drop a floating WhatsApp button on your WordPress site?

Choose WhatsApp Chat in the action button, and enter your WhatsApp number, so you’re done.
Choose Social Sharing in the Action Button, and there is a wide range of social networking sites available. By adding buttons for each location you want visitors to participate in, you can create your own floating social sharing panel.

There are many options in Buttonizer, many of which are available when using the free version of the assistive software.
Often, paid-in plug-ins hide all their cool features from free users. But Buttonizer doesn’t.

Benefits of a floating invitation button call to induce action :

The benefits of a chat button that urges the user to take action or a click to connect button are clear. The “Previous Page” or “Back to Top” buttons are also phrases that urge the user to take action, though not in a marketing sense.

But they benefit visitors to your site in other ways.
Let’s face it, there’s a phrase that urges the user to take action primarily to benefit the site owner. It’s there to attract visitors to buy your product or interact with you directly (until they finally buy your product).

If the Get Action button or link is static at the bottom of a text page, many of your visitors will never see it. So the phrase “urged” floating or “pending” action has the advantage of always being visible. A visitor can take action at any time.

Buttonizer :

Install Buttonizer Assistant Software

Location :

Button movement :

The shape or style of the button :

Button action :

Popular Action

Start a chat :

Social media :

Actions :

Create Link Button :

Before we save the button,

Button Configuration Options :

border diameter shape :

Button label color :

Other features Floating Invitation button

Benefits of a floating invitation button call to induce action :

How to add a WooCommerce store to your WordPress blog ?

How to Create a Members Only WooCommerce Store ? (Step by Step)

Leave a Reply Cancel reply