【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得

この記事では、ワードプレスのプラグインWP Mail SMTPの「Client ID」「Client Secret」がよくわからないという質問が多いので説明をしていきます。

基本的にはGmailで送信することを想定して、「Client ID」「Client Secret」を入手していき、送信メールが迷惑メールに入らないように設定します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得1

WP Mail SMTPとは

30秒で説明すると、ワードプレスサイトから誰かしらにメールを送る場合。

たとえば、会員サイトで会員登録してれたら、自動返信でお礼のメールを送るなんていうときに、ワードプレスの設定項目でGmailのアドレスを設定していると、送信者はワードプレスサーバーだけど、実際に送っているのがGmailサーバーということになり、受け取り手はそのサーバーの相違から迷惑メール扱いで受け取ってしまいます。

それを防ぐために、Gmailから一度ワードプレスのサーバーを経由してメールを送るのがこのプラグインです。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得2

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

まずは、WordPressの管理画面にある左メニュー一覧から「プラグイン」にマウスを乗せて、表示された項目から「新規追加」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得3

すると、プラグインの追加画面が表示されるので、画面右上の「プラグインの検索」という入力欄に「WP Mail SMTP by WPForms」と入力。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得4

以下をコピーしてご利用ください。

\ コピーするボタンでコピーできます! /
コピーしました!
コピーする

入力すると、すぐに結果が表示されます。

一番最初に表示された鳥のようなマークのものが該当のプラグインです。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得5

※マークは変更になる場合があります。

「今すぐインストール」をクリックして、そのまま、「有効化」ボタンもクリックしましょう。

このプラグインが有効になると、専用のセットアップの画面が開きます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得6

「ダッシュボード」ボタンからワードプレスの管理画面に戻ることもできます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得7

その場合は管理画面左メニュー内の「設定」から操作していくことも可能ですが、特に設定項目の違いはないので、このままセットアップウィザードで進めていきます。

セットアップ画面では、画面中央の「始めましょう」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得8

すると、メーラー選択画面に移動するので、Gmailを選択して画面右下の、「保存して続行」をクリックします。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得9

ポップアップで確認画面が表示されるので「I Understand,Continue」をクリックして、設定を続けていきます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得10

次の画面では「Client ID」「Client Secret」を入力する項目がありますが、それぞれを作成してからになるので、このページはいったんこのままにしてWEBアプリを作っていきましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得11

WP Mail SMTPの設定

GoogleアカウントでWebアプリを作成する

いきなり難しそうな話になりましたが、説明通り進めていけば簡単に作成できますのでご安心ください。

利用したいGmailのアカウントで、専用の「ID」「パスワード」を作るというイメージです。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得12

これがそのまま「Client ID」「Client Secret」になります。

まずは、利用したいGmailのアカウントにログインした状態で「Google CloudPlatform」にアクセスします。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得13

Google CloudPlatformはこちら

Google CloudPlatformに移動すると「Google CloudPlatformでGmailAPIにアプリケーションを登録する」という名前のフォームが表示されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得14

「利用規約」の同意にチェックを入れて「居住国」「日本」になっていることを確認し、「同意して続行」をクリックします。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得15

Googleからのメールを受け取るかの項目はどちらでも構いません。

「同意して続行」をクリックしても反応がないように感じますが、裏ではちゃんと動いているので、画面が変わるまで少しお待ちください。

画面が切り替わると、「APIが有効になっている」という表示が出るので、そのまま「認証情報に進む」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得16

認証情報の作成画面に移動するので、アクセスするデータの種類で「ユーザーデータ」にチェックを入れて、「次へ」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得17

次に、アプリ情報の入力画面が表示されるので必要事項を入力します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得18

アプリ名には何用に使うかわかりやすいように「WP Mail SMTP」と入れておきましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得19

「ユーザーサポートメール」にはご利用になる「メールアドレス」を入力します。

クリックするとメールアドレスが選択できるようになっているので選択しましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得20

「アプリのロゴ」は空欄で構いません。

「デベロッパーの連絡先情報」も先ほどのメールアドレスでOKです。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得21

そのまま「保存して次へ」をクリック。

次の「スコープ」という項目は省略可能なので「保存して次へ」をクリックして飛ばします。

次に、「OAuthクライアントID」という項目で「アプリケーションの種類」をクリックして選択項目から「ウェブアプリケーション」を選択します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得22

「名前」の部分は識別用に使うだけなので「WP Mail SMTP」などと入力しておきましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得23

次の「承認済みのJavaScript生成元」は飛ばして、「承認済みのリダイレクトURI」にある、「+URIを追加」ボタンをクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得24

表示される入力欄に決められたURLを入力します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得25

Gmailを利用する場合は、このURLを入力してください。

\ コピーするボタンでコピーできます! /
コピーしました!
コピーする

このURLはプラグインのセットアップ画面にも表示されているのでそちらからコピーしてご利用ください。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得26

入力ができたら、「作成」ボタンをクリックしてこの手順を完了します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得27

次の画面でクライアントIDが出てきますが、ここではいったん無視して、一番下の「完了」をクリックしましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得28

すると、APIキーやクライアントIDなどの項目が並んだページが表示されます。

このまま画面左メニューにある「OAuth同意画面」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得29

公開ステータスという項目が「テスト」になっているので、「アプリを公開」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得30

すると、「Googleアカウントを持っているすべてのユーザーがアプリを利用できるようになります」

というポップアップが表示されますが、このアプリにアクセスできるのはあなただけなので心配しなくても大丈夫です。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得31

このアプリは、ワードプレスのサイト管理画面でのみ使用されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得32

ポップアップ内の「確認」ボタンをクリックすると、公開ステータスが、テストから本番環境に移行します。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得33

次に、画面左のメニューから「認証情報」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得34

表示された項目の真ん中にある「OAuth 2.0 クライアントID」という項目の中から右端にある鉛筆マークの「OAuthクライアントを編集」ボタンをクリックすると、「Client ID」「Client Secret」が表示されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得35

移動した先の画面右側に「クライアントID」「クライアントシークレット」がそれぞれ表示されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得36

入手したIDとキーの貼り付け

「クライアントID」「クライアントシークレット」をそれぞれ間違いのないように丁寧にコピーしてプラグインのセットアップ画面に貼り付けましょう。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得37

貼り付けできたら「Googleと連携」ボタンをクリックします。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得38

するとアカウント確認画面が表示されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得39

※アカウントがひとつの場合は表示されない可能性があります。

使用するアカウントを選択すると「このアプリはGoogleで確認されていません」という警告のような画面が表示されますが自分だけが使うアプリを作っただけなので、気にする必要はありません。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得40

画面左下にある「詳細」ボタンをクリックして、表示された「(安全ではないページ)に移動」をクリックします。

すると、ポップアップで権限の付与が表示されるので、「許可」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得41

すると、ご自身のWEBサイトがあなたの代わりにメールを送信する許可を求める画面が表示されます。

内容を確認して改めて「許可」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得42

すると、認証成功の画面が表示されます。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得43

「OK」をクリックすると、先ほどの画面に戻るので、スクロールして「Close and exit the Setup Wizard」をクリックしてワードプレスの管理画面に戻ります。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得44

テスト送信で確認

後は正しく設定ができたか、テストメールを送信して確認するだけです。

ワードプレスの管理画面に戻ってきたら、WP Mail SMTPの設定画面が表示されているので、画面上部のタブから、「メールテスト」をクリックします。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得45

送信先のメールアドレスに、ご自身が利用しているメールアドレスを入力して「メールを送信」をクリック。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得46

これで、入力したメールアドレス宛にメールが届くので、迷惑メールに振り分けられず受信トレイに入っていたら成功です。

Wp Mail SMTPのクライアントIDとクライアントシークレットの取得47

まとめ

お疲れ様でした。

ワードプレスでサイトを運営していると、何かしらの理由でメールを送信する場面は出てきますよね。

そんなときに、迷惑メール扱いになってしまっては開封してもらえないかもしれません。

自分宛に送るような場合でも、迷惑メールに入ってしまうと探すのが大変になってしまいます。

そんな場合はこのWP Mail SMTPを利用してみましょう。

ポイントは正しく「クライアントID」「クライアントシークレット」を 取得することだけです。

【あきらめないがモットー】ベビー用品・子供おもちゃ企業マネージャー→パソコン教室の教室長→フリーランス/35歳既婚で娘二人は4歳と2歳/WEBサイト・アプリ・SNS全般についてご指導・代行/スキルはHTML・CSS・JavaScript・Jquery・php 企業様からの執筆依頼なども行っています。 WordPressのカスタマイズ・HP作成・各種ご指導やお困りごとはこちらから

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


フォームから

当サイト選択肢に沿ってご依頼

問い合わせする
LINEから

お友達追加で手軽にトーク相談

友達追加する