爺爺の手習い

Googleフォトの写真を埋め込んでいます。



Googleフォトの埋め込みは、正式にはgoogle ドライブ経由でできますがインラインフレームを使用しており、扱いにくいので下記の方法で使用しています。


1.共有（リンクを取得）設定。

1.1フォトで写真を選んで表示する。

1.2表示された写真の右上の〇印「共有」をクリックする。



1.3共有の中の「リンクの取得」をクリックする。


リンク先が表示されればOKです。






2.画像のURL(アドレス)をコピー
後は、画像のURLをコピーすれば良いのですが、使用しているブラウザーにより異なります。

上で共有したフォトの上で右クリックします。


使用しているブラウザー

Firefoxの場合


Chromの場合


Internet Explorerの場合
右クリックして一番下のプロパティを選択しアドレスをコピーします。


Edgeの場合
右クリックで要素の検査を選択。


開発者ツールが開くのでブルーバックの部分をコピーする。






3.コピーした画像のURLの張り付け
画像を表示するタグに貼り付けてください。

<img src="ここに張り付け" width="450">

上のここに張り付け部分にコピーしたURLを貼り付けます。

（注、Edgeの場合はimgタグを含んでいるのでそのまま張り付け）
450は表示する画像の横幅ですので適当に変更してください。


トップに表示している画像の例（現在は、https://lh3.googleusercontent.comで始まります。）
<img src="https://lh3.googleusercontent.com/RQ1PZZ6eZr1zDN-9MUZ8Jtfuxx0JRTGj6BXdpXhfso33op_9xkSRmYhDwI2qCWdngosWDuqWLPYQg65A_EFHCsyIKLi3GjyoUByd9mohcDJOgXUbvVutXj0ii59-Byy0Ng3Sczplpyhf6DFn3PEoHvDtyAnfACHv5ABbhrGYe7J1QvA-SkJo8FINb1wKH7DczTR4ZFY11aNGucQa48W8mC2sog_pm0HRFO074nsZIferR5vR4suaF9J0Y9kwcvPg1pM4rryIviQ6flEPD8DyGGhMPFfdVF88q4d3VKjvBsGHSC6bJHEP6zJ4qZ5JxjgLx1zNd5bP6xyF1mi49RTJvtKtrY7KTRruBN5ZQ0VP6l1aaJP87SSB6Y5l6lvoxI2ORZ3yuJ86MN-VW0CpnyOTj9SOx3vG3g9vFnNx42SiBzK_HaBJZ1gOUS2b10BL_4TumKke-V5CG7-MkO4qQLdhIBbvfUq5pUJmQfyDagH_dOeq-xMiXPUHQBNgcwEeH0cX8EkkcuroJD9OOBVp2gLBUbmluiZfces5A0CbX6sGxUN-G-KNncWXd1Nd-IkkdzjUz-8nJ60g4wf78eri5cPL-EEC-tvqrBxiQOy8UgCIsniCzKl5lr6ohNJyDTLzBp4szrWIlPlJBUaVehKrmtx3XpaOLE4tkN2mFVsQx88j4SgplA=w806-h604-no" width="480">