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:
"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."
- [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 loadtabs– 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.phpConclusion
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.
Leave a Reply