2018年11月30日金曜日

StackEdit で画像をクリッカブルにし拡大させる方法

概要

StackEdit で画像を挿入する場合自分は Google+ に画像をアップロードして URL で参照しています
Markdown で埋め込む場合は以下のようになります

![image_name](https://...)

これだと画像はクリッカブル (リンク) にならず拡大などができません
今回は画像を拡大する方法を紹介します

環境

  • StackEdit 4

やり方

Markdown 的には以下のようにしまう

[![image_name](https://...)](https://...=s800)

画像の Markdown 自体をリンクの Markdown で更に囲うだけです

Google+ を使っている場合だけですが URL の最後に s800 のような感じでサイズを指定することができます
s0 を指定した場合は元のサイズになります
なのでクリックした際に拡大するサイズを指定してあげればやりたいことを実現できます

例えば以下のようにすると

[![enter image description here](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigldUTXXiAP1Mw-f79wi-z-5elOS6E_2h1LKIv4NzqVUwcDf58U7RpTKV5nYbt3eYKIGAmKr8MwPCyiMiZahgkaK_T1ail1vbqS7xFKRI5eFidCdYV-PdQAtKBuMLHoM1Ha8V_alHExsgd/s400/ "hawksnowlog-icon.png")](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigldUTXXiAP1Mw-f79wi-z-5elOS6E_2h1LKIv4NzqVUwcDf58U7RpTKV5nYbt3eYKIGAmKr8MwPCyiMiZahgkaK_T1ail1vbqS7xFKRI5eFidCdYV-PdQAtKBuMLHoM1Ha8V_alHExsgd/s0/)

実際に Blogger では以下のようになります
zoom-demo.gif

StackEdit4 の場合画像埋め込み時に外枠のリンク用の Markdown を一緒に生成する方法はないので、画像を埋め込んだあとに自分でリンク部分の Markdown を囲う必要があるのが面倒かなと思います

画像が 1, 2 枚くらいであれば問題ないかなと思いますが大量にある場合はかなり面倒かなと思います

参考サイト

0 件のコメント:

コメントを投稿