画像を外部リンクにする方法(GIF動画で説明)

目安時間7分

今日は「個別サポート」でいただいたご質問をシェアしますね!

 

ワードプレスの画像を外部リンクにする方法。

 

画像をクリックしたら「リンク先のページが開く」ようにしたい。

ページが移動してしまうのではなく、新しいページ(別ウィンドウ)が開くようにしたい。

 

わかりやすいように『GIF動画で説明』します。

 

まずは ↓ ご覧あれ♪

 

画像,外部リンク

ワードプレスで画像に外部リンクを設定する方法

1.画像を用意する

 

2.メディアに画像を追加

 

3.記事に画像を追加

 

4.画像をクリックしてから「リンク挿入ボタン」を押す

 

5.「歯車アイコン」を押す

 

6.「リンク先のURL」を入力

 

7.「リンクを新しいタブで開く」にチェックを入れる

 

チェックを入れることで、画像が外部リンクになります。

(内部リンクのままで良ければチェック不要です)

 

 

ついでに「実際のhtmlタグ」も確認してみよう!

で、ここまでやってみたところで

 

『実際のhtmlタグはどう表記されているか?』

 

「ビジュアル」タブから「テキスト」タブに切り替えて

どんなhtmlタグが作られたのか見てみると、わかりやすいですよ♪

 

内部リンク・外部リンクのhtmlタグは?

以下、リンクのhtmlタグです。

 

内部リンク

<a href="URL"> 文字・画像など </a>

 

外部リンク

<a href="URLtarget="_blank"文字・画像など </a>

 

target="_blank" と入れることで「外部リンク」になるんですね!

 

 

ちなみに私は「リンクのhtmlタグ」は単語登録してますよ♪

 

ur  →  <a href=""></a>

urr →  <a href=""  target="_blank"></a>

 

 

応用★画像に外部リンクを貼りたいときは?

では、本題です。

 

画像に外部リンクを貼って「リンク先を新しいウィンドウで表示させたい」ときは

 

<a href="URLtarget="_blank"><img src="画像のURL"></a>

 

こうなるワケですね!

 

ウィジェットの画像リンクにも使える

私も、ブログの右サイドバーなど「ウィジェット」に画像リンクを入れることが多いのですが

 

保育園ブログ,バナー

 

自分で複雑なhtmlタグを書くのは無理。

 

1字1句タグを覚えたり

自力で組み立てる熱意はなくて

とりあえず狙い通りに表示できればOKな人なんです。w

 

なので、ウィジェットに画像リンクを貼りたいときは

 

先ほどのGIFアニメのように

適当な個別記事で「画像をリンク化」してから

HTMLタグだけ抜き取って、ウィジェットに貼ってます!

 

自分でタグをいじるより、時短かつ確実です。笑

 

 

どうやってHTMLやタグを覚えればいいの?

ありがとうございました^^

 

タグの知識が無いのですが
りあこさんはやりながら覚えたのでしょうか?

 

 

そうです、そうです、
ホント、1つずつですよ(^^

 

さっきお見せしたGIF動画のように

 

ワードプレス上で操作して
実際に出来上がったタグを見てみることで
「どっからどうなってるのかなぁ」と考えてみたり

 

ネット検索で「htmlタグの使い方」を調べて、自分のブログで試してみたり…

 

タグの意味が1つずつわかってくると

まるでプログラマーみたいだし(じつに遠いですがw)

自分の思うように表示されると、すっごく嬉しいですよね♪

 

 

他にも

<a で始まったタグは</a>で閉じる
<div で始まったタグは</div>で閉じる

タグにも基本の型があるので、1つずつ覚えていく感じですね!

 

 

何か参考にしたものとかあれば教えてもらいたいです。
とはいっても、ブログ作成で精一杯ですが・・^^;

 

 

私は、ネット検索しながら覚えたのと

 


(無料電話サポート付)できるホームページ HTML&CSS入門

 

html&CSSの入門本を買ってきて

本を片手にHTMLサイト(ペラサイト)を作ってみて

 

「おおーー!ほんとに表示されたー(感激)」
半分、遊びながらですね。

 

楽しんでやるのが1番覚えます(笑)

 

 

さっきのランキングもどうしてあのように修正したのかも
さっぱりわからないです。

 

ですよね(^^

ランキングのhtmlタグは、複雑ですものね。

 

どうしてもわからないときや上手く表示されないときは

いつでも「りあこ1対1個別サポート」頼ってくださいね♪

 

→ブログやアフィリエイトの「個別サポート」はコチラで受け付けています

りあこ実践中のアフィリエイト教材をご紹介します!

アドセンス外注化教材・FAAP

FAAP,アドセンス,外注化

ほったらかしブログで月10万

1日中家事育児仕事に追われ「座るヒマさえない働くお母さん」にこそ手にとってもらいたい、まさに「時短と手抜き」を極めたアフィリエイト教材です!

アフィリエイトの王道教材・アンリミNEO

アンリミ,レビュー,りあこ特典

スキルと収入を伸ばしたい

『人に喜ばれながら収入を得る仕事』
お客様・読者さんとの関係を大切にしながら収入を得たい、長く安定したビジネスを作りたい人向きです!

楽天アフィリエイト教材・楽press

楽press,楽天アフィリエイト

楽しく♪息抜き♪スキマ時間

自分が買ったもの、今ほしいもの…おしゃべり感覚でブログが書けてお小遣いUP☆楽しくブログで稼ぎたいならコレ!

 

この記事に関連する記事一覧

「これ以上ムリ!」なママ向き
家計,ゆとり,ブログ
このブログを書いている人・りあこ

りあこ

自宅起業サポーター・りあこ

3人娘のママ。5年以上、子育てしながら自宅で働いてきました。メルマガで「保育園ママのための自宅で1人起業する方法」を公開したところとても反響が大きく「やっぱ家で働けるって幸せなことだよね♪」と思う今日このごろ。

>>もう少しくわしい自己紹介はこちら

保育園ママ起業の専門メルマガ
家でできる仕事の始め方
 最近の投稿
りあこ愛用アフィリエイトの教科書
カテゴリー
ココから検索できますよ
【私の知らない自分】が丸見えに!
ライバル不在ガラ空きキーワードの例

ページの先頭へ