Login/Signup Popup ( Inline Form + Woocommerce ) Shortcodes

Below, you’ll find a detailed guide on how to add the Login/Signup Popup ( Inline Form + Woocommerce ) Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Login/Signup Popup ( Inline Form + Woocommerce ) Plugin shortcodes not to show or not to work correctly.

Before starting, here is an overview of the Login/Signup Popup ( Inline Form + Woocommerce ) Plugin and the shortcodes it provides:

Plugin Icon
Login/Signup Popup ( Inline Form + Woocommerce )

"Login/Signup Popup (Inline Form + Woocommerce) is a user-friendly plugin that enables seamless login and signups on your WordPress site or Woocommerce store, all within a simple popup form."

★★★★☆ (157) Active Installs: 40000+ Tested with: 6.3.2 PHP Version: false
Included Shortcodes:
  • [xoo_el_action]
  • [xoo_el_inline_form]

[xoo_el_action] Shortcode

The Easy Login WooCommerce plugin shortcode is designed to simplify user login, registration, and password recovery. It creates a link or button for user actions. The shortcode accepts various parameters like ‘action’, ‘type’, ‘text’, and ‘redirect_to’. Depending on the user’s login status, it displays different text and links. For logged-in users, it can change to ‘my account’, ‘logout’, or hide the link. For guests, it triggers ‘login’, ‘register’, or ‘lost password’ actions. You can also customize the text and redirect link after login.

Shortcode: [xoo_el_action]

Parameters

Here is a list of all possible xoo_el_action shortcode parameters and attributes:

  • action – Determines the action, can be ‘login’, ‘register’, or ‘lost-password’.
  • type – Defines the type, similar to ‘action’, primarily used for ‘login’.
  • text – Specifies the text to be displayed on the button or link.
  • change_to – Determines what happens after login, can be ‘logout’, ‘myaccount’, or ‘hide’.
  • change_to_text – Defines the text to be displayed after login.
  • display – Defines how the action is displayed, can be ‘link’ or ‘button’.
  • redirect_to – Specifies the page to redirect to after the action.

Examples and Usage

Basic example – A shortcode that displays a login link. When the user is logged in, the link changes to a logout link.

[xoo_el_action type="login" change_to="logout"]

Advanced examples

Here, the shortcode displays a login button. If the user is logged in, the button changes to a ‘My Account’ link that redirects to the user’s WooCommerce account page.

[xoo_el_action type="login" display="button" change_to="myaccount"]

In this example, the shortcode displays a ‘Signup’ link for logged-out users. When the user is logged in, the link disappears.

[xoo_el_action type="register" change_to="hide"]

This shortcode displays a ‘Lost Password’ link for logged-out users. When the user is logged in, the link changes to a ‘Logout’ link. The logout link redirects the user to a custom URL after logging out.

[xoo_el_action type="lost-password" change_to="logout" redirect_to="https://yourwebsite.com/after-logout"]

PHP Function Code

In case you have difficulties debugging what causing issues with [xoo_el_action] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'xoo_el_action', array($this,'markup_shortcode') );

Shortcode PHP function:

function markup_shortcode($user_atts){

		$atts = shortcode_atts( array(
			'action' 			=> 'login', // For version < 1.3
			'type'				=> 'login',
			'text' 				=> '',
			'change_to' 		=> 'logout',
			'change_to_text' 	=> '',
			'display' 			=> 'link',
			'redirect_to' 		=> ''
		), $user_atts, 'xoo_el_action');


		$class = 'xoo-el-action-sc ';

		if( $atts['display'] === 'button' ){
			$class .= 'button btn ';
		}

		if( is_user_logged_in() ){

			$change_to_text = esc_html( $atts['change_to_text'] );

			if( $atts['change_to'] === 'myaccount' ) {
				$change_to_link = wc_get_page_permalink( 'myaccount' );
				$change_to_text =  !empty( $change_to_text ) ? $change_to_text : __('My account','easy-login-woocommerce');
			}
			else if( $atts['change_to'] === 'logout' ){
				$logout_link 	= !empty( $this->glSettings['m-red-logout'] ) ? $this->glSettings['m-red-logout'] : $_SERVER['REQUEST_URI'];
				$change_to_link = wp_logout_url( $logout_link );
				$change_to_text =  !empty( $change_to_text ) ? $change_to_text : __('Logout','easy-login-woocommerce');
			}
			else if( $atts['change_to'] === 'hide' ){
				return '';
			}
			else{
				$change_to_link = esc_html( $atts['change_to'] );
				$change_to_text =  !empty( $change_to_text ) ? $change_to_text : __('Logout','easy-login-woocommerce');
			}

			$html =  '<a href="'.$change_to_link.'" class="'.$class.'">'.$change_to_text.'</a>';
		}
		else{
			$action_type = isset( $user_atts['action'] ) ? $user_atts['action'] : $atts['type'];
			switch ( $action_type ) {
				case 'login':
					$class .= 'xoo-el-login-tgr';
					$text  	= __('Login','easy-login-woocommerce');
					break;

				case 'register':
					$class .= 'xoo-el-reg-tgr';
					$text  	= __('Signup','easy-login-woocommerce');
					break;

				case 'lost-password':
					$class .= 'xoo-el-lostpw-tgr';
					$text 	= __('Lost Password','easy-login-woocommerce');
					break;
				
				default:
					$class .= 'xoo-el-login-tgr';
					$text 	= __('Login','easy-login-woocommerce');
					break;
			}

			if( $atts['text'] ){
				$text = esc_html( $atts['text'] );
			}

			if( $atts['redirect_to'] === 'same' ){
				$redirect = $_SERVER['REQUEST_URI'];
			}
			elseif( $atts['redirect_to'] ){
				$redirect = $atts['redirect_to'];
			}
			else{
				$redirect = false;
			}

			$redirect = $redirect ? 'data-redirect="'.esc_url( $redirect ).'"' : '';

			$html = sprintf( '<a class="%1$s" %2$s>%3$s</a>', $class, $redirect, $text );

		}
		return $html;
	}

Code file location:

easy-login-woocommerce/easy-login-woocommerce/includes/class-xoo-el-frontend.php

[xoo_el_inline_form] Shortcode

The ‘Easy Login WooCommerce’ plugin shortcode, ‘xoo_el_inline_form’, creates an inline form for users to log in or register. It allows you to define the active tab and the tabs to display. If the user is already logged in, the form will not appear. The function ‘xoo_el_get_form’ generates the form based on the input arguments.

Shortcode: [xoo_el_inline_form]

Parameters

Here is a list of all possible xoo_el_inline_form shortcode parameters and attributes:

  • active – specifies the active tab on page load
  • tabs – determines which tabs (login, register) to display

Examples and Usage

Basic example – The basic usage of the shortcode for the Easy Login WooCommerce plugin. This basic example calls the login form.

[xoo_el_inline_form active="login" tabs="login"]

Advanced examples

Displaying both the login and registration form, with the login tab active by default:

[xoo_el_inline_form active="login" tabs="login,register"]

Displaying both the login and registration form, with the registration tab active by default:

[xoo_el_inline_form active="register" tabs="login,register"]

Displaying only the registration form:

[xoo_el_inline_form active="register" tabs="register"]

PHP Function Code

In case you have difficulties debugging what causing issues with [xoo_el_inline_form] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'xoo_el_inline_form', 'xoo_el_inline_form_shortcode' );

Shortcode PHP function:

function xoo_el_inline_form_shortcode($user_atts){

		$atts = shortcode_atts( array(
			'active' 	=> '',
			'tabs' 		=> 'login,register',
		), $user_atts, 'xoo_el_inline_form');

		$tabs 	= explode(',', $atts['tabs']);
		$active = isset( $user_atts['active'] ) ? $user_atts['active'] : $tabs[0];

		if( is_user_logged_in() ) return;

		$args = array(
			'form_active' 	=> $active,
			'return' 		=> true,
			'tabs' 			=> $tabs
		);
		
		return xoo_el_get_form( $args );

	}

Code file location:

easy-login-woocommerce/easy-login-woocommerce/includes/xoo-el-functions.php

Conclusion

Now that you’ve learned how to embed the Login/Signup Popup ( Inline Form + Woocommerce ) Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *