この記事では、ワードプレスのプラグインWP Mail SMTPの「Client ID」「Client Secret」がよくわからないという質問が多いので説明をしていきます。
基本的にはGmailで送信することを想定して、「Client ID」「Client Secret」を入手していき、送信メールが迷惑メールに入らないように設定します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得1](https://solabotschool.com/wp-content/uploads/2021/07/d6e73f1aa3894251fd36bf26ebc158af-1024x576.png)
もくじ
WP Mail SMTPとは
30秒で説明すると、ワードプレスサイトから誰かしらにメールを送る場合。
たとえば、会員サイトで会員登録してれたら、自動返信でお礼のメールを送るなんていうときに、ワードプレスの設定項目でGmailのアドレスを設定していると、送信者はワードプレスサーバーだけど、実際に送っているのがGmailサーバーということになり、受け取り手はそのサーバーの相違から迷惑メール扱いで受け取ってしまいます。
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/wpmailsmtp48-1024x576.png)
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/dbc35151efd1d40ec85fa9c6c7741625-1024x576.png)
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/95a5d09aa7f985eb13a217ff945143d0-1024x576.png)
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/36b2897e0731fc5846314f8980374391-1024x576.png)
それを防ぐために、Gmailから一度ワードプレスのサーバーを経由してメールを送るのがこのプラグインです。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得2](https://solabotschool.com/wp-content/uploads/2021/07/wpmailsmtp49-1024x576.png)
プラグインのインストール
まずは、WordPressの管理画面にある左メニュー一覧から「プラグイン」にマウスを乗せて、表示された項目から「新規追加」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得3](https://solabotschool.com/wp-content/uploads/2021/07/ff82e6e01c42c0fe680f5901b085b216-1024x576.png)
すると、プラグインの追加画面が表示されるので、画面右上の「プラグインの検索」という入力欄に「WP Mail SMTP by WPForms」と入力。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得4](https://solabotschool.com/wp-content/uploads/2021/07/0da5c290f55597326555e444b55ac4ea-1024x576.png)
以下をコピーしてご利用ください。
入力すると、すぐに結果が表示されます。
一番最初に表示された鳥のようなマークのものが該当のプラグインです。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得5](https://solabotschool.com/wp-content/uploads/2021/07/e680024857f1b542d9fcdf47d9e0e7df-1024x576.png)
※マークは変更になる場合があります。
「今すぐインストール」をクリックして、そのまま、「有効化」ボタンもクリックしましょう。
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/5ca37ce9fa68b966e6d78ee1e1f0f3f3-1024x576.png)
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/f838543552e89010899cc405558aa0a3-1024x576.png)
このプラグインが有効になると、専用のセットアップの画面が開きます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得6](https://solabotschool.com/wp-content/uploads/2021/07/7d91d43a76b2e075555dad17b7261175-1024x576.png)
「ダッシュボード」ボタンからワードプレスの管理画面に戻ることもできます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得7](https://solabotschool.com/wp-content/uploads/2021/07/9abdbffdd23f7f10a1db302959988b69-1024x576.png)
その場合は管理画面左メニュー内の「設定」から操作していくことも可能ですが、特に設定項目の違いはないので、このままセットアップウィザードで進めていきます。
セットアップ画面では、画面中央の「始めましょう」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得8](https://solabotschool.com/wp-content/uploads/2021/07/bcb97dddbd5bcdb4513e22a4b07b1b1a-1024x576.png)
すると、メーラー選択画面に移動するので、Gmailを選択して画面右下の、「保存して続行」をクリックします。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得9](https://solabotschool.com/wp-content/uploads/2021/07/693404dcbdfca4e7cec6d9b5cf8057e6-1024x576.png)
ポップアップで確認画面が表示されるので「I Understand,Continue」をクリックして、設定を続けていきます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得10](https://solabotschool.com/wp-content/uploads/2021/07/c1e10572c6302891f2dd6c7f1e10f787-1024x576.png)
次の画面では「Client ID」「Client Secret」を入力する項目がありますが、それぞれを作成してからになるので、このページはいったんこのままにしてWEBアプリを作っていきましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得11](https://solabotschool.com/wp-content/uploads/2021/07/1feb0aa3ff066751d3197332b547126e-1024x576.png)
WP Mail SMTPの設定
GoogleアカウントでWebアプリを作成する
いきなり難しそうな話になりましたが、説明通り進めていけば簡単に作成できますのでご安心ください。
利用したいGmailのアカウントで、専用の「ID」と「パスワード」を作るというイメージです。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得12](https://solabotschool.com/wp-content/uploads/2021/07/7a4d2c8a728e40e0495d2913e5268e60-1024x576.png)
これがそのまま「Client ID」「Client Secret」になります。
まずは、利用したいGmailのアカウントにログインした状態で「Google CloudPlatform」にアクセスします。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得13](https://solabotschool.com/wp-content/uploads/2021/07/f3b36036681f771d9d666d00975cf737-1024x576.png)
Google CloudPlatformに移動すると「Google CloudPlatformでGmailAPIにアプリケーションを登録する」という名前のフォームが表示されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得14](https://solabotschool.com/wp-content/uploads/2021/07/1f7919aa5fc2f78365bc02459c933e20-1024x576.png)
「利用規約」の同意にチェックを入れて「居住国」が「日本」になっていることを確認し、「同意して続行」をクリックします。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得15](https://solabotschool.com/wp-content/uploads/2021/07/5eb0dc78d88b3a279dd0d6b9b0b9ec73-1024x576.png)
Googleからのメールを受け取るかの項目はどちらでも構いません。
「同意して続行」をクリックしても反応がないように感じますが、裏ではちゃんと動いているので、画面が変わるまで少しお待ちください。
画面が切り替わると、「APIが有効になっている」という表示が出るので、そのまま「認証情報に進む」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得16](https://solabotschool.com/wp-content/uploads/2021/07/391b67367a39f493c41160b39a3b34fc-1024x576.png)
認証情報の作成画面に移動するので、アクセスするデータの種類で「ユーザーデータ」にチェックを入れて、「次へ」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得17](https://solabotschool.com/wp-content/uploads/2021/07/f079efb9f91fd149ebb65be07ad008bf-1024x576.png)
次に、アプリ情報の入力画面が表示されるので必要事項を入力します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得18](https://solabotschool.com/wp-content/uploads/2021/07/2bdba253b6ab9e78262ba30dbc3eb1cd-1024x576.png)
アプリ名には何用に使うかわかりやすいように「WP Mail SMTP」と入れておきましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得19](https://solabotschool.com/wp-content/uploads/2021/07/047be143ba1bd6f3935fc62fd402d667-1024x576.png)
「ユーザーサポートメール」にはご利用になる「メールアドレス」を入力します。
クリックするとメールアドレスが選択できるようになっているので選択しましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得20](https://solabotschool.com/wp-content/uploads/2021/07/e23609a22a665953332e9b5208006fba-1024x576.png)
「アプリのロゴ」は空欄で構いません。
「デベロッパーの連絡先情報」も先ほどのメールアドレスでOKです。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得21](https://solabotschool.com/wp-content/uploads/2021/07/2c1d8df1de71b8f0f6e501f4378143a9-1024x576.png)
そのまま「保存して次へ」をクリック。
次の「スコープ」という項目は省略可能なので「保存して次へ」をクリックして飛ばします。
次に、「OAuthクライアントID」という項目で「アプリケーションの種類」をクリックして選択項目から「ウェブアプリケーション」を選択します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得22](https://solabotschool.com/wp-content/uploads/2021/07/090141616fac174e8d2257b4ba3c4a05-1024x576.png)
「名前」の部分は識別用に使うだけなので「WP Mail SMTP」などと入力しておきましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得23](https://solabotschool.com/wp-content/uploads/2021/07/162b7274dd1a6d99428699b6f818ec2b-1024x576.png)
次の「承認済みのJavaScript生成元」は飛ばして、「承認済みのリダイレクトURI」にある、「+URIを追加」ボタンをクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得24](https://solabotschool.com/wp-content/uploads/2021/07/d665ff9dc6800c2f70f230ab3553693c-1024x576.png)
表示される入力欄に決められたURLを入力します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得25](https://solabotschool.com/wp-content/uploads/2021/07/78c925983f78da01a55f153900a766b1-1024x576.png)
Gmailを利用する場合は、このURLを入力してください。
このURLはプラグインのセットアップ画面にも表示されているのでそちらからコピーしてご利用ください。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得26](https://solabotschool.com/wp-content/uploads/2021/07/8b37c0d3d67c4cc098a42105dbf09956-1024x576.png)
入力ができたら、「作成」ボタンをクリックしてこの手順を完了します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得27](https://solabotschool.com/wp-content/uploads/2021/07/7667e824cf540e932f72422a5107c35d-1024x576.png)
次の画面でクライアントIDが出てきますが、ここではいったん無視して、一番下の「完了」をクリックしましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得28](https://solabotschool.com/wp-content/uploads/2021/07/174d10b5704aad2fe95f81f0b5df0608-1024x576.png)
すると、APIキーやクライアントIDなどの項目が並んだページが表示されます。
このまま画面左メニューにある「OAuth同意画面」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得29](https://solabotschool.com/wp-content/uploads/2021/07/94c974aa836eabf0ba151f92965ae097-1024x576.png)
公開ステータスという項目が「テスト」になっているので、「アプリを公開」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得30](https://solabotschool.com/wp-content/uploads/2021/07/87379e6a2531a9c9176e0ca651ee436f-1024x576.png)
すると、「Googleアカウントを持っているすべてのユーザーがアプリを利用できるようになります」
というポップアップが表示されますが、このアプリにアクセスできるのはあなただけなので心配しなくても大丈夫です。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得31](https://solabotschool.com/wp-content/uploads/2021/07/67bd86d2890a089e15740cccea0c653b-1024x576.png)
このアプリは、ワードプレスのサイト管理画面でのみ使用されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得32](https://solabotschool.com/wp-content/uploads/2021/07/2daac05190453c0466dc19f11f6dee8b-1024x576.png)
ポップアップ内の「確認」ボタンをクリックすると、公開ステータスが、テストから本番環境に移行します。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得33](https://solabotschool.com/wp-content/uploads/2021/07/b32fe4d49f1cd8b690b9405ba6926f2a-1024x576.png)
次に、画面左のメニューから「認証情報」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得34](https://solabotschool.com/wp-content/uploads/2021/07/436c7de687ebca9d270e72176e8244b8-1024x576.png)
表示された項目の真ん中にある「OAuth 2.0 クライアントID」という項目の中から右端にある鉛筆マークの「OAuthクライアントを編集」ボタンをクリックすると、「Client ID」と「Client Secret」が表示されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得35](https://solabotschool.com/wp-content/uploads/2021/07/d99f5b989971c59a2d2fa6e0cc3c8d0e-1024x576.png)
移動した先の画面右側に「クライアントID」と「クライアントシークレット」がそれぞれ表示されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得36](https://solabotschool.com/wp-content/uploads/2021/07/0697849903873361a9e7b61d3aa687c7-1024x576.png)
入手したIDとキーの貼り付け
「クライアントID」と「クライアントシークレット」をそれぞれ間違いのないように丁寧にコピーしてプラグインのセットアップ画面に貼り付けましょう。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得37](https://solabotschool.com/wp-content/uploads/2021/07/eea43e14d08eab191abcc920e25a2328-1024x576.png)
貼り付けできたら「Googleと連携」ボタンをクリックします。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得38](https://solabotschool.com/wp-content/uploads/2021/07/25df703ce8248e42cdd12188a35e9f0f-1024x576.png)
するとアカウント確認画面が表示されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得39](https://solabotschool.com/wp-content/uploads/2021/07/514fe98e535f9f1ff468ad70d3a18abf-1024x576.png)
※アカウントがひとつの場合は表示されない可能性があります。
使用するアカウントを選択すると「このアプリはGoogleで確認されていません」という警告のような画面が表示されますが自分だけが使うアプリを作っただけなので、気にする必要はありません。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得40](https://solabotschool.com/wp-content/uploads/2021/07/a563884b04370415cc9d23e809236c50-1024x576.png)
画面左下にある「詳細」ボタンをクリックして、表示された「(安全ではないページ)に移動」をクリックします。
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/0aa02ee5968045bb23eb1fbc3a45bc0f-1024x576.png)
![【2021年最新】Wp Mail SMTPのクライアントIDとクライアントシークレットの取得](https://solabotschool.com/wp-content/uploads/2021/07/5e9c5dda76f46de04f5663cf64cc9ea1-1024x576.png)
すると、ポップアップで権限の付与が表示されるので、「許可」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得41](https://solabotschool.com/wp-content/uploads/2021/07/4fae7f0031ffbb02eb629aa5c4f4a727-1024x576.png)
すると、ご自身のWEBサイトがあなたの代わりにメールを送信する許可を求める画面が表示されます。
内容を確認して改めて「許可」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得42](https://solabotschool.com/wp-content/uploads/2021/07/dc76b163e5e8900365b239dbb44fda69-1024x576.png)
すると、認証成功の画面が表示されます。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得43](https://solabotschool.com/wp-content/uploads/2021/07/d707ee586321bd75ae4934b6704aaf15-1024x576.png)
「OK」をクリックすると、先ほどの画面に戻るので、スクロールして「Close and exit the Setup Wizard」をクリックしてワードプレスの管理画面に戻ります。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得44](https://solabotschool.com/wp-content/uploads/2021/07/70ed2db9a302853582e459afd44b4534-1024x576.png)
テスト送信で確認
後は正しく設定ができたか、テストメールを送信して確認するだけです。
ワードプレスの管理画面に戻ってきたら、WP Mail SMTPの設定画面が表示されているので、画面上部のタブから、「メールテスト」をクリックします。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得45](https://solabotschool.com/wp-content/uploads/2021/07/cf30833f62178b631205d113c63d62ff-1024x576.png)
送信先のメールアドレスに、ご自身が利用しているメールアドレスを入力して「メールを送信」をクリック。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得46](https://solabotschool.com/wp-content/uploads/2021/07/c78f0774f5f6eb300257ef9fb1bb03b0-1024x576.png)
これで、入力したメールアドレス宛にメールが届くので、迷惑メールに振り分けられず受信トレイに入っていたら成功です。
![Wp Mail SMTPのクライアントIDとクライアントシークレットの取得47](https://solabotschool.com/wp-content/uploads/2021/07/7f37c041b3cfc1aedb800fa22233bf93-1024x576.png)
まとめ
お疲れ様でした。
ワードプレスでサイトを運営していると、何かしらの理由でメールを送信する場面は出てきますよね。
そんなときに、迷惑メール扱いになってしまっては開封してもらえないかもしれません。
自分宛に送るような場合でも、迷惑メールに入ってしまうと探すのが大変になってしまいます。
そんな場合はこのWP Mail SMTPを利用してみましょう。
ポイントは正しく「クライアントID」と「クライアントシークレット」を 取得することだけです。