Home > Coding, WordPress > My first WordPress plugin: AJAX Login Widget++

My first WordPress plugin: AJAX Login Widget++

February 22nd, 2009

Today I decided that did not really like the how WordPress handled user logins. Whenever you want to login, it whisks you away from what you were reading and onto a very empty login page. Once you have logged in, in tends to whisk you off somewhere new. Worse, when you logout it again takes you away from the page you were on to show you a blank login page. Thus I headed back to the WordPress plugins directory in search of something better.

What I found was a nifty plugin named AJAX Login which (surprise) used AJAX to handle almost all login processing within the page the user was on. Unfortunately, it had not been updated in over a year and was no longer compatible with the latest version of WordPress. Thus I started hacking on it and ended up making a number of improvements to its UI and how it handled AJAX calls. Anyway, I decided to package it up as a new plugin — you can get the plugin and read all the details about what it does here.

Its official location in the WordPress plugins directory is at http://wordpress.org/extend/plugins/ajax-login-widget/!

David Underhill Coding, WordPress , , ,

  1. February 23rd, 2009 at 12:35 | #1

    Thanks alot for make this plugin. I was waiting ages for some one to fork that plugin.

    but i have few problems.

    1- when i try login, logout. it does refresh pages.
    Register and lost password does work.

    2- could you make the style more like this plugin. it will be very cleaner.

    3- Optimize js file, the file is too big. And make the file load in the footer rather then in header. check this article:
    http://www.prelovac.com/vladimir/wordpress-plugins/footer-javascript
    http://developer.yahoo.com/performance/rules.html#js_bottom

    thanks again.

    http://wordpress.org/extend/plugins/sidebar-login/

  2. February 23rd, 2009 at 15:47 | #2

    I have been looking for a login plugin and this one is great!

    Having said that, may I suggest a few improvements?

    1) It looks a lot better in Firefox that IE7. Can you do something about that?

    2) How about giving it some unique CSS properties so it can be styled?

    3) How about giving the option for a widget title. I use title bars to separate widgets and there is no way to separate this one from the previous widget without some custom coding.

    Other than that, great job! Thanks.

  3. February 23rd, 2009 at 15:54 | #3

    @Rick
    1) I’ve never run the plugin through IE7, so I will definitely make that a high priority.

    2) Good idea — ideally it should be easier to manage internalization too (something intentionally neglected for the first release).

    3) No problem — I’ll definitely put that in the next release.

    Thanks for all these great ideas Rick!

  4. Wavatar
    Adrian
    February 23rd, 2009 at 16:40 | #4

    Plugin well called for!

    The tables threw out the appearance of the widget for me.

    Also, would love to see ability to have a user_url and description upon registration.

    Cheers, and keep up the good work. :)

  5. February 23rd, 2009 at 17:23 | #5

    @Adrian
    Thanks Adrian!

    Maybe in the next revision I can provide an additional template which isn’t table-based; the table makes things align nicely on the one blog I tested on but that doesn’t translate to all blogs as you have pointed out :) .

    What do you mean by a “user_url and description”?

  6. February 24th, 2009 at 07:34 | #6

    @SuperMAG
    1) It should only refresh the whole page when the user successfully logs in. The reason for this is that their may be other arbitrary content on the page (Edit button, etc.) that needs to be updated once the user has logged in. On the up side though, it only refreshes the page and does not take the user to a new page so hopefully this minimizes distraction. Any ideas on how it could do even less?

    2) Sorry, which plugin did you want it styled after? I’m not sure which one you are referring to.

    3) Absolutely, that is easy to do; I should have done that from the start but I’ll definitely have it in the new revision (circa this weekend).

  7. February 24th, 2009 at 07:40 | #7

    1- mmm, well u are right, but some people do not need that. so it will be bitter if you make an option in the admin area.

    2- sorry about that. forgot the past button.
    http://wordpress.org/extend/plugins/sidebar-login/
    the best thing in that plugin styling is that, it is crystal clear. check my site.

    and when you login you will see three links:
    Dashboard
    Profile
    Logout

    and also the title of the sidebar automathecally changes from Login to Welcome (USERNAME)

    Thanks,
    regards Iman.

  8. February 24th, 2009 at 07:56 | #8

    @SuperMAG
    1) Sounds good, I like options.

    2) Nice, that does fit it pretty cleanly. As far as what links to show, it probably makes sense to provide some different options (custom, all 3 you listed, or just profile+logout links like I use here). Finally, the next revision will definitely include an option for a dynamic title to be included above the widget.

    Thanks for all your good ideas Iman!

  9. February 24th, 2009 at 08:19 | #9

    This is somewhat off topic but what are you using to run this comment section? It’s fabulous. I don’t remember every seeing anything like this before.

    I am not a total newbie so I looked at your page source code but wasn’t able to discover how you’re doing it. I probably missed seeing it there.

  10. February 24th, 2009 at 08:28 | #10

    @Rick
    I’m actually not using any plugins directly on the comments part of the page. It is probably from the inove theme with some minor tweaks to the standard ‘Discussion’ section options.

  11. February 24th, 2009 at 09:24 | #11

    @David Underhill
    Maybe an Ajax Comments plugin should be your second WordPress plugin.

  12. February 24th, 2009 at 09:24 | #12

    @Rick
    I like your line of thinking :) .

  13. February 24th, 2009 at 09:36 | #13

    well i looked into the source of inova few months ago, and found the code but didnt know how to use it so leaved it. i was looking for the Replay and Quote button.

    Also searched for many ajax commenting plugin, but most of them were outdated and not working. there was one, but it was using HUGE amount of memory.

  14. February 24th, 2009 at 20:00 | #14

    Thanks for making thew plugin it’s looks like it’s got some cool functionality! I had trouble with another plugin users could reg but not log. So i installed your plugin WP 2.7 iNove theme and when i test to reg a dumby username it gives this error. Unknown registration response.
    I have mucked around for days trying to get a reg/login system for my users. Would you mind please reg or email me or come in to the WP admin to straighten it out please.

  15. February 24th, 2009 at 20:08 | #15

    @Jaffasoft
    It looks like you have another plugin installed which requires a user to solve a simple math problem before registration can be completed — I noticed this when I went to your wp-login.php page directly when the form in the sidebar doesn’t work. You’ll probably have to disable that plugin in order to use the form in the sidebar since the two aren’t aware of each other.

  16. February 24th, 2009 at 21:35 | #16

    Thanks for the reply! What could be done next? I previously disabled the plugin deleting the pugin from the directory as well!

  17. Wavatar
    Bak
    February 25th, 2009 at 23:34 | #17

    I was able to make my own template, using some stuff from Sidebar Login.
    The links are now different depending on the logged in user role. The register link only appears if the “Anyone can register” options is checked.
    I’m now lookin to have some kinda CAPTCHA thing on the register module.
    Great stuff!

  18. Wavatar
    Bak
    February 26th, 2009 at 11:05 | #18

    This is just what I posted in the WordPress plugin feedback. Please discard my previous comment.
    ——————————————————————-
    Great stuff, David.
    I’ve customized my own template to include the following:
    - Register link only appears if “Anyone can register” options is checked
    - Logged in users have different links depending on their role.
    (Admin have add’l to Dashboard, Authors/Editors have add’l link to Post an article, …)
    - Made the login look more like a widget by adding a title depending on the mode
    Login -> Member Login
    Logged in -> Welcome, Bak
    Register -> Join the club
    Lost Password -> Retrieve Password
    - I also tried to have default text in text fields which are cleared onfocus unless you enter something in them. I then removed the focus function from your javascript when you change mode (Login/Lost Password/Register). It worked but I reverted back to the original setting.

    It would be nice to request additional information upon registration such as CAPTCHA. I tried to use the “is_human()” plugin but can’t get it to work. I’ll try some more tho. Any ideas?

    The Twitter idea from 3) is great idea.
    I’ve also been looking for a front-end user profile plugin/page, where users can see their posts, comments, avatar, password change, links to other accounts (Twitter, Facebook, MySpace and stuff like that). Any ideas?
    Thanks again for such a nice plugin.
    If you want to see my template, just lemme know.

    Bak

  19. February 27th, 2009 at 19:45 | #19

    I think i know what your getting at with the Twitter thing. This might be another plugin but if there was a link once logged in to ‘members’ then when at that page. Imagine a full list (long long list) of all the members if it’s 10 then 10 if it’s 500 then 500.

    And have wavatar like similar to this http://TwitPWR.com/6vO/ but spread them out or even one each line then along side have the members twitter,facebook usernames if they had one. It would just be a pretty looking page with the wavator,gravatar etc and will show a community feel to it also that users might come to know to go to when they login then they look at each members. Possibly when you roll over a users member name it might open an area down below to show there twitter, then roll the mouse over facebook and you see their face book. I dunno i’m just thinking ideas.

    But i would like a single page that i can insert [community-members-list] that i could put in a post or page somewhere. Even just wavatar list and a username page like in the link above would be good.

    I’m not a programer at all. I’m happy to give you guys ideas. So if you ever need ideas just ask. I have dozens more for various plugin ideas as well if your a developer and want ideas. I will give the ideas i just want to be able to use the plugin :) It’s a Win/Win.

  20. March 2nd, 2009 at 11:44 | #20

    So, any idea when the next release is comming.

    Thanks

  21. March 2nd, 2009 at 13:08 | #21

    @SuperMAG
    Hoping for this weekend – lots of good ideas to play with!

  22. March 7th, 2009 at 03:43 | #22

    There is a plugin competition that you may be able to enter it into! I can find the link again couple days. This is just a quick message. They want entries that are a social function…

  23. March 12th, 2009 at 03:11 | #23

    How are you going with this David?

    This is the comp not sure if it’s suitable:
    http://www.socialactions.com/changetheweb

  24. March 17th, 2009 at 02:03 | #24

    its been 2 weeks since that, still didn’t released the new version. just wondering if it going to be released soon.

  25. March 17th, 2009 at 08:08 | #25

    Hey there!

    I love your plugin, it rocks! Unfortunatelly I can’t use it; I have the same issue with it as Jaffasoft, “Unknown registration response” when trying to register. The username is created and the password sent, but this error throws people off.

    Fortunately I also found the root of the problem, at least in my case. It’s the plugin OpenID. Whenever it is active, that response is given.
    Plugin wordpress page http://wordpress.org/extend/plugins/openid
    The tests were conducted at http://www.atheistblog.org/test/, which I set up as a mirror to my blog from an old backup for testing different plugins. I have left the conflicting plugins active so you can see the issue, maybe it can help.

    I’m no programmer, but if there is any way I can further contribute, let me know.

  26. March 17th, 2009 at 10:40 | #26

    Update… OK, I have added the widget to the sidebar now… :-0 !!!

    However, I get a pop up that says ‘unknown login response’ when I try to log in. Logging out works fine. What causes this? Thanks.

  27. March 18th, 2009 at 09:38 | #27

    Hi,
    I installed your plugin in my WP, but I don’t use the widget, so I used this codex

    
    

    in my sidebar, but I have an error “Fatal error: Call to undefined function: wp_logout_url() in /membri/musicanapoli/wp-content/plugins/ajax-login-widget/alw_template.php on line 111″.
    How can I fix?
    Sorry for my english!
    Thanks.

  28. March 18th, 2009 at 09:40 | #28

    Sorry, the codex is add_ajax_login_widget()

  29. March 19th, 2009 at 17:30 | #29

    Have you given up on this or did you die? I’ve got tonnes people coming to my site but they can’t register or login so they are missing out of the content because of the memberwing member levels.

    Hoping that this can be a system soon!

  30. March 19th, 2009 at 17:37 | #30

    Haha, thanks for all the comments — I am still planning on updating the plugin, but unfortunately it just so happened that the period of time immediately after the initially release turned out to be an extremely busy time for me. The good news is that next week I have some time to relax and look forward to implementing some of these improvements :) . Soon!

  31. Wavatar
    RaiulBaztepo
    March 28th, 2009 at 14:38 | #31

    Hello!
    Very Interesting post! Thank you for such interesting resource!
    PS: Sorry for my bad english, I’v just started to learn this language ;)
    See you!
    Your, Raiul Baztepo

  32. March 29th, 2009 at 14:26 | #32

    on your next update, you need to support other languages. i can translate this plug in to 3 more languages.

    for more info:

    http://codex.wordpress.org/I18n_for_WordPress_Developers

  33. March 30th, 2009 at 12:04 | #33

    I’m assuming this is not a working plug-in judging by the comments? Has anyone made it work at all or figured out what breaks it?

  34. March 30th, 2009 at 12:14 | #34

    @nathan
    It works for me :) — it seems some people are having issues with their configuration but I’m not sure if it is a wordpress version issue or something else. I’m hoping to gather some more info about it and then look into it after the next release.

  35. Wavatar
    SN
    April 22nd, 2009 at 23:30 | #35

    Great work David! Really love the plugin (and so needed like everyone else here has mentioned already) however really need a CAPTCHA of some sort since i’m worried about bot signups and spam.
    Not to pressure you… but any chance the update for this plugin (including captcha) will be released before next month (May)?
    Thx!

  36. Wavatar
    Dan
    May 3rd, 2009 at 17:54 | #36

    awesome plugin. works great just wondering if you could add either an option to disable the register link or to only show it if “anyone can register” is enabled. I can definitely do this on my version but it would be nice to not have it overwritten when new updates come out! an associated stylesheet would be great also.

  37. Wavatar
    mtingle
    May 12th, 2009 at 05:21 | #37

    Nice plugin, very useful, thanks.

    Quick question, is it possible for the widget to default to the registration section first instead of the login one? If it is can you let me know how you would do that (I’ve been searching through the php but could not find an obvious place to set it).

    Michael

  38. May 15th, 2009 at 16:45 | #38

    If you are using this plugin on an SSL page, but your URL in your WP settings is NOT the ssl site, then it will have problems since it will be trying to make an ssl request from a non ssl page.

    To fix this, in ajax-login-widget.php on line 49, insert
    var alw_base_uri = ‘<?php
    $url = get_bloginfo( ‘wpurl’ );
    if ($_SERVER["SERVER_PORT"] == 443){ $url = str_replace(“http://”, “https://”, $url); }
    print($url);

    ?>’;

    instead of
    var alw_base_uri = ‘<?php bloginfo( ‘wpurl’); ?>’;

    This will send the request via SSL for any page that is using SSL on the standard port (443).

  39. May 26th, 2009 at 08:21 | #39

    Hello david, wonderful plugin. I am using other plugin called register-plus, and I wonder if the registration behavior on the widget could extract those extra fields from register-plus (I need this because my wordpress does not send passwords to new users with the default registration form – I can’t fix it, tried everything!) just like this plugin lets extrat those fields: http://wordpress.org/extend/plugins/registration-form-widget/ here is my register page: http://www.re-searcher.com/site/wp-login.php?action=register

    thank you!!

  40. June 1st, 2009 at 06:06 | #40

    Is there a way to eliminate the logged in user’s ability to edit their profile by clicking on their name once they are logged in? Anyone have an idea on how I might be able to do that with this?

  41. Wavatar
    deadnick
    June 1st, 2009 at 11:03 | #41

    Does anyone know how to get this widget to the header? This is an awesome widget which i wouldnt want to slot it on the sidebar. This needs to be at the top where everyone can see!

    Currently using the unstandard theme if that makes any difference…

    cheers

  42. July 2nd, 2009 at 16:51 | #42

    I’d bet you have to widgetize the header.php file, although I’ve never thought of that so unsure of process or results.

  43. Wavatar
    nathan
    July 9th, 2009 at 05:53 | #43

    Hi there, I also can log out fine, but get ‘unknown login response’ if I try and log with the widget. Is there a fix for this, or at least, what is the cause? Anyone? I didn’t quite follow Vlad Nistor’s comment about Open ID. As far as I know, I’m not using Open ID for the site. Thanks in advance!

  44. July 25th, 2009 at 21:06 | #44

    Disregard the above. I went back to 2.7 and it seems to be working. Thanks :)

  45. September 17th, 2009 at 06:18 | #45

    Hi, I set this up and had it working fine for a few days, then lo and behold it just stopped working! Seems like therer was no reason for it, so have no cue where to start trying to fix it. I am using 2.84 and this does say compatible up to 2.7 so that may be the reason, also, maybe another plugin is killing it, but I have very few plugins and nothing was added between it working and not working (over an evening).

    Is this still being worked on? Any alternatives to this for 2.8?

  46. September 18th, 2009 at 14:28 | #46

    Idea’s for future version.

    1. Check if user name is available
    2. Add custom fields to sign-up (Probably out of scope, but would be cool!)
    3. Tested to work with WPMU

  47. September 19th, 2009 at 17:12 | #47

    @phil
    Thanks for the feedback Phil. I’m not aware of issues in the latest versions of WordPress, but I’ll try to look into it sometime. The project is on the back burner for now however.

  48. Wavatar
    Gro
    September 25th, 2009 at 06:51 | #48

    Thank you!

  49. Wavatar
    gregory
    November 12th, 2009 at 21:00 | #49

    A logout redirect like your login redirect would be great!

  50. Wavatar
    Mark Falkland
    December 2nd, 2009 at 00:39 | #50

    This is awesome, well done!

Comment pages
  1. No trackbacks yet.