“Saraagna | WordPress Login - Registration Popup Plugin” Documentation by “Hitesh Khunt” v1.0


“Saraagna | WordPress Login - Registration Popup Plugin”

Created: 26/04/2019
By: Hitesh Khunt
Email: [email protected]

Thank you for purchasing my wordpress plugin. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. Introduction
  2. Main Features
  3. Installation guide
  4. Getting started
  5. Sources and Credits

A) Introduction - top

WordPress Login/Signup Popup is a simple & light weight plugin which allow users to login/signup anywhere from the site with the simple pop up without refreshing page.

Everyone can use , because it’s fully automatic, and it’s compatible with all recent versions of wordpress!


B) Main Features - top


C) Installation guide - top

This part of the documentation is going to cover, in a step by step instruction the installation of WP Plugins on your WordPress blog in general.

  • Step 1. The most important task is to make certain you have an upto date backup of your blog! This is always a good thing, not necessarily so important for our plugin but in general.
  • Step 2. Log into your WordPress Admin area.
  • Step 3. Look down the left hand column for "Plugins" and then click on the word "Plugins".
  • Step 4. Just to the right of the title “(Manage) Plugins” in the image above, you can see a button marked "Add New", click this button.
Plugin Upload
  • Step 5. The image above shows the option to upload the plugin from your own PC, this is the wordpress-login-registration-popup.zip inside the zip you had previously downloaded from CodeCanyon. Install the zip and click on "Activate Plugin".

Plugin activation

Installibg by FTP

First, you need a tool for uploading plugin files to your site, you can use filemanager from cPanel or any FTP clients. Some good FTP clients :

Also WordPress codex contains instructions on how to do this here.


D) Getting started - top

The simple activation of the plugin is enough to have the desired behavior for all pages.

First Step of this plugin. please click on WP Popup setting on menu.

Main Setting

Setting TitleDescriptionDefaultPossible Values
Enable PopupCheck this option to automatically add the modal popup on wp_footer hook and toggle when element with wlrp-popup-open class has been clicked.offon|off
Automatically Show Popup First Time UserAutomatically Show Popup First Time User. After 1 day this conditiona apply for old user.offon|off
Which Section Show First Time UserWhich Section Show First Time User.LoginLogin|Signup
Enable AjaxLogin and Registaration with Ajax.offon|off
Enable Remember meEnable Remember me.offon|off
Enable Lost PasswordEnable Lost Password.offon|off
Popup LayoutSelect Login Registration Popup Layout.
Popup Max WidthSet Popup Maximum Width.820
Login Section Min HeightSet Login Section Min Height, It is used for Login, SignUp and Forgot Password section height is same. default : 440.440
Login/Registration Title StyleSelect Login/Registration Title Style.Center with Underline
Login/Registration Change AnimationEnable Login/Registration Change Animation.onon|off
Login/Registration Field StyleSelect Login/Registration Field Style.Full Border
Field PlaceholderEnable Field Placeholder. If you have Placeholder "ON" so field label is hide.offon|off
ShortcodeUse [wlrp-popup] to automatically display the login and registration box anywhere. [wlrp-popup skin="s1" max-width=""] Use Skin parameter for layout. skin value is s1,s2,s3,s4...
Helpful GuidesDid you know that you know that you can target specific type when you are opening the popup using menu link?
Simple add any of the following as URL or HREF value :

#wlrp-popup-login
#wlrp-popup-register
#wlrp-popup-password

if you set login link in menu so add Class "wlrp-popup-open" in menu "CSS Classes" Field. Follow this Link :Video

Default Popup Button
<a href="" class="wlrp-popup-open">Login/Signup</a>

Login Custome Button
<a href="#wlrp-popup-login" class="wlrp-popup-open">Login</a>

Registration Custome Button
<a href="#wlrp-popup-register" class="wlrp-popup-open">Signup</a>

Lost Password Custome Button
<a href="#wlrp-popup-password" class="wlrp-popup-open">Forgot Password</a>

Registration

Setting TitleDescriptionDefaultPossible Values
Enable RegistrationAllow customers to create an account.offon|off
First & Last Name DisplayFirst & Last Name Displayoffon|off
First & Last Name Field required?First & Last Name Field requiredoffon|off
Username FieldUsername Field. If you register with email only so off username field.onon|off
Confirm Password FieldDispaly Confirm Password Fieldoffon|off
Add Term and Condition TextAdd Term and Condition Text. Allow HTML Content.I agree to terms & conditions.
Registration Email MessageAdd Term and Condition Text. Allow HTML Content.
%USERNAME% will be replaced with a username
%BLOGNAME% will be replaced with the name of your blog.
%BLOGURL% will be replaced with the url of your blog.

Background

This Section for All 3 section background Image and Color Setting.

Setting TitleDescriptionDefaultPossible Values
Login Section Background ImageLogin Section Background ImageSelect from media Liabrary.
Login Section Background ColorSet Login Section background color.any color select on color picker
Background ImageBackground Image. It's left and right side section backgroung image.Select from media Liabrary.
Background Image SizeSelect Background Image Size. for Left and Right Side Image Setting.cover
Image Section Background ColorSet Main Section background color.any color select on color picker
Hide Background Section in MobileHide Background Section in Mobile. Mobile width consider < 768pxoffon|off
Min Height of background section for MobileSet Min Height of background section for Mobile. default : 250px. Mobile width consider < 768px250 px
Close Button Background ColorClose Button Background Color.any color select on color picker
Close Button ColorSet Close Button Color.any color select on color picker
Overlay Background ColorOverlay Background Color.any color select on color picker
Overlay Background ImageOverlay Background Image. it is called a transparent section.Select from media Liabrary.

Button

This Section for Login, Signup and Forgot Password Button.

Setting TitleDescriptionDefaultPossible Values
Button Corner Roundset Button Corner Roundoffon|off
Button Border ColorSet Login Signup Button Border Color.any color select on color picker
Button Background ColorSet Login Signup Button Background Color.any color select on color picker
Button Text ColorSet Login Signup Button Text Color.any color select on color picker
Button Border Hover ColorSet Login Signup Button Hover Border Color.any color select on color picker
Button Hover Background ColorSet Login Signup Button Hover Background Color.any color select on color picker
Button Hover Text ColorSet Login Signup Button Hover Text Color.any color select on color picker

Color/Font

Setting TitleDescriptionDefaultPossible Values
Login Signup Title Colorset Login Signup Title Colorany color select on color picker
Login Signup Title Active Colorset Login Signup Title Active Colorany color select on color picker
Login Signup Title Font SizeSet Login Signup Title font Size. Default: 22px.22
Field Title Text ColorField Title Text Colorany color select on color picker
Field Title Text Font SizeSet Field Title Text font Size. Default: 15px.15
Info Text ColorInfo Text Color. like: Reset Password, Registration Policy Text etc.any color select on color picker
Field Border ColorField Border Color. like: Username, Password, Email text field border color etc.any color select on color picker
Active Field Border ColorActive Field Border Color. like: Username, Password, Email text field border color.any color select on color picker
Field Text ColorField Text Color. like: Username, Password, Email text field enter text color.any color select on color picker
Field Background ColorField Background Color. like: Username, Password, Email text field Background color etc.any color select on color picker

Change Text

Login,Reset Password and Register Heading and Button Change Text

Setting TitleDescriptionDefaultPossible Values
Login Title TextChange Login Title Text. Default : Log InLog In
Reset Password Title TextChange Forgot Password Title Text. Default : Lost your Password?Lost your Password?
Register Title TextChange Register Title Text. Default : Sign UpSign Up
Login Button TextChange Login Button Text. Default : Log InLog In
Reset Password Button TextChange Reset Password Button Text. Default : Reset PasswordReset Password
Register Button TextChange Register Button Text. Default : RegisterRegister

Customization

Setting TitleDescriptionDefaultPossible Values
Add Content in Background Image SectionAdd Content in Background Image Section. Left Right Background Section. Allow HTML Content.
Add Content in Login Section HeaderAdd Content in Login Section Header.Allow HTML Content.
Add Content in Sign Up Section HeaderAdd Content in Sign Up Section Header.Allow HTML Content.
Add Content in Forgot Password Section HeaderAdd Content in Forgot Password Section Header.Allow HTML Content.
Add Content in Popup FooterAdd Content in Popup Footer. Allow HTML Content.
Custom CSSAdd Custom CSS code here to style the display on your preference.

Import/Export

Setting TitleDescriptionDefaultPossible Values
Import SettingSetting Import.
Export SettingExport Current Setting. If you Export Setting please one time refresh this page.

No CAPTCHA reCAPTCHA

Protect WooCommerce login registration and lost password form against spam using Google's No CAPTCHA reCAPTCHA.

Setting TitleDescriptionDefaultPossible Values
reCAPTCHA Keys
Site keyUsed for displaying the CAPTCHA. Grab it. Here
Secret keyUsed for communication between your site and Google. Grab it. Here
Display Settings
Login FormCheck to enable CAPTCHA in WooCommerce login formoffon|off
Registration FormCheck to enable CAPTCHA in WooCommerce registration formoffon|off
Lost Password FormCheck to enable CAPTCHA in WooCommerce lost password formoffon|off
General Settings
ThemeThe theme colour of the widget.LightLight|Dark
LanguageForces the widget to render in a specific languageAuto detectAll Language Dropdown

Redirect Setting

Setting TitleDescriptionDefaultPossible Values
Registration Redirects
Redirect After RegistrationAdd Full URL with protocol.
Logout Redirects
Logout URLAdd Full Logout URL with protocol..
User Role Based Login Redirects
User Role : SubscriberAdd Subscriber Login Redirect URL with protocol.
User Role : EditorAdd Editor Login Redirect URL with protocol.
User Role : ContributorAdd Contributor Login Redirect URL with protocol.
User Role : AuthorAdd Author Login Redirect URL with protocol.

E) Sources and Credits - top

I've used the following css files as listed.


Once again, thank you so much for purchasing this wordpress plugin. As I said at the beginning, I'd be glad to help you if you have any questions relating to this plugin. No guarantees, but I'll do my best to assist. If you have a more general question relating to the plugin on codecanyon, you might consider visiting the forums and asking your question in the "support" section.

Hitesh Khunt

Go To Table of Contents