LoginSignup
7
1

More than 3 years have passed since last update.

Google Photos上の写真を誰でもかんたんにMarkdownドキュメント上に貼り付ける話

Last updated at Posted at 2020-12-06

こんにちは、ポキオです。

image.png

IoTLTアドベントカレンダーの7日目を担当させていただきます。画像は一切関係ありませんが、2020年に執筆したブログの記事から、反響が大きかったものを内容1を再編集してお送りしたいと思います。

tl;dr

  • Google Photosにアップした写真への直リンクを取得するツールを作成
  • Markdown記法に則った画像埋め込みコードも作成可能
  • 誰でも自由に使えるので、ぜひご利用ください
  • https://bit.ly/3dYB5Yd

アウトプット、してますか?

Tech系でなくとも、個人的にはブログやドキュメントは文字ばっかりより、画像を効果的に使っている記事が大好きで、特にIoTLTに興味がある諸兄姉は常日頃習得したテクニックをブログなどでアウトプットしていることでしょう。

今回作成したWebアプリ2を使うと、Google Photosにアップした写真への直リンク(っぽいもの)を取得し、そのままMarkdownなドキュメントに画像埋め込みができるような文字列に変換してくれる便利なツールなのです。

どうやって使うの?

まずは、Google Photos上の写真で埋め込みたい画像を選択して表示をします。

Screen Shot 2020-12-06 at 17.27.57.png

右上あたりの共有ボタンから、[リンクを作成]から[共有リンクの作成]を行い、URLをコピーします。

Screen Shot 2020-12-06 at 17.24.49.png

次に、例のツールを開きます。

Screen Shot 2020-12-06 at 17.32.17.png

先程の共有リンクをツールの[URL]に入力します。オプションで、サイズ(単位はピクセル、長辺が指定された数値以下になるようになります)、代替テキスト・画像タイトル(Markdown記法やHTML記法で使われます)を入力します。

そして[変換]を押すと、

  • 画像へのリンク
  • Markdown記法
  • HTML記法

の文字列が自動で生成されます。これをお好きなドキュメントに貼り付けるだけ!

どういう仕組み?

Webページと裏のロジックはすべてGASで記載しています。入力されたURLにアクセスし、HTMLソースの最初の方にあるOpen Graph Protocolで書かれているアイキャッチ画像のURLを取得します。

このURLはGoogleログイン不要で、だれでもアクセスできるURLになっているので、これをベースに文字列を変換し、ツール上に表示させています。詳しくは、こちらのブログをご覧ください。

最後に

今年はいろいろなことがありました。オフラインの勉強会も少なくなって、少しさみしい気持ちは否めませんが、こんなときこそこのツールをつかって、ブログやQiitaなどで情報発信をしていきたいですね!

7
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
1