fbpx

Table Of Contents

User Login widget

How to Use User Login Widget

In this documentation, I am going to show how the User Login widget works. The article below will shift you to a suitable place. I’ll include some instructions with pictures detailed.

So, just read and follow the instructions.

To Insert Widget

inserting User Login widget

Inserting the widget is just a matter of dragging and dropping. As you see in the screenshot above, drag the WordPress user login inside your page.

Content Tab

Using the Content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot in designing the Elementor login widget.

Now, I’m going to show the sections of the tab and how they work behind the widget.

Forms Layout

Mainly, this section will let you set different Skin (like Dropdown and Modal) with the default one.

Here, the Label switcher button will allow you to manage the label of the LogIn form. Just enable or disable the switcher button.

Another sub-section is Fields that lets you select the Form Input Size for the User Login widget.

Now, you, come to the Submit Button subsection. From there, you might add Text, set Size, and Alignment.

N.B: Notice that if you select another two skins (Modal, Dropdown) besides the default skin. Against each skin, you’ll find the corresponding section. As you see the following.

Modal Button

Go to the Content tab > Form Layout > Skin (Modal) > Modal Button. To get the login form seen on the screenshot above, you’ve to hit on the modal button like the marked button on the image.

Dropdown Button

The same things go to this section as the Modal Button section. Just, go to the Content tab > Form Layout > Skin (Dropdown) > Dropdown Button. Look at the screenshot below.

Additional Options

From this section, you can manipulate extra things adjacent to the Elementor login widget. Simply, enable and disable the switcher button.

Mostly, enable the switchers to Show Facebook Login and Show Google Login. And if you do so, you can go for the default skin.

Logged Dropdown Menu

If you set Modal or Dropdown skin instead of default one, you will get this section for the User Login widget.

Firstly, come to the Content tab > Form Layout > Dropdown or Modal. And, secondly, go to the Logged Dropdown Menu.

Thirdly, hit on every single repeater and edit as you fitted.

Finally, hit on the Update button, and after that click on the Preview button.


Style Tab

Now, let’s work with the Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design the WordPress user login. 

Styling with the tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Form Style

Go to the Style tab > Form Style > adjust Rows Gap > and add color to the Links, Links Hover, Checkbox, and Checkbox Active one by one.

Label

Come to Label > after that, adjust Spacing and Text color along with Typography.

Fields

Simply, go to the Style tab > Fields.

In the section, you might add Color, adjust Border type and radius, importantly Padding and Typography under the Normal mode.

In contrast, under the Focus mode, you can add Border color. Look at the screenshot above.

Submit Button

Just, go to the Style tab > Submit Button.

Here, under the mode Normal, you’ll be able to add Text color, Typography, and Background color to the Submit Button. See the photo above.

On the other hand, under the Hover mode, you might add Text color, Background color, and mostly Animation from the dropdown.

Logged Style(with Default Skin)

From this section, you might simply add color to Link and Link Hover. Just, come to Logged Style from the Style Tab.

Dropdown Style (with Dropdown and Modal Skin)

Look at the screenshot and work with the controls in Dropdown Style.

Video Assist

In Conclusion, though our User Login widget by Element Pack under Bdthemes contains some tricky parts, hopefully, in the end, you have got the things on how the widget works. You can stream the video clip above. And to get more ideas about this, visit the demo page.

SIGNUP NEWSLETTER

Don’t worry we hate spam and we promise you will get only quality news and offer from us.

Enjoy Black Friday Exciting Deals Right Now. Check Here
© Copyright 2021 All Rights Reserved by BdThemes

Enjoy Black Friday Exciting Deals Right Now. Grab The Deals Before The Time Ends!

Day
Hour
Min
Sec