WP Rocket - WordPress Caching Plugin

【図解&動画解説】wordpressログインにソーシャルアカウントログイン機能追加

HanamiWEBオンラインスクールでは

●バーチャル自習室でのリアルタイム質問!

●チャットで質問し放題!

●24時間学び放題のEラーニング教材!

全部ついて 2,500円/月!

wordpressのログインにソーシャルログイン機能を追加する方法をwordpressの先生が丁寧に解説します!

Super Socializer】というプラグインを使う事でソーシャルログインを可能にします。

wordpressログインにソーシャルアカウントログイン機能追加

ワンクリックでログイン出来るので、パスワード忘れの心配がない事と、会員サイトによっては会員にもソーシャルログイン機能を実装出来ます!

例えばSimple membershipという会員サイト構築のプラグイン

【図解&動画解説】Simple Memberships会員登録プラグイン~ソーシャルログイン設定方法~

WordPress Social Share, Social Login and Social Comments Plugin – Super Socializerプラグイン設定

正式名称はWordPress Social Share, Social Login and Social Comments Plugin – Super Socializer。こちらを使ってソーシャルログイン機能を有効化にします。

WordPress Social Share, Social Login and Social Comments Plugin – Super Socializerプラグインのインストール&有効化

wordpresssプラグインの検索でSuper Socializerを調べ、プラグインをインストール&有効化します。

wordpressログインにソーシャルアカウントログイン機能追加

【Super Socializer】>【Social Login】

左サイドバーに【Super Socializer】という項目が追加されるので、その中の【Social Login】をクリックして設定へ進みます。

wordpressログインにソーシャルアカウントログイン機能追加

ソーシャルログインを有効にする

チェックを入れていれます。

wordpressログインにソーシャルアカウントログイン機能追加

ログインに使用したいSocialサイトのIDとシークレットキーが必要になります。今回はgoogleをご紹介します。

wordpressログインにソーシャルアカウントログイン機能追加

googleログイン設定

API管理コンソールへアクセス

https://console.developers.google.com/dcredirect/

上記URLからgoogleAPI管理コンソールへ移動します。

プロジェクトを作成

プロジェクトを作成をクリック

wordpressログインにソーシャルアカウントログイン機能追加

好きなプロジェクト名を入力

好きなプロジェクト名を入力し、組織なしのまま【作成】をクリックします。

wordpressログインにソーシャルアカウントログイン機能追加

ダッシュボードへ移動

wordpressログインにソーシャルアカウントログイン機能追加

OAuth同意画面

外部を選択して【作成】

wordpressログインにソーシャルアカウントログイン機能追加

OAuth同意画面

設定する項目は

  1. アプリケーション名
  2. 承認済ドメイン
wordpressログインにソーシャルアカウントログイン機能追加

1.アプリケーション名

何でも構いませんが、サイト名や会社名がおすすめです。

2.承認済ドメイン

●●●.com等使用するサイトのドメインを入力します。httpsなどは不要です。

ドメインを入力したらエンターを押す事を忘れないでください。入力したドメインが確定しません。

3.最後に保存ボタンをクリック

認証情報

左サイドメニューの【認証情報】をクリックして【+認証情報を作成】をクリックします。

wordpressログインにソーシャルアカウントログイン機能追加

OAuthクライアントIDをクリック

wordpressログインにソーシャルアカウントログイン機能追加

ウェブアプリケーションを選択

wordpressログインにソーシャルアカウントログイン機能追加

詳細設定

設定する項目は以下の2か所

  1. 名前
  2. 承認済リダイレクトURL
wordpressログインにソーシャルアカウントログイン機能追加

1.名前

何でも構いませんが、サイト名や会社名をお勧めします

2.承認済のリダイレクトURI

サイトのURLをコピーしてきます。この時はhttps://~始まる正式なURLを入力します。

URLをコピーした際に末尾に/が入る事があるのですが、ここでは/は入れないように注意をして下さい。

3.作成ボタンをクリック

クライアントIDが作成されました。鉛筆アイコンをクリックするとクライアントIDとシークレットキーを確認する事が出来ます。

wordpressログインにソーシャルアカウントログイン機能追加

クライアントIDとクライアントシークレットの確認

wordpressログインにソーシャルアカウントログイン機能追加

ログイン画面にgoogleアイコンが出る

wordpress用のユーザー名とパスワードを入力しなくても、googleアイコンクリックで管理画面へログイン出来るようになりました!

googleのアカウント(gmailやGsuitに登録しているメールアドレス)でユーザー登録を済ませておく必要があります。

wordpressログインにソーシャルアカウントログイン機能追加

HanamiWEB

この記事を書いた人

松浦 みさ

株式会社HanamiWEB / Web制作・SEO・AI検索対策サポート

東京都練馬区を中心に、中小企業向けのホームページ制作、SEO対策、AI検索時代を見据えたサイト設計をサポートしています。
WordPressを活用した実務ベースの改善提案や、集客導線を意識したコンテンツ設計が得意です。
サイト保守運用も代行しております。

最短翌朝公開!土日祝も対応します!

超お急ぎホームページ制作プラン

超お急ぎでホームページを必要としている方向けの、ホームページ超お急ぎ制作プラン行っております!

最短翌朝公開、土日祝も対応します!お困りの方は是非、以下のバナーより詳細をご確認ください!

新着記事

練馬区 ホームページ制作で2位|AIに引用されるサイトの作り方を解説
ホームページ更新代行とは?費用・相場・依頼方法をわかりやすく解説
RankMathの「ウェブマスターツール」設定ガイド|Google Search Console・Bing
RankMath「パンくずリスト」設定ガイド
ja日本語