「画像をクリックするとリンク先のサイトにとぶ」
多くの方が既に使われていますが、もしまだ知らなかったわ、という方がいらっしゃいましたら参考になさってください。
① 画像を用意する
そもそも画像が作れないのよ、というところになるのだと思うのですが、
今は色々な方法で、スマホからでも、簡単に作ることができます。
ちなみに下記画像は、私が好きで使っている画像作成ツールの「Canva」というものを使用しています。
パソコンでも使えますし、スマホアプリにもあります。
使い方はこちら
「Canva」の使い方 ー 自由設定編
「Canva」の使い方 ― テンプレート編
こちらの画像にリンクを貼ってみます。
② リンクがない状態ではどのように記述されているか
まずは編集画面下の「HTML表示」をクリックしてみてください。
画像に該当する箇所がこのように表示されています。
（文字入力せずに画像だけ記事に貼ってみるとどの部分かすぐにわかると思います）
<p><a href="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png"><img alt="" height="100" src="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png" width="300"></a></p>
③ どのように変更するか
では、リンクしたい記事のURLに差し替えます。
このピンク部分の、”<a href=” に続くURLをリンクさせたい記事のURLに置き換えます。
<p><a href="
https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png"><img alt="" height="100" src="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png" width="300"></a></p>
とりあえず、私の問い合わせフォームのURLにしてみます。
「https://ws.formzu.net/fgen/S42840460/」こちらです。
このようになります。
<p><a href="
https://ws.formzu.net/fgen/S42840460/"><img alt="" height="100" src="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png" width="300"></a></p>
実際はこちら。クリックしてみてください。
ただこれだと、同じタブ内で次の画面に進んでしまいます。
外部へリンクさせる場合、別の画面が出た方がいいですよね。
④ 別画面で開くには
「target="_blank"」
こちらを、「a href="https://ws.formzu.net/fgen/S42840460/"」の後に入れていきます。
<p><a href="
https://ws.formzu.net/fgen/S42840460/"
target="_blank"><img alt="" height="100" src="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png" width="300"></a></p>
実際はこちら。クリックしてみてください。
別の画面でフォームが開きましたよね。
難しいものではありませんので、この形を覚えておくと便利です。
<p><a href="
https://ws.formzu.net/fgen/S42840460/"
target="_blank"><img alt="" height="100" src="https://stat.ameba.jp/user_images/20180703/12/she2015/17/a5/p/o0300010014222403955.png" width="300"></a></p>
作る方も見る方も、わかりやすく心地よく楽しいブログになるといいですよね！
■ご要望にお答えします■
事務作業が苦手、パソコンが苦手、わからない、時間がかかる、メール対応が苦手、忙しくて時間がない、事務を手放して肩の荷を下ろしたい方、お任せください。
事務仕事を丸投げしたい、予算範囲内で少しずつ依頼したいなど、ご要望にお答えします。
小さな単発サービスも承っております。
サービス一覧
お問い合わせ 
