AFFINGER6でおすすめ記事の表示方法を初心者向けに解説!

※記事内に商品プロモーションを含む場合があります。

悩める人

Affinger6を使っています。
トップページやサイドバーなどにおすすめ記事を出すのはどうしたら良いですか?

きつねコード

アフィンガー6には「おすすめ記事一覧」の機能が用意されています。設定すると、任意の記事を好きな場所に表示することができて便利なので覚えておきましょう!

この記事でわかること

  • Affinger6「おすすめ記事一覧」機能の使い方
  • おすすめ記事一覧機能で可能なカスタマイズ内容
  • おすすめ記事一覧を、サイドバーもしくは任意の場所に出す方法

この記事を書いているきつねコードは、ワードプレスを触り始めてから10年以上、このブログを作ってからも毎日ワードプレスを触っています。当サイトではAffinger6を利用しており、今後も使い続ける予定です。

Affinger6のおすすめ記事一覧の機能は、誰でもすぐ設定することが可能です。

見せたい記事を目立つ場所に表示できるので、使い方を覚えてぜひ活用しましょう!

Affinger6専用プラグインで収益を次の段階へ

\ きつねコードも使ってます!6/30までセール中!/

Affingerタグ管理マネージャーとPVモニターのセット

※インフォトップから購入できます。29880円セールにつき24800円

タグ管理マネージャーとPVモニターの活用方法はこちら>>

Affinger6「おすすめ記事一覧」の機能とは

Affinger6で標準装備されている「おすすめ記事一覧」の機能では、任意の記事をサイトTOPページやサイドバーなどに表示することができます。

例えば、TOPページに表示した場合はこのようになります↓。

affinger6のおすすめ記事一覧を表示した状態

設定方法は、めちゃくちゃ簡単です。

単純に人気の記事(アクセスが多い記事)を並べてももちろん良いですが、それよりも自分が見せたい記事収益記事などをピックアップして出しているサイトが多いと思います。

いつでも設定変更が可能で、表示する場所も選べるので、この機能はぜひ覚えておくと便利ですね。

きつねコード

当サイトでも使っていますよ。


余談ですが、Affinger6には「ヘッダーカード」という機能も存在します。
カード型のリンクを最大4枚まで表示できる機能です↓。

affinger6のヘッダカード機能

このヘッダーカードも設定が簡単でとても便利な機能です。”おすすめ記事”を表示することも可能です。
まだ知らない方は併せて使い方を確認しておくと良いでしょう。

関連記事
affinger6のヘッダーカードの設定方法
初心者でも簡単!AFFINGER6ヘッダーカードの設定&カスタマイズ方法

この記事でわかること Affinger6「ヘッダーカード」機能の使い方 ヘッダーカード機能で可能なカスタマイズについて ヘッダーカードに使用する画像サイズについ ...

Affinger6「おすすめ記事一覧」の設定方法(基本)

まずは、おすすめ記事一覧の基本の設定方法を解説します。

使い方は簡単です。

  • タイトルのテキスト
  • 表示する記事のID

この2点を入力して、表示する場所を選ぶだけです。


  • step.1

    管理画面「AFFINGRE管理」≫「ヘッダー下/おすすめ」をクリックします。

    affinger管理の「ヘッダー下/おすすめ」の設定画面

    「ヘッダー下/おすすめ」設定ページの下へ進むと、「おすすめ記事一覧」があります。
    ここに、タイトルテキストと、記事IDを入力しましょう。

    記事IDは、数字をカンマ「,」で区切って入れましょう。スペースなどは不要です。


  • 【記事IDの調べ方】

    記事IDは、管理画面「投稿一覧」を見れば簡単に分かります↓。

    affinger6投稿一覧で記事のIDを調べる

    もし記事IDの項目が見当たらない時は、「表示オプション」からカラムの表示設定を変更しましょう。


  • step.3

    タイトルと記事IDを入力したら、あとは用意されている項目で好きな位置に表示するだけです。

    affinger6おすすめ記事一覧の表示位置の設定

    これで保存すると、トップページの最上部におすすめ記事が表示されます。

    affinger6のおすすめ記事一覧を表示した状態

きつねコード

簡単ですね!

Affinger6「おすすめ記事一覧」のカスタマイズ内容

応用編としてアフィンガーで用意されている設定でできることをいくつかご紹介します。

全然難しくはないので、やりたい方はチェックしてみてください。

Affinger6おすすめ記事一覧のカスタマイズ色を変更する

デフォルトではオレンジっぽい色合いですが、もし色を変更したい場合は設定が用意されているので簡単に変えられます。

管理画面「外観」≫「カスタマイズ」の画面へ行き、「オプションその他」をクリックしましょう。

affinger6おすすめ記事一覧の色を変更する設定

次に、おすすめ記事」をクリックしましょう。

affinger6おすすめ記事一覧の色を変更する設定

ここから好きに色を変更することが可能です。
見出しやナンバーなどをそれぞれ選べます。

affinger6おすすめ記事一覧の色を変更する設定

色が決まったら、最後に「保存」するのをお忘れなく。

もし複数の場所でおすすめ記事一覧を表示している方は、その全ての場所に適用されますので留意しておいてください。

こんな風に背景色をつけてメリハリを出したりすることもできますね。

affinger6おすすめ記事一覧の色を変更する設定

Affinger6おすすめ記事一覧のカスタマイズショートコードで任意の場所に表示する(追尾しないサイドバーなど)

”おすすめ記事一覧"は、ショートコードで表示することも可能です。追尾(スクロール)しないサイドバーなどに表示するときに使えます。

Affinger6のおすすめ記事一覧では、あらかじめ表示する場所の項目が用意されていますが、ショートコードを使えばどこでも任意の場所に表示することができます。

ショートコードは下記の通りです。

[st-osusume] 

例えば、管理画面「外観」≫「ウィジェット」を開きます。
「AFFINGERカスタムHTML」のブロックを好きな場所に挿入しましょう。

affinger6のウィジェット画面で、AFFINGERカスタムHTMLを入れる

次に、先ほどのショートコードだけそのまま入力します。

affinger6で「おすすめ記事一覧」をショートコードでサイドバーウィジェットに表示する

これで保存すれば、サイドバーにおすすめ記事一覧が表示されます

普通の「サイドバー」ウィジェットに入れているので、これだとスクロールしても追尾してきません。

ショートコードで挿入したaffinger6のおすすめ記事一覧

使うかどうかは別として、ショートコードが効く場所であればどこでも利用することはできます。記事ページや固定ページの好きな場所で表示することも一応可能です。

関連記事
affinger6の使い方入門ガイド
初心者でも使いこなす!AFFINGER6の使い方・初期設定入門ガイド

この記事でわかること Affinger6の初期設定の全て Affinger6の基本の使い方 効率的にAffinger6に慣れるためのコツ この記事を書いているき ...

まとめ

まとめ

  • Affinger6の「おすすめ記事一覧」機能を使うと、任意の記事をサイトTOPページやサイドバーなどに表示できる。
  • 管理画面「AFFIGNER管理」≫「ヘッダー下/おすすめ」におすすめ記事の設定があるので、①タイトル表示する記事IDを入力し、表示場所を選ぶだけ。
  • 管理画面「外観」≫「カスタマイズ」≫「オプションその他」≫「おすすめ記事」で、色をカスタマイズできる。
  • おすすめ記事一覧をショートコードで表示すれば、任意の場所に出せる

Affinger6専用プラグインで収益を次の段階へ

\ きつねコードも使ってます!6/30までセール中!/

Affingerタグ管理マネージャーとPVモニターのセット

※インフォトップから購入できます。29880円セールにつき24800円

タグ管理マネージャーとPVモニターの活用方法はこちら>>

おすすめテーマランキング[PR]

【第1位】AFFINGER6 ¥14,800円

affinger6バナー

正直、万人向けとは言えないが、「稼ぐサイトを作りたい人」はこのテーマが良い。収益化をサポートするための仕掛けが本当に良く出来ているので、使いこなせれば無双状態に。カスタマイズ自由度もMAXなので個性も出せる。当サイトで利用中。もちろんSEOにも強い。

【第2位】swell ¥17,600円

こちらは万人向け。いま一番売れてる有料テーマ。多機能ながらも直感的な操作ができるので、「とにかく使いやすい」。初心者〜上級者にも愛用され、導入してすぐオシャレなサイトになる。SEOにも強くバランスが良いと言える。

【第3位】Cocoon 無料

cocoonバナー

一言で言えば「コスパ最強」。なんでこれが無料?必要十分な機能で、シンプルなので初心者にもgood。費用をかけずとりあえずサイトを始めたい人に最適。ゼロからサイトを作る人は、レンタルサーバーの「Xサーバー」で、wordpressクイックスタート機能というのを使うのがおすすめ。即cocoonサイトができる。2個目のブログにも。

  • この記事を書いた人

きつねコード

webディレクター/プログラマー。 web系の経験が10年以上あり、webサービスの立ち上げやメディア運営などをやっていました。若い時に起業していた時期もあるので、守備範囲は結構広めです。パソコンが苦手な人からの質問も受けるので、参考になればとの想いで当ブログを始めました。

PICK UP!

wordpressのおすすめテーマはこれ 1

結論:私がおすすめするWordPressテーマはこれ! 最初に、結論をお伝えすると 私が本気でおすすめしているのは「Affinger6」というテーマになります。 ...

ラッコキーワードの使い方を徹底解説! 2

この記事でわかること ラッコキーワードを使うと何ができるのか? 他のツールと比べたときのラッコの優位性 ラッコキーワードの超具体的な使い方 (初心者向け)SEO ...

現役ブロガーがAFFINGER6を徹底評価 3

この記事でわかること Affinger6のどこが良いのか 実際に使っていて感じるAffinger6のメリットとデメリット Affinger6のデメリットを相殺す ...

-Affinger, ブログ・wordpress運営
-, ,