HowTo: Add ID Selector for OpenID
OpenID is very convenient but confusing to new users or non-technical folks. If you have a lot of such users visiting your drupal site and you want to quickly enable them to login using their existing OpenID (if they have Yahoo! or AOL account, they already have an OpenID and don't even know it), using ID Selector's user-friendly ID Selector, here are are step by step instructions to enable ID Selector on your OpenID enabled site. These steps have been tested on 6.4. They may work on 5.x with OpenID module installed, but I have no way to test it.
Requirements:
Drupal 6.x
OpenID module is enabled.
Step 1:
Create an ID Selector for you drupal site. Go to http://www.idselector.com, login (you can use OpenID, of course!). As soon as you sign in and enter basic information like your email address, click on 'Create a Selector' button. Enter all the necessary information. For Login URL you can enter your home page, if you have a login block appearing on your site, otherwise enter appropriate URL. Make sure you check 'We support OpenID 2.0' check box. Next you'll bet the Selector Code. Keep this handy for next step.
Step 2:
Create a block. For the block body you can cut and paste the Selector Code from Step 1. Make sure that you choose the right input format for your block. I have chosen to use PHP Code (but Full HTML will do too), because I have other stuff appearing in this box based on whether the user is logged in or not. There is one more code snippet you need add because the input form on login page has different 'id' than the ID Selector expects. Here's how my block body looks.
<!-- This block is configured to appear ONLY on the front page when the user is not logged in -->
<!-- BEGIN ID SELECTOR -->
<script type="text/javascript" id="__openidselector" src="https://www.idselector.com/selector/XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" charset="utf-8"></script>
<!-- END ID SELECTOR -->
<script type="text/javascript">
<!--
idselector_input_id = "edit-openid-identifier";
-->
</script>Note: I have replaced my real ID Selector Code with 'X' for security.
Step 3:
Configure the block such that it will only appear on your login page when the user is not logged in. This is not strictly necessary but that's how I have this configured.
You're done!
Alternate methods:
To get the ID Selector working on your site, all you need is to have the above code snippet on your login page in some way. There are many ways to achieve this. The above method is just one such way. Other methods I can think of are:
Add the above code snippet in header or footer. Add the snippet in a 'sticky' node appearing on the login page and so on.