ベストセラー人気 WordPress テーマTop 30 詳細

WooCommerce ソーシャルログインプラグイン - YITH WooCommerce Social Login

Last Updated:2020年11月14日| コメントを残す
  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

WordPress WooCommerce サイトから Facebook, Twitterは、GoogleなどのSNSアカウントにログインできるように連動する場合 WooCommerce ソーシャルログインプラグインを使用することができます。 WooCommerceに使用できる無料のプラグインとしてYITH WooCommerce Social Login、 Social Login Lite For WooCommerce などがあります。

YITHプラグインには、無料版とプレミアム版があります。 ソーシャルアイコンの変更などの追加機能が必要ない場合は、無料版でも十分と思われる。 ここでは、無料版を使用して Facebook 連動方法について簡単に説明します。

数年前に Facebook アカウントにログインするように連動する方法について扱ったことがあったが、インターフェースが少し変わったようです。 Facebook ソーシャルログイン連動を有効にするには、サイトで利用できるセキュリティサーバSSL証明書がインストールされている必要があります。

Naver、その後、カカオアカウントなどでログインするように連動する場合恵みの雨ストアのOne Stop Social Loginのようなプラグインがあったが、今は販売中止されたようで、代わりに アルティメットメンバーコリアこの機能が提供されているようです。

WooCommerce ソーシャルログインプラグイン - YITH WooCommerce Social Login

WooCommerce ソーシャルログインプラグイン -  YITH WooCommerce Social Login無料版

YITH WooCommerce Social Loginプラグインを使用すると、 Facebook, Twitterは、Googleアカウントに WordPress サイトにログインしたり、会員登録することができます。

このプラグインは、無料版と有料版があり、無料版では、次のような機能を提供しています。

  • Facebookログイン
  • Twitterでログイン
  • グーグルでログイン
  • 「Login with "フレーズカスタマイズ可能
  • チェックアウトページでのテキストのカスタマイズが可能

プラグインをインストールするには、管理者ページで プラグイン]> [新規追加をクリックして、「YITH WooCommerce Social Login」を検索してインストールして有効にします。

WordPress プラグインのインストール

プラグインをインストールして有効にして左側のメニューから YITH> Social Loginをクリックして設定ページに移動して設定することができます。

WooCommerceから Facebook ログイン連動する

Facebook アカウントにログイン/会員登録ができるように連動する方法について簡単に説明します。

Facebook ログインを有効にするには、Facebook App IDとFacebook Secret情報が必要です。

WooCommerce ソーシャルログイン -  Facebook 連動

この情報を得るためには Facebook 開発者のサイト(https://developers.facebook.com/apps)を訪問して、新しいアプリを作成します。

Facebook for Developersサイトにアクセスすると、生成されたアプリの一覧が表示されます。 新しいアプリを追加(Add a New App)をクリックします。

Facebook 開発者サイト - アプリ作成

新しいアプリIDの作成(Create a New App ID) ポップアップウィンドウが表示さ 表示名(Display Name)連絡先メールアドレス(Contact Email)を入力して アプリIDの作成(Create App ID)をクリックします。

Facebook アプリIDの作成 - ソーシャルログイン連動

製品の追加(Select a Product) ページから Facebookログイン(Facebook Login)設定(Set Up) ボタンをクリックします。

Facebookログインアプリを作る -  Facebook ログイン連動

ウェブ(Web) オプションを選択します。

WooCommerce Facebook ログイン連動

サイトのURL(Site URL)を入力して セットで€6をクリックします。

WordPress Facebook ログイン連動設定 -  Facebook アプリ作成

残りの2(JavaScript用Facebook SDKの設定)、3(ログイン状態を確認)、4(Facebookログインボタンを追加)、5(次のステップ)のオプションは、スキップするようにします。 アプリのレビューは、要求しないようにします。

ここまで進行したら、重要な設定さえあれば、ほぼ完了します。 WordPress 管理者ページ> YITH> Social Login> Facebook Settingsから コールバックURLをコピーします。

YITH WooCommerce ソーシャルログイン Facebook 設定

コピーしたコールバックURLを Facebookの 製品> Facebookログイン>設定 セクションの "有効なOAuthリダイレクトURI(Valid OAuth redirect URIs)"フィールドに貼り付けます。

WordPress Facebook ログイン会員登録連動

設定>基本設定をクリックすると、 アプリIDアプリシークレットコードを確認することができます。 このIDとコードをYITH Social Loginプラグインの Facebook 設定セクションに入力するようにします。

WooCommerce Facebook ログイン会員登録連動

名前空間、アプリドメイン、個人情報の処理方針URL、サービス利用規約のURLを入力して、上部の「開発中」ボタンをクリックすると、「ライブ済み」に変わります。

今 Facebook アカウントにログインしようとすると、通常のログインになります。 もし "URLを読み込むことができません:アプリドメインに含まれていないURLです」エラーメッセージが表示される場合、上記の図では、アプリドメインにドメインを入力してみてください。

ソーシャルログインアイコンとフレーズが気に入らず表示されている場合は、単純なCSSを使用して調整することができます。

WooCommerce マイアカウントページに Facebook ログインアイコンを追加

無料版だけで満足していない場合は、プレミアムバージョンを考慮してみることができますが、価格のために、あえて有料版を利用する必要はないようです。 無料版とプレミアム版の機能の詳細については、プラグインのページを参照してみてください。

参照



コメントを残す

コメント