31
Introductution to Social Connect Magento extension www.letsnurture.com | www.letsnurture.co.uk

Introductution to social connect Magento extension

Embed Size (px)

DESCRIPTION

Learn how social Magento Extension work.

Citation preview

Page 1: Introductution to social connect Magento extension

Introductution to Social Connect Magento extension

www.letsnurture.com | www.letsnurture.co.uk

Page 2: Introductution to social connect Magento extension

Social Connect Magento extension

Magento social connect extension that would connect your Magento installation with multiple authentication providers

at the same time. Inspired by this idea I wrote another Magento extension named Inchoo Social Connect allowing your customers to login or create an account at your store

using their Google, Facebook or Twitter account.

Download Source : http://inchoo.net/ecommerce/magento/social-connect-magento-extension/

Responsive Custom Menu

Page 3: Introductution to social connect Magento extension

IntroductionAfter you install and configure Inchoo Social Connect, your Magento installation will have

Google, Facebook and Twitter buttons added to your login page as a convenient way for your

customers to login or register using their Google or Facebook account. This functionality will also be available at your create an account page, as well

as at the first step of your store’s checkout process.

Page 4: Introductution to social connect Magento extension
Page 5: Introductution to social connect Magento extension
Page 6: Introductution to social connect Magento extension
Page 7: Introductution to social connect Magento extension

By using one of the Inchoo Social Connect buttons customer will initiate different process depending whether he already connected his user account to one of your store’s accounts or not. For first time customers Social Connect will create a brand new store account using data received from authentication provider, send registration email with store account credentials and then connect that store’s account to authentication provider’s account. If Social Connect discovers that email address given by the authentication provider is already used by existing store customer, customer in question will be logged in and his account will be connected to the authentication provider. Customers who already have their store account connected to an authentication provider’s account will be automatically logged into your store.

To take advantage of Social Connect, existing customers will be able to connect their store accounts with authentication provider of their choice from their account settings page.

Page 8: Introductution to social connect Magento extension
Page 9: Introductution to social connect Magento extension
Page 10: Introductution to social connect Magento extension

InstallationFirst step to having fully functional Social Connect

installation is to download latest version of Inchoo Social Connect Magento extension zip package, and merge

contents of enclosed directory into your Magento installation root. After adding Social Connect to you

Magento installation, you can log into your Magento admin area and go to System -> Configuration -> Customers ->

Customers Configuration.

Download Link : https://github.com/Marko-M/Inchoo_SocialConnect/archiv

e/0.2.3.zip

Page 11: Introductution to social connect Magento extension

InstallationIf you find tabs named Social Connect Google Options, Social

Connect Facebook Options and Social Connect Twitter options there, Inchoo Social Connect has been successfully installed.

Before your customers can log into your store using their Google, Facebook or Twitter account, you must provide Inchoo Social

Connect with client ID and secret keys for each authentication provider. You can obtain these keys by creating Google Project,

Facebook App and Twitter Application using procedure outlined in the following sections

Page 12: Introductution to social connect Magento extension

Creating Google ProjectFirst step to creating Google Project and obtaining Google client

ID and secret key is navigating to Google APIs Console. To successfully complete process of creating Google Project you will

need following pieces of information:Google API : https://code.google.com/apis/console/

Authorized Redirect URIs: http://www.example.com/socialconnect/google/connect/

Authorized JavaScript Origins: http://www.example.com

Don’t forget to replace http://www.example.com with your store web address. Here’s gallery of screenshots that should securely

guide you trough this process:

Page 13: Introductution to social connect Magento extension
Page 14: Introductution to social connect Magento extension
Page 15: Introductution to social connect Magento extension
Page 16: Introductution to social connect Magento extension
Page 17: Introductution to social connect Magento extension
Page 18: Introductution to social connect Magento extension
Page 19: Introductution to social connect Magento extension

Creating Facebook AppCreating Facebook App is somewhat similar to creating Google Project. Again, first step is navigating to Facebook Developers

page. There you will need following pieces of information:

Facebook Developers page URL :https://developers.facebook.com/apps/

Authorized Redirect URIs: http://www.example.com/socialconnect/facebook/connect/

Authorized JavaScript Origins: http://www.example.com

Don’t forget to replace http://www.example.com with your store web address. Here’s gallery of screenshots to guide you trough

this process:

Page 20: Introductution to social connect Magento extension
Page 21: Introductution to social connect Magento extension
Page 22: Introductution to social connect Magento extension
Page 23: Introductution to social connect Magento extension
Page 24: Introductution to social connect Magento extension

Creating Twitter ApplicationFirst step to creating Twitter application is navigating to Twitter

Developers page. After clicking at Create a new application button you will be requested to provide following information:

Twitter Developers Page URL:https://apps.twitter.com/

Callback URL: http://www.example.com/socialconnect/twitter/connect/

Website: http://www.example.com

Don’t forget to replace http://www.example.com with your store web address. To take advantage of Inchoo Social Connect Twitter related features, you will also need to enable Sign in with Twitter

after creating your Twitter Application. Here’s gallery of screenshots to guide you trough this process:

Page 25: Introductution to social connect Magento extension
Page 26: Introductution to social connect Magento extension
Page 27: Introductution to social connect Magento extension
Page 28: Introductution to social connect Magento extension
Page 29: Introductution to social connect Magento extension
Page 30: Introductution to social connect Magento extension

Configuring Social ConnectClient keys and secrets obtained in previous sections are to be

placed inside appropriate Social Connect tab input fields accessible at System -> Configuration -> Customers -> Customers

Configuration page inside your Magento admin.

Page 31: Introductution to social connect Magento extension

Follow us on https://www.facebook.com/LetsNurture

https://twitter.com/letsnurture

http://www.linkedin.com/company/letsnurture

www.letsnurture.com | www.letsnurture.co.uk