*

カテゴリー別のまとめバナーをサイドバーや記事下にいれてリンク

公開日: : 最終更新日:2018/01/02 WordPress

同じような分類の記事が増えてきたので、まとめを作りました。
バナーでリンクできるようにしてみようと思いさっそくバナー作り。

以前タイトルバーの下に全記事一覧や、特定カテゴリへのリンクを作ったものの応用?になります。
すぐ忘れるのでこれも備忘録的に記事にしてみました(^^;

スポンサーリンク


バナーを作る


1.画像を用意する。
じぶんで描いてもいいし、無料素材を利用して写真やイラストを使うというのもある。
今回は無料素材から写真をダウンロードして使用。
その画像にスクリーンショットで撮ったExcelのアイコン画像をプラスしてみた。
ペイントだとどうもうまくいかないので、今回はExcelを利用。

バナー画像の作り方


写真+画像+文字

①最初の写真をExcelに挿入(リボンの「挿入」⇒「図」で画像を選択する)

②スクリーンショットの画像は保存したら余白が白いままだったので背景を透過して再保存。
透過するにはこちらを参照 WordPressのタイトルロゴ作成 PCにあるソフトで作るwebで透過も

③これもExcelに挿入。
2枚を重ねて配置してから文字を挿入。
文字はワードアートで(挿入⇒ワードアート)

④トリミングなどして全体を整えたら1枚の画像として保存する

1枚の画像として保存するには?
⇒まず、1つの画像をクリックしたら次に重ねた画像をShiftキーを押しながらクリック。
文字(ワードアート)もSiftキーを押しながらクリック。

すると全部の画像にハンドルがついて、複数選択の状態になるのでこれをコピーする。

複数画像の選択
ペイントを起動して貼りつける。
それをペイントで保存する。
これでバナー用画像のできあがり。

作った画像は、WordPressのダッシュボードで「メディアライブラリ」に新規追加しておく

・この時メディアライブラリに追加した画像をクリックすると添付ファイルの詳細画面になるので、

この画像のURLをメモしておく。

バナー保存
バナー(画像)の準備ができたので、サイドバーと記事下に設置してみます。
 
スポンサーリンク

 

サイドバーにバナーを表示する


バナーからリンクするための一覧を固定ページに作ります。

方法はShortcodes Ultimateの投稿から一覧を作る方法を参照してください。

「Shortcodes Ultimate」プラグインで簡単画像つき一覧ページを作る

・固定ページの一覧⇒編集で図のようになればOK。

固定ページ
できたら公開します。
ここでURLをメモしておきます。

・ダッシュボードの「外観」⇒「ウィジェット」をクリック

・ウィジェットの「テキスト」をサイドバーにドラッグします。

・ドラッグした「テキスト」をクリックすると入力画面が表示されるので「内容」に次のように入力します

<a href=”固定ページのURL”>

<img src=”メディアライブラリに保存した画像のURL” /></a>

 

ウィジェット
・保存をクリックします。 サイトを表示してサイドバーに表示されていれば完了です。

 

記事の最初や最後にバナーを貼る


・投稿記事のバナーを入れたい場所に画像を挿入します。
投稿画面で「メディアの追加」⇒ライブラリから画像を選択

・画像を選択してリンクを挿入で固定ページのURLを入力します。

 

複数のページに同様のバナーを貼りたいときは、テキストモードの方でコピーして、他の投稿ページに貼りつけると簡単です。

そのほか、

固定ページをヘッダーに登録するのはこちらを参照してください

サイトマップをグローバルメニューに表示するⅡ設定

簡単に画像の編集をするには(1枚の写真に文字をいれてリサイズするだけなど)PhotoScapeが便利です

PhotoScapeで画像を編集
 

波空
今回の作業は一度やってることばかりだけど復習かな(^^;
猫にゃん
ですな、すぐ忘れるし
 

文字だけのリンクでもいいけど、画像があるとわかりやすいですね、
時間の余裕がある時に、サイドバー用と記事用と別の画像にしたり、いろいろ工夫してみたいと思います。
少しでもお役にたてればと思います<(_ _)>

 
前の記事 FTPソフト|初心者にも使いやすいFileZillaのDLと設定
次の記事 お名前.comからXserverにドメイン移管 | 完了まで

WordPress一覧へ

 
 



にほんブログ村


日々の出来事 ブログランキングへ

スポンサーリンク




関連記事

プラグインGoogle XML Sitemapsでサイトマップ作成

ブログの構造を伝える「サイトマップ」は、大きく分けて2種類あります。 ・訪問者のためのもので、ユー

記事を読む

WordPressで簡単設定ファビコン(favicon)の作り方

ネットをみていると開いたサイトのタブには名前の頭にアイコンがありますね。 これは自分でも作れるのだ

記事を読む

Stinger3のヘッダー画像の入替

Stinger3のヘッダーまわりはタイトル・説明・ヘッダー画像で構成されています。 まずはヘッダー

記事を読む

プラグインbrBrbrでテキストモードの改行をそのまま表示

このプラグインの製作者のページには 「改行が改行しただけ改行したまま改行する」とあります。 改行

記事を読む

プラグインContact Form 7で問合せフォーム簡単作成

ブログを読んでいると、ちょっとこの管理人さんにきいてみたい、とか 一言残していきたいなんてことがあり

記事を読む

指定場所にジャンプ!簡単タグでページ内リンク

Shortcodes Ultimateの説明の記事で一覧の項目から、説明に飛ぶページ内リンクを作りま

記事を読む

PCにあるキャプチャツールSnipping Toolの便利な使い方

画像をキャプチャするツールは以前「Monosnap」というのを紹介して、私も便利に使っています。

記事を読む

WordPressテーマStinger3の見出しタグのカスタマイズ

見出しタグh2やh3を変えたい Stinger3の見出しタグはそのままでも結構いいかなと思う反

記事を読む

DuplicatorでWP丸ごと引越 GMOからXserver2

前回は、Duplicatorでダウンロードした「Installer」「Archive」をXserve

記事を読む

WordPressのタイトルロゴ PCにあるソフトで作るwebで透過も

Cool Textで簡単にロゴを作る方法を試してみましたが、実際にタイトルにするロゴは別の方法で作成

記事を読む

スポンサーリンク




Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


後片付け
バーベキュー初心者 現地でやることは?炭おこしや焼き方&後片付け

前回の続きです。 バーベキュー初心者 はじめての場合に必要な準備

バーベキュー初心者 はじめての場合に必要な準備とやることやいるもの

暖かくなるとバーベキューなんてやってみたくなりますよね(^^)

駄菓子から元祖梅ジャムが消えた 昭和の味駄菓子の歴史と駄菓子屋の今

この前ニュースというか、テレビで梅ジャムが消えたという話題をやっていた

エプロンとは?いつから?つける意味や必要は?メリットを考えてみた

普段エプロンてつけていますか?つける派つけない派ありますが、もとい、エ

菖蒲湯のショウブには花がない?花菖蒲とあやめや杜若の見分け方は?

5月5日の菖蒲湯に使う菖蒲って、今まで花をよけて葉の部分だけを使うのだ

→もっと見る

  • こんにちは。波空です

    好きなことを自由にやりたくてアフィリエイトにチャレンジ中

    好きなものは
    アニメ・漫画・ゲーム・お絵描き・映画を観ること・パソコンで遊ぶこと・チョコレート・中島みゆきさんの歌・・

    やりたいことは・・
    空を飛びたい・馬に乗って自由に走り回りたい・猫を飼いたい・・

    いろいろあるけど、まずは資金と自由な時間を確保しないと進まない。
    日々どうしたらできるか考えながらリアル仕事に追われています。

PAGE TOP ↑