【ブログ運営】WordPressで「あわせて読みたい」を簡単に貼る方法

スポンサーリンク
Left Caption

パパ

こんにちは!パパです。

ブロガーのみなさん、記事更新頑張ってますか??

Left Caption

パパ

今回は、ブログ記事執筆中役立つテクニックを紹介します!

内容は・・・

記事と記事をつなぐ、いわゆる「内部リンク」をワードプレスで貼る時に
よく利用されている「あわせて読みたい」を使って
簡単に内部リンクを張る方法です。

↓↓↓こんな感じです

内部リンク貼る時、手動でリンクを貼ったりするのは大変ですよね?

今回紹介する手法を使えば、簡単にできるようになるので

一度試してみてくださいね。

※使っているテーマや環境で、やり方が違ったり、できない場合もあるかもしれませんのでご了承ください。
※使用テーマ「ルクセリタス」で説明しています。

サイトマップを使う

サイトマップとは、ブログやサイト全体のページ構成地図のように一覧で記載しているページのことです。

このサイトマップからも、ブログやサイト全体の各ページにアクセスすることができます。

このように、各記事へのリンクがテキストで表示されています。

まずは、自分のブログのサイトマップを開いてみてください。

「サイトマップ作ってないよー?」って方は
こちらの記事を読んで作成してみてください。

サイトマップを開いたら
リンクさせたい記事のタイトルを選択してコピーします。

次にワードプレスの投稿画面に戻って貼り付けます。

すると、記事のタイトル記事のURLがセットになって、投稿画面に貼り付けされました。

これだけでも内部リンクとして機能しますが、見た目的にシンプルすぎるので

「あわせて読みたい」を使ってカスタマイズしましょう。

「あわせて読みたい」のカスタマイズ

こちらのCSSコードをstyle.cssに追加します。

/* あわせて読みたい 複数リンク対応カスタマイズ */ 
.emphasize-link { 
 position: relative; margin: 36px 0 16px;
 padding: 16px 10px; border: 2px solid #df8182;
 background-color: #fffbf5;
} 
.emphasize-link p:last-child { 
 margin-bottom: 0;
} 
.emphasize-link::before {
 position: absolute;
 bottom: 100%;
 left: -2px;
 padding: 2px 6px;
 content: "あわせて読みたい";
 background-color: #df8182; color: #fff;
 font-weight: bold;
}

追加したら必ず 更新 ボタンを押しましょう。

続いて簡略化のために、定型文に登録します。

定型文に登録して簡略化

※ここからテーマ「ルクセリタス」で説明します。それぞれご使用のテーマでやってみてください。

ワードプレスのダッシュボードより
Luxeritas → 定型文登録 を選択します。

 新規追加 をクリック

下の方の「囲み型」にチェックを入れます。

定型文(上の枠内)に

<div class="emphasize-link">

下の枠内に

</div>

をそれぞれ入力します。

ラベル 合わせて読みたい「囲み」(自由に設定してください)

すべて入力し終わったら 保存 をクリックします。

「あわせて読みたい」の定型文登録ができました。

以上で準備完了です。

使ってみよう

では、さっそく使ってみましょう。

先ほど、貼り付けた投稿画面のリンクを選択して

ワードプレス画面上部 定型文 をクリック

登録した定型文が一覧表示されますので先ほど登録した定型文
 合わせて読みたい「囲み」 をクリック

こんな感じで「あわせて読みたい」の内部リンクが完成します。

リンクが複数の場合でも、同じようにすれば

こんな感じで簡単にできます。

まとめ

ブログ記事作成テクニックとして

内部リンクの簡単な貼り方を紹介しました。

ブログ作成は時間との闘いです。

少しでも「時短」できるように工夫すれば

記事作成のスピードもアップし、時間を有効活用できるようになるでしょう。

スポンサーリンク