'Login' value for non logged user and 'Log Out' value for logged in user

Question

I have a 'Login' call to action javascript button. My button is working with javascript for to action login and registration. The button code has a value called Login. So the button is always displaying the Login text as a button name all time.

I want-

• Logged out users/visitors will see the button name 'Login'
• Logged in users will see the button name 'Log Out' with log out action.

Can you please fix by editing my code?

See my code:

<input type="button" style="background-color: red" value="Login" data-reveal-id="tmpl_reg_login_container" href="javascript:void(0);" onclick="tmpl_login_frm();"><aside id="sidebar-contact_page_sidebar" class="sidebar large-3 small-12 columns">

Answer 1

if you use this small piece of php code around your login button, it will use different code/show a different button when the user is logged in or is not logged in.

Please note the changed values and the echoed strings above button echo

see wordpress codex reference link for more information https://codex.wordpress.org/Function_Reference/is_user_logged_in

<?php
    if ( is_user_logged_in() ) {
        echo 'user is logged in, show logout button';
        echo '<input type="button" style="background-color: red" value="Logout" data-reveal-id="tmpl_reg_login_container" href="javascript:void(0);" onclick="tmpl_login_frm();"><aside id="sidebar-contact_page_sidebar" class="sidebar large-3 small-12 columns">';
    } else {
        echo 'user is not logged in, show login button';
        echo '<input type="button" style="background-color: red" value="Login" data-reveal-id="tmpl_reg_login_container" href="javascript:void(0);" onclick="tmpl_login_frm();"><aside id="sidebar-contact_page_sidebar" class="sidebar large-3 small-12 columns">';
    }
?>