『裏』ブログ作成を機に
wordpressで、googlephotoから簡単に画像を取り込むプラグインは無いのか！？と調べてみたらありました。(^ｰ^)
こちらを参考に設定を備忘録として残します。
wordpressで画像を表示する際に、Googleフォトにアップロードしてある画像を表示するプラグイン「Photo Express for Google」をご紹介します。以前はプラグインを使わず、右クリックで「画像アドレスをコピー」してimgタグで表示してました。が・・・少し経つと画像が表示されなくなるという事態に。...blog.pleeds.com
こんな感じで、投稿画面でGoogleフォトの画像がモーダル上に表示されて、クリックで簡単に画像を挿入可能。
Photo Express for Googleをインストール
プラグイン新規追加で「Photo Express for Google」を検索し、インストール
「プラグインを有効化」リンクをクリック
Photo Express for Googleの設定
Googleフォトの画像を挿入できるように設定。
設定を行わないと、以下のように画像が表示されず、Googleフォトの画像が挿入できない。
Photo Express for Googleの設定画面表示
「設定」 > 「Photo Express for Google」で設定画面を表示。
「Click here to configure private access to Google Photo」リンクをクリック
「Google OAuth Client Details」の設定のStep1の画面が表示される。
9、10に記載されているURLをテキストエディターなどに残しておく。後で使用。
「Google Developer Console」リンクをクリック
Google APIのプロジェクト作成画面が表示される。
プロジェクト名に任意の名称を入力し、同意するの「はい」にチェックを入れて「保存」ボタンをクリック。
プロジェクト名は何でもいい。「Photo Express for Google」で良し。
OAuth同意画面の設定
プロジェクトの作成が完了すると認証情報の画面になり、「OAuth同意画面」のタブが出てくるので、「OAuth同意画面」のタブをクリック。
メールアドレスにはGoogleにログインしたメールアドレスが入力されているので、そのままでOK。
「ユーザーに表示するサービス名」に任意の名称を入力します。
「Photo Express for Google」で。
「保存」ボタンをクリックし、保存。
認証情報の設定
「認証情報」タブをクリックし、「認証情報を作成▼」ボタンをクリック
「OAuthクライアントID」を選択。
認証情報の入力画面が表示されるので、以下の内容を入力し、「作成」ボタンをクリック
アプリケーションの種類 ウェブアプリケーション 名前 任意の名称。「Google Photo WordPress Plugin」など 承認済みのJavaScript生成元 「Photo Express for Googleの設定画面表示」で保存しておいた9のURL 承認済みのリダイレクトURI 「Photo Express for Googleの設定画面表示」で保存しておいた10のURL
OAuthクライアントID（OAuth Client ID）とOAuthクライアントシークレット（OAuth Client secret）が表示されるので、テキストエディタなどに保存しておく。
保存したら、この画面（Google API）は閉じてもOK。
wordpressのPhoto Express for GoogleでOAuthの設定
wordpressのPhoto Express for Google設定画面に戻って、先ほどのOAuthクライアントID（OAuth Client ID）とOAuthクライアントシークレット（OAuth Client secret）を。
入力が完了したら、「Save Details」ボタンをクリック。
「Continue」ボタンが表示されるので、クリック。
Photo Express for GoogleのSTEP2の設定
「link」リンクをクリック。
「写真と動画を管理」の許可リクエスト画面表示されるので、「許可」をクリック。
ここでエラー画面が表示される場合あり。
「400. That’ an error. Error: redirect_uri_mismatch」のエラー。
これは、「認証情報の設定」のところで「承認済みのJavaScript生成元」「承認済みのリダイレクトURI」を未入力または、間違っている場合にエラーに。
Successfully・・・が画面に表示されていればOK。
