MENU

Google Photo の埋め込みコードを生成してウェブサイトに貼り付ける方法

2020 6/15
目次

Google photo 埋め込みコードについて

プライベートの写真置き場としてGoogle Photosを利用している人も多いと思います。

以前は、ウェブサイトの埋め込みコードが取得できたらしいのですが、現在は共有リンクの取得のみで、埋め込みコードを生成することはできません。

そこで、CTRLQ.org の埋め込みコード生成機能を利用します。無料です。

Digital Inspiration
Embed Google Photos - Add Images from Google Photos in your Website
Embed Google Photos - Add Images from Google Photos in your WebsiteOnline tool helps you easily embed any image hosted on Google Photos into your website, email message or blog.

埋め込みコードの生成

1) Google Photos で共有リンクを取得する。

埋め込みたい写真を選択し、共有リンクをコピーします。

Google Phots 共有リンクを取得する

2)CTRLQ.org の埋め込みコードを生成する

PASTE GOOGLE PHOTOS LINK HERE... に共有リンクを貼り付け、GENERATE CODEをクリックします。

Google Photos 埋め込みコードを生成

埋め込みコードをコピー

クリックしたら、ページ下方にジャンプし、GOOGLE PHOTOS EMBED CODE の Image Embed Code をコピーします。

Google Phots 埋め込みコードのコピー

表示したい場所にコードを貼り付ける

表示したい場所に埋め込みコードを貼り付けます。

↓ 下図のようになります。

a href のリンクタグを残している場合、閲覧者がフォトをクリックすると、写真のオーナーのGoogleアカウント情報が分かってしまうので、自身のGoogleアカウントを見られるのが嫌な方は、a タグを除去して下さい。

下記の写真も、img src= のみで、 a タグを取り除いています。

意味が分からない方は、一度、Google アカウントからログアウトして、閲覧者からどんな風に見えるか、確認して下さいね。

リンク先は、任意のURLに指定することも可能です。

デフォルトでは、コードの末尾 “○○○=w2400”で、横幅2400に指定されているので、好みの大きさに書き換えて下さい。

w300にすると、こんな風に小さく表示されます。

高さを指定する時は、h で調整します。 
写真は、h100 の場合。
指定サイズに合わせて、自動的に伸縮します。(比率はそのまま)

Google Photosからいちいちダウンロードして、WordPressにアップロードするのも面倒なので、埋め込みコードを生成すれば便利ですね。

その他の埋め込みタグ生成サービス

こちらのBYTENBITにも同様の埋め込みコード生成サービスがあります。

操作も非常に簡単。

あわせて読みたい
ByteNbit - Embed Google Photos Into WebsiteEmbed Google Photos Into Websit

Google Photos 埋め込みコードを生成

Public album.orgでは、ギャラリーの埋め込みタグを生成してくれます。

埋め込みのサイズやデザインもカスタマイズできるので、便利。

Public album .org
How do I embed a Google Photos album into a website? - Public album .org
How do I embed a Google Photos album into a website? - Public album .orgIn Google Photos application, 1) you must share selected album and get link of it. 2) create embed code with tool 3) paste code to your website.That's all.

Google Album 埋め込みタグ生成

Google Album 埋め込みタグ生成

目次
閉じる