[HOWTO] Authenticate user in WordPress with XenForo

Discussion in 'WordPress' started by xfrocks, Jun 12, 2013.

Tags:
Thread Status:
Not open for further replies.
  1. Have feature suggestions for the WordPress plugin? Post or vote here.
  1. xfrocks

    xfrocks XenForo rocks!
    Staff Member

    Prerequisite
    Step 1. [XenForo] Obtain API Client credentials
    Go to XenForo API Access page (http://domain.com/xenforo/account/api), click the "Add New Client" button to create a new client. You may need to allow the general permission "[bd] API: Create Client" for your user group. You should have it listed like this, please take note of the API Key and Secret:
    Screen Shot 2013-06-12 at 3.30.54 PM.png

    Step 2. [WordPress] File modification

    You will need to create one new file and edit one file.

    Create file: wordpress/wp-content/plugins/wordpress-social-login/hybridauth/Hybrid/Providers/CustomProvider1.php
    PHP:
    <?php
    class Hybrid_Providers_CustomProvider1 extends Hybrid_Provider_Model_OAuth2
    {
    /**
    * IDp wrappers initializer
    */
    function initialize()
    {
    parent::initialize();
     
    $this->scope "read";
     
    // Provider apis end-points
    $this->api->api_base_url  "http://domain.com/xenforo/api";
    $this->api->authorize_url "http://domain.com/xenforo/api/oauth/authorize";
    $this->api->token_url    "http://domain.com/xenforo/api/oauth/token";
     
    $this->api->sign_token_name "oauth_token";
    }
     
    function 
    getUserProfile()
    {
    $this->refreshToken();
     
    $response $this->api->api"/users/me" );
     
    if ( ! isset( 
    $response->user ) || isset( $response->error ) ){
    throw new 
    Exception"User profile request failed! {$this->providerId} returned an invalid response.");
    }
     
    $response $response->user;
     
    $this->user->profile->identifier    = (property_exists($response,'user_id'))?$response->user_id:"";
    $this->user->profile->displayName  = (property_exists($response,'username'))?$response->username:"";
    $this->user->profile->email        = (property_exists($response,'user_email'))?$response->user_email:"";
    $this->user->profile->emailVerified = (property_exists($response,'user_email'))?$response->user_email:"";
     
    if( 
    property_exists($response,'user_dob_day') && property_exists($response,'user_dob_month') && property_exists($response,'user_dob_year') ){
    $this->user->profile->birthDay  = (int) $response->user_dob_day;
    $this->user->profile->birthMonth = (int) $response->user_dob_month;
    $this->user->profile->birthYear  = (int) $response->user_dob_year;
    }
     
    return 
    $this->user->profile;
    }
    }
    Edit file: wordpress/wp-content/plugins/wordpress-social-login/includes/settings/wsl.providers.php
    The original contents look like this:
    PHP:
    ...
    $WORDPRESS_SOCIAL_LOGIN_PROVIDERS_CONFIG = ARRAY(
    ARRAY(
    "provider_id"      => "Facebook",
    "provider_name"    => "Facebook",
    "require_client_id" => true,
    "new_app_link"      => "https://developers.facebook.com/apps",
     
    "default_network"  => true,
    "cat"              => "socialnetworks",
     
    )
    ...
    You should make it look like this:
    PHP:
    ...
    $WORDPRESS_SOCIAL_LOGIN_PROVIDERS_CONFIG = ARRAY(
    // XenForo authentication - start of modification
    ARRAY(
    "provider_id"=> "CustomProvider1",
    "provider_name"=> "Some Nice Name",
    "require_client_id"=> true,
    "new_app_link"      => "http://domain.com/xenforo/account/api",
    "cat"=> "misc",
    ),
    // XenForo authentication - end of modification
    ARRAY(
    "provider_id"      => "Facebook",
    "provider_name"    => "Facebook",
    "require_client_id" => true,
    "new_app_link"      => "https://developers.facebook.com/apps",
     
    "default_network"  => true,
    "cat"              => "socialnetworks",
     
    )
    ...
    For best result, you should upload the provider image attached below to wp-content/plugins/wordpress-social-login/assets/img/32x32/icondock (32x32 variant) and wp-content/plugins/wordpress-social-login/assets/img/16x16 (16x16 variant). You will need to rename the files to "customprovider1.png".

    Step 3. [WordPress] Configuration

    Go to Dashboard > Settings > WP Social Plugin and click the XenForo icon in the "Add more providers" widget. Input the key/secret from Step 1. Click "Save Settings".
    Screen Shot 2013-06-12 at 4.31.39 PM.png

    And you are done. Head to http://wordpress.xfrocks.com to test it.
    Blogs – Just another WordPress site
    blogs.daohoangson.com
     

    Attached Files:

    XFNewbie likes this.
  2. xfrocks

    xfrocks XenForo rocks!
    Staff Member

    User Flow Screenshots

    This is the home page of http://wordpress.xfrocks.com, click Login to start logging in.
    Blogs – Just another WordPress site
    blogs.daohoangson.com

    Screen Shot 2013-06-12 at 4.59.22 PM.png

    Click the XenForo icon to login via https://xfrocks.com, you will be asked for username and password if you haven't logged in at this site yet.
    Resources | XFROCKS
    xfrocks.com

    Screen Shot 2013-06-12 at 5.00.21 PM.png Screen Shot 2013-06-12 at 5.01.17 PM.png

    You will have to confirm the authentication request by clicking the "Authorize Access" button.
    Screen Shot 2013-06-12 at 5.03.43 PM.png

    You are now logged in at http://wordpress.xfrocks.com.
    Blogs – Just another WordPress site
    blogs.daohoangson.com

    Screen Shot 2013-06-12 at 5.05.19 PM.png
     
    XFNewbie likes this.
  3. tafreehm

    tafreehm New Member

    this is great :)
    Question: after authentication what if user changes his/her password at forums ?
     
    1. xfrocks

      xfrocks XenForo rocks!
      Staff Member

      xfrocks @tafreehm No problem. User can change password at will, all authentication will still work as before.
       
Loading...