#29

Product support

Get help in the plugin support forum.

Categories

  • Miscellaneous
  • Social

Socialite

RomaldyMinaya.Socialite provides a clean and beautiful experience for the developers allowing them to oAuth users using the most common Social Providers.

Dependencies

Rainlab.User October.Drivers

Main Purpose

To provide a High Quality Plugin to the OctoberCMS Users that is flexible enough to be extendable and maintainable across the time. By implementing the Official Laravel\Socialite package created by Taylor Otwell and maintained by the community, we allows user to OAuth authentication with Facebook, Twitter (Comming Soon), Google, and GitHub.

Integration

The Socialite plugin Requires the Rainlab.User plugin to operate since all the sesion data is handled with the RainLab\User\Classes\AuthManager. Also the Laravel\Socialite package was used to handle the interface communication between the OctoberCMS and the Social Providers.

Vision

To increase the satisfaction provided by the user experience of OctoberCMS to my colleagues in the community.

These plugin(s) are required for the plugin:

Beautiful Configuration

Video Tutorial

Socialite Quickstart

The first thing we must do is to go to any of our social providers (Facebook, Github or Google), and create our apps.

At this point i assume that at least you have the proper knowledge to achieve that. In case your not. Please refer to this documentation:

When you've created your apps you will have an App id and an App Secret which gives you authorization keys to use those services. Please copy and paste them into the corresponding fields as shown in the image below:

Paste your keys here

Lets define the fields in the picture above:

  1. Automatic Redirection: If you select this feature, the user will be redirected to the page that was at the time of logon is attempted, which means that is this is off, you can manually select a page to redirect the user to after giving access.
  2. Callback URL: Some providers requires that you specify the URL they will be sending the data to after a login request such as GitHub. Copy and paste this into your Provider's app settings.
  3. Enabled: If this check-box is selected, a link will appear wherever the component is used.
  4. Facebook, GitHub, Google tabs: Those are the individual settings for each provider supported by the plugin.

Lets drop our component into the page

When you drop the Socialite's LoginButtons component into your page, it contains the following markup:

{% component 'loginbutton' %}

Becomes

<!-- Social login Buttons -->
<loginbuttons>
    {% for key, provider in providers %}
        {% if provider.is_activated %}
            <a href="{{ route(key) }}" class="btn btn-lg btn-social btn-{{ key }}">
            <i class="fa fa-{{ key }}"></i>   {{ key }}
            </a>
        {% endif %}
    {% endfor %}
</loginbuttons>
<!-- /Social login Buttons -->

The component itself has a built in CSS which gives you a beautiful kick start design as shown in the image below:

enter image description here

User Plugin Extension

The Socialite Plugin ads fields to the users administration section which helps you determinate which users has been registered using Social Providers and what Social Provider they have used. Please refer at the image below:

enter image description here

As you noticed, this plugin gives you a clean and beautiful way to integrate the RainLab.User plugin with the most popular Social Providers.

1.0.4

Fixed bug when trying to create a new user

Apr 11, 2017

1.0.3

Added english language support

Jun 23, 2015

1.0.2

Added middleware to prevent socialite to be used wrongly

Jun 23, 2015

1.0.1

First version of Socialite

Jun 23, 2015