ブログ運用 PR

【ワードプレス】ウィジェットに自作した画像リンクを配置する方法

【ワードプレス】ウィジェットに自作した画像リンクを配置する方法
記事内に商品プロモーションを含む場合があります

ワードプレスにある「ウィジェット」

聞き慣れない言葉なので、初めは何のことか分からないですよね。

ウィジェットは、コンテンツを自由にカスタマイズできる便利な機能です。

最近の投稿一覧、検索窓、アーカイブなどを、簡単に表示できるブログ部品のようなものです!

今回は、ウィジェット(サイドバー)自作した画像リンクを配置する方法についてご説明します。

まとめ記事やキラーページへ誘導したいときにも役立ちます。

コードを一切いじらずに簡単に出来る方法で紹介します。

画像リンクに使用する画像を作成!ちょうど良いサイズを解説

まずは、画像リンクに使用する画像を作成します。

適当なサイズで作るのではなく、一般的な広告バナーサイズを参考に大きさを考えると良いと思います。

大手ASPのA8.netがアフィリエイトプログラムとして用意している「バナー素材サイズ一覧」が、非常に分かりやすく勉強になると思います!

画像サイズ一覧

画像出典:A8.net

A8.netではブロガー、アフィリエイターに役立つ情報がたくさん配信されています!

登録がまだという方はぜひ、チェックしてみて下さい♪

A8.netとは?アフィリエイト初心者が登録するメリット5つ紹介
A8.netとは?アフィリエイト初心者が登録するメリット5つ紹介これからアフィリエイトを始めようとしている方、A8.netは100%登録必須のASPです。 「アフィリエイト」とは、自分のメデ...

ご参考までに、作成した画像を一つ貼っておきます。

320×100pxで作成しました。作成ソフトは、無料で使用できるCanvaです。

A8.netの広告素材サイト一覧にもあるように、もう少し小さめで作成したい方は320×50で作成しても良いですし、大きめが良ければ300×250でもいいと思います!

配置したいスペースにもよるので、自分のブログに合ったサイズを選ぶと良いですよ☆

ねずみのキャラクターはIllustratorでオリジナルのイラストを描き、保存したものを素材としてCanvaに取り入れて使用しています。

【PC版】Canvaの使い方 アイキャッチをプロっぽくデザイン!
【PC版】Canvaの使い方 アイキャッチをプロっぽくデザイン!デザイン作成ツールの「Canva」 無料で使用できる手軽さから、ブログのアイキャッチや、YouTubeのサムネなどに使用している方...

メインにするようなイラストがない場合は、ココナラで作成依頼をするのがおすすめです。

ココナラのクリエイターに依頼する
唯一無二のキャラクターをブログ用に持つことで、他ブログとの差別化にもなりますよ!

画像に設置する絵は、無料のイラストサイトから取ることが多いです。

無料かつ会員登録なしで、商用利用OKのサイトを紹介している記事があるので、参考にしてみて下さい▼

無料・商用利用OK・登録なし!フリーイラスト素材のサイト厳選紹介
無料・商用利用OK・登録なし!フリーイラスト素材のサイト厳選紹介ブログのアイキャッチ画像や、記事の合間にちょっとしたイラストを入れたい場合に、イラスト探しって結構大変ですよね。 素材サイトも、素...

ウィジェット(サイトバー)に画像リンクを設置する方法

画像が出来たら、さっそく設置していきましょう!

※Wordpressのテーマ「JIN」使用での説明になります

WordPressの管理画面から、外観→ウィジェットをクリックし、ウィジェットの設定画面を開きます。

ウィジェット作成画面1

左側にある「利用できるウィジェット」から、【テキスト】という項目をドラッグして、「サイドバー【PC】」というところに置きます。

フルダウン(▼)をクリック

①タイトルを決めます!

「ピックアップ」、「おすすめ」、「要チェック」など、好きなタイトルにしましょう。

②メディアを追加

メディアとは、画像です。先ほど作成した画像を貼り付けましょう!画像は圧縮してから取り込むことをお勧めします。

③リンクの挿入

画像を貼り付けたら、リンクボタン🔗を押します。すると下記のような画面が表示されます。

ウィジェット広告作成画面3

窓に、リンク先のURLを入力します。

リンク先は、作成したまとめ記事でも良いですし、タグやカテゴリーのまとめページでもいいと思います。

リンク設定ボタン⚙を押すと、新しいタブでリンクを開くように、チェックを入れるだけで、設定することもできます。

以上で完了です。

ちなみに今説明した設定は、テーマJINをお使いの方であれば「カスタマイズ」のライブプレビュー画面でも設定することが出来ます。

画像リンクの作成と配置方法さえマスターしておけば、どこでも自分の好きなところに表示させて、クリックを促すことができるのでどんな場面でも役立ちます。

お得情報

人気の商品が毎日お買得価格で登場Amazonのタイムセール▼

 

Amazon全ジャンルのクーポンはこちら

ブログで稼ぎたい人向けの書籍
関連記事