No results found. Try again with different words?
Search must be at least 3 characters.
- Using Spectra Heading Block
- Buttons
- Post Grid
- Content Timeline
- Social Share
- Google Map
- Add Testimonials to Your WordPress Website
- Info Box
- Team
- Icon List
- Price List
- Post Masonry
- Post Carousel
- Post Timeline
- Call To Action
- Advanced Columns
- Blockquote
- Marketing Button
- Gravity Form Styler
- Table Of Contents
- How-to Schema
- FAQ – Schema/ Accordion
- Inline Notice
- WP – Search
- Review Schema
- Lottie
- Taxonomy List
- Tabs Block
- How to Create Contact Forms for Your WordPress Website
- Star Rating
- Masonry Image Gallery
- Wireframe Blocks
- Spectra – Heading Block
- Spectra – Image Block
- Spectra – Buttons block
- ‘Translate Everything’ Feature in WPML
- Spectra – Container Block
- Spectra – Taxonomy Styling Options
- Spectra – Block Presets
- Image Gallery
- Counter Block
- Modal Block
- Registration Form Block
- Slider Block
- Custom CSS On Page Level
- Countdown Pro
- Designing Custom Navigation for Your Slider
- Instagram Feed
- Loop Builder
- Animations
- Using Spectra Login Form Block
- Global Block Style Extension
- How to Create Popups Using Spectra
- How to Add Custom Blocks Under Spectra Blocks
- Move Block Patterns from One Site to Another
- Getting Started with Grid Builder
- Adding a Newsletter Form to Your WordPress Site Footer
- How to Register High-Privileged Users on Your Website
- Section
- Troubleshooting – Icons missing from the blocks
- Spectra Patterns
- How to Set Multiple Column Fields in Contact Form 7 Styler of Spectra?
- Styling Checkbox / Radio / Acceptance control in Contact Form 7 Designer block of Spectra
- Unable to Style Checkbox / Radio Buttons / Acceptance Control using Contact Form 7 Styler of Spectra
- Tab Index – for multiple Gravity Forms
- How to Get Started with Spectra
- How to Exclude A Heading from Table of Contents?
- Spectra – Display Conditions for Blocks
- Installing and Importing Starter Templates
- How to Get Started with Spectra
- Manually Install Spectra via FTP
- Automatic Beta Updates for Spectra
- How to Rollback to Previous Spectra Versions
- How to Load Google Fonts Locally
- Activate the Spectra Pro License Key
- How to Install Spectra Pro Plugin
- Translate Spectra Strings using Loco Translate
- How to add a Transparent / Sticky header?
- How to Change the Site Logo?
- How to Change Global Styles?
- How to Disable Title on Posts, Pages?
- How to add a transparent/ sticky header for a single page/post?
- Change Header and Footer Patterns in Spectra One Theme
- Add Custom/Google Fonts In Spectra One
- How to reset global default styling?
- Manually Install Spectra One via FTP?
- Disable or Enable Header/Footer for Specific Pages/Posts
Using Spectra Login Form Block
On your WordPress website, you have the ability to share different types of content like blog posts, announcements, etc. This content can be seen by anyone who visits your website.
Now, imagine you have content that you want to display on your website like a giveaway post, but you only want it to be seen by a specific group of individuals, such as the regular visitors of your site.
To make this work, you can ask these people to join your website using Spectra’s Registration block and make their own accounts.
After they’ve done that, they will be registered as users and they can log into their accounts as logged-in users.
To help them get into their accounts, you can create a login form using Spectra’s login block.
And this document has all the important information about the Login Form block, explained in a detailed and clear way.
What is Login Form Block?
A login form block allows users to log in to a website. It typically consists of two input fields, one for the username and one for the password.
The user enters their credentials and clicks on a button to log into the website. The form is then processed by the website, and if the credentials are valid, the user will get logged in.
Here are some of the benefits of using a login form block:
- It is a simple and effective way for users to log in to a website.
- It is easy to add and is highly customizable.
- You can place the login form on any page or post it on your website.
- People can reset their password using the login block if required.
- People, who are not registered, can register using a related block – the registration block.
Most importantly, you can hide/display content to users based on their login state.
For example – You can hide or show a welcome video on your website only to people who are logged in.
How to Use the Login Form Block?
You can follow the below-enlisted steps on how to use the Login Form block in Spectra:
- Go to Spectra Dashboard > Block/Extension > Pro > Find Login Block. Check whether the ‘Login Form’ Block is enabled or not. If disabled, enable it.
- Once enabled, you can go to Page/Post and drag and drop the Login Form Block.
- Once you drop the login form block, you see a lot of options available inside general settings and style settings.
General Settings for the Login Form Block
Under the “General Settings” section of the Login Form Block, you’ll find options to customize the following things:
- Login Form
- Login Button
- Success/Error Message
- Redirects
- Google reCAPTCHA
Login Form:
In the “General Settings” section, you have the ability to fine-tune various aspects of the login form. You can personalize the placeholders for both the username and password fields, creating user-friendly cues that guide individuals while filling out the form.
Additionally, you can define the label for the “Forgot Password” link, ensuring that users easily understand its purpose.
For a cleaner design, there’s an option to toggle the visibility of icons associated with the login form. Moreover, you can incorporate a toggle button that reveals registration information.
Login Button
You can adjust the styling and text of the login button to ensure it aligns with your website’s theme.
Success/Error Message
You can customize the messages displayed to users upon successful login or encountering an error.
Redirects
You can set up redirection destinations after login, providing a seamless transition for users.
- Logged In Message Toggle Button: Enable this toggle to display the “Logged In Message” in place of this block on the front end when a user who is already logged in visits the page.
- Redirect After Login: Define the destination to which users will be directed after successfully logging in, ensuring a smooth transition to relevant content.
- Redirect After Logout: Set up the page or location users will be directed to upon logging out, enhancing the overall user experience.
Google reCAPTCHA
You can integrate Google’s reCAPTCHA security feature to enhance login form protection against spam and unauthorized access.
That’s it!
Then you can preview your Login Form on the front end to confirm that it looks as you want it to.
We hope this article has been helpful. If you have any questions, please feel free to leave a comment below.
We don't respond to the article feedback, we use it to improve our support content.