17

I want to execute custom jquery code which shows login dialog to user if he clicks a button and he is not logged in. How could I do that?

26

In case you want to know if the user is logged in at the current moment. The other answers check if the user is logged in or not when the page loaded not the time when you're running the javascript. The user could have logged in in a seperate tab for instance

Put this in your javascript

var data = {
    action: 'is_user_logged_in'
};

jQuery.post(ajaxurl, data, function(response) {
    if(response == 'yes') {
        // user is logged in, do your stuff here
    } else {
        // user is not logged in, show login form here
    }
});

put this in your functions.php

function ajax_check_user_logged_in() {
    echo is_user_logged_in()?'yes':'no';
    die();
}
add_action('wp_ajax_is_user_logged_in', 'ajax_check_user_logged_in');
add_action('wp_ajax_nopriv_is_user_logged_in', 'ajax_check_user_logged_in');
  • What is the value of ajaxurl? – Feras Odeh Oct 24 '12 at 19:22
  • wordpress sets it to 'yoursite.com/wp-admin/admin-ajax.php'. That's the url on which all the ajax requests are supposed to be sent – Mridul Aggarwal Oct 24 '12 at 19:25
  • I put the jQuery.post inside jquery click handler but this doesn't work. do you have any idea how to solve it? – Feras Odeh Oct 24 '12 at 19:28
  • I saw that ajaxurl is not defined in the console. – Feras Odeh Oct 24 '12 at 19:34
  • 1
    [codex](codex.wordpress.org/AJAX_in_Plugins) said that in latest wordpress versions this is already defined. Maybe you can define your own version of ajaxurl with wp_localize_script – Mridul Aggarwal Oct 24 '12 at 19:45
32

Check the class attribute for body: If the theme is using body_class() the body has a class named logged-in for users that are logged in. Be aware the function can be used on the element html too.

Example

if(jQuery('body').hasClass('logged-in')){
    // Do something
}

You can also just use is_user_logged_in() as a condition to enqueue or print the script.

  • top marks for this answer - simple and effective. – Q Studio Jul 20 '13 at 21:12
  • I like the idea of just checking the body for logged-in class. Just have to be sure that themes use body_class(); or get_body_class(); Otherwise, that's not a super reliable solution. Although, I use those functions in my themes, so that's a good solution for me. Thanks for the simple idea. – Michael Ecklund Feb 16 '17 at 17:22
18

Please add body_class() to your html body

<body <?php body_class(); ?>>
   //your html code
</body>

This will add logged-in for logged user then you can use following jquery code to execute your custom juqery code only for logged user.

if ($('body').hasClass('logged-in')) {
       //execute your jquery code.
}
  • I dunno why this one was down voted. Approach is fully valid. +1 – kaiser Dec 31 '13 at 11:54
  • I dont know. I have same question. Answer is valid but why down vote. – Monirul Islam Jan 22 '14 at 4:42
  • Hm. Maybe because it uses jQuery instead of the right way (using a filter and the callback). Some people are allergic to jQuery. – kaiser Jan 22 '14 at 14:28
  • 1
    good, but it wouldnt tell actual login state if you use a cacheing plugin with page cache enabled. – Janos Szabo Mar 19 '18 at 7:29
6

Another example, in case you want to use it for AJAX calls.

// Simplified... please note, that all names/vars/etc. in my class got unique names.
// ...the same goes for the script handler.
class wpse69814_example
{
    public $response;

    public function __construct()
    {
        add_action( 'wp_enqueue_scripts', array( $this, 'enqueue' ) );
        add_action( 'wp_enqueue_scripts', array( $this, 'localize' ), 20 );
    }

    public function enqueue()
    {
        wp_enqueue_script(
            'wpse69814_handler',
            plugins_url( 'url/to/file.js', __FILE__ ),
            array( 'jquery' ),
            filemtime( plugins_dir_path( __FILE__ ).'/path/to/file.js' ),
            true
        );
    }

    public function localize()
    {
        wp_localize_script( 'wpse69814_handler, 'wpse69814_object', array(
            'ajaxurl'    => admin_url( 'admin-ajax.php' ),
            'ajax_nonce' => wp_create_nonce( 'wpse69814_nonce' ),
            'action'     => 'wpse69814-handler-action',
            'data'       => array(
               'is_user_logged_in' => is_user_logged_in(),
            )
         )

    }
}
  • To note, this approach doesn't work behind CDN. :D – Brian Fegter Dec 30 '13 at 16:21
  • @BrianFegter Might want to explain (or edit it in) why? :) – kaiser Dec 31 '13 at 0:52
  • Since the CDN doesn't authenticate with WordPress, is_user_logged_in will be cached as false in the DOM when origin is hit User state should be abstracted out to a no-cache thread via XHR when using a CDN. @Mridul Aggarwal's approach works but with no-cache headers in the response. – Brian Fegter Dec 31 '13 at 5:42
  • @BrianFegter Good catch. Fixed that... I think. Upvoted other answers as well. – kaiser Dec 31 '13 at 11:54
2

Please note that none of the above examples are reliable in case you use a page cacheing plugin, then the code in body tag will be static. Also there is a simple way to do this (with no extra query to ajax which is not optimal)

If you want to test user logged in state with javascript, you can use this code to set cookie when user logged in and delete cookie when user logged out. Add this eg. to your theme functions.php

function login_function() {
    setcookie('wp_user_logged_in', 1, time() + 31556926, '/');
    $_COOKIE['wp_user_logged_in'] = 1;
}
add_action('wp_login', 'login_function');

function logout_function() {
    unset($_COOKIE['wp_user_logged_in']);
    setcookie('wp_user_logged_in', null, -1, '/');
}
add_action('wp_logout', 'logout_function');

Then its a simple test of cookie in javascript.

if (document.cookie.indexOf('wp_user_logged_in') !== -1) {
    //do something when user logged in
} else {
    //do something when user logged out
}
  • This is indeed pretty simple, reliable and in worst case executes almost instantly after page load (if loading script in footer without render blocking) unlike other answers. Ajax is slow and relying on body classes will fail on caching. Need to add this cookie to Cookie Policy text. Thank You Janos. – Ryszard Jędraszyk Apr 19 at 0:13
  • As a follow-up, there is a problem with synchronization of default WordPress cookies and newly created script-accessible cookie, but I've received a great and simple answer on how to solve it: stackoverflow.com/questions/56208574/… – Ryszard Jędraszyk May 27 at 3:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.