PCゲーマーのWebデザイン備忘録

PCゲーマーのWebデザイン備忘録。東京都内でWEBデザイナーとして働いています。Webデザインやゲームに関することをブログに書いていきます

はてなブログのはてな記法、Markdown記法で画像にリンクをつける方法(2017/11/10更新)

f:id:web-design-gaming:20171107234635p:plain
はてなブログはてな記法Markdown記法で画像にリンクをつける方法を探しても見つからなかったので備忘録。
(2017/11/10…はてな記法Markdown記法それぞれのちゃんとした記述方法があったので追記)

実ははてな記法Markdown記法では HTMLタグが使えます。
なのでそのまま HTMLタグで記入します。

例:

<a href="#URI" class="http-image" target="blank"><img src="hoge.png" class="http-image" alt=""></a>

このブログではカテゴリー「WEBデザインギャラリー」で、アイキャッチとして入れている画像にデザイン参照元のサイトのリンクを挿入しています。
ただ、外部リンクになっていることが分かりにくいので、
今後はてなブログの仕様になれてきたら、
外部リンクだと分かりやすいようにカスタマイズができればと思います。

追記

はてな記法では下記の記述で画像にリンクをつけることができます。

[#URI:image=hoge.png]

Markdown記法ですと下記の記述でできます。

 [!(hoge.png)](#URI)