wordpressのサイドバーに人気記事リストを設置する

wordpress-favoratricle

人気記事リストがあるとユーザーを人気記事に誘導しやすくなる。今回はそんな人気記事リストをサイドバーに設置する方法を解説する。

サイドバーに人気記事リストを設置する

まずwordpressのダッシュボードで”外観“を選択して”ウィジェット“をクリックしよう。

wordpressのサイドバーに人気記事リストを追加する

開いた画面の右手が”メインサイドバー“だ。右手に”利用できるウィジェット“がある。その”利用できるウィジェット“から”テキスト“を選んで”メインサイドバー“部分へドラッグ&ドロップしよう。

メインサイドバーに入り込んだ”テキスト“をクリックすると”テキスト“の詳細を設定する画面になる。

wordpressのサイドバーに人気記事リストを追加する

  • タイトルには任意のタイトル名を入れよう。
  • その下の大きな四角い枠にはプログラムを入力する。
    入力するプログラムはこちらだ。

    <!--人気記事一覧-->
    <ul>
    <li><a href="#" target="_blank">記事1</a></li>
    <li><a href="#" target="_blank">記事2</a></li>
    <li><a href="#" target="_blank">記事3</a></li>
    <li><a href="#" target="_blank">記事4</a></li>
    <li><a href="#" target="_blank">記事5</a></li>
    </ul>
    

    今回はテストなのでリンク先は”#“、記事の名前は”記事1“というような感じにしてある。実際に設置する時は”#“には”リンク先のURL“を、”記事1“の部分には”ページタイトル“を入力して欲しい。

  • 設定が終わったら下部にある”保存“ボタンを押します。

これで人気記事の設定が完了だ。

wordpressのサイドバーに人気記事リストを追加する

こんな感じになる。

少しまだしっくりこない。それぞれの行の先頭に付いている”●”を削除して文字を左寄せしようと思う。

そのためにはstyle.cssを操作する。style.cssの下部に次のコードを追加しよう。

/* 人気記事設定 */
.widget-area .textwidget ul {
list-style: none;}/* リストスタイルを無しに設定 */
.widget-area .textwidget li {
margin-left: 0px;}/* 左寄せ */

そうすると

wordpressのサイドバーに人気記事リストを追加する

こんな具合になる。

これで人気記事一覧の設置が完了した!