この記事がお勧めな方
- AFFINGER6のランキング管理機能の使い方を知りたい方
- AFFINGER6のランキング表示がどんな感じか知りたい方
AFFINGER6:ランキングを表示させる手順
AFFINGER6では1位から3位までのランキング作成して指定の場所に一括で表示させることができます。
こんな感じのランキングを表示することができます。

表示させる手順は次の通りになります。
- ランキング管理でランキング1位から3位を作成する
- ランキング管理の基本設定で見出しや表示位置を設定する
① ランキング管理でランキングを作成する
まず、ランキング1位から3位までを作成します。
「ランキング管理」→「ランキング1位~3位」で作成することができます。


a) タイトル | ランキングで紹介する商品のタイトルと星を設定 |
b)アフィリエイトコード(バナー) | アフィリエイトコード(バナー)を入力して商品画像を設定 |
c)説明 | 紹介する商品の説明文を設定 |
d)詳細ページへのリンクURL | 自分のサイトで商品の詳細ページがある場合はURLを入力 |
e)アフィリエイトコード(テキスト) | アフィリエイトコード(テキスト)を入力 |


a) タイトル
ランキングで紹介する商品のタイトルと星数を設定することができます。
b) アフィリエイトコード(バナー)
アフィリエイトコード(バナー)を入力することで、商品画像を表示させることができます。
バナーサイズは300px以上が推奨です。
c) 説明
紹介する商品の説明分を入力します。
d) 詳細ページへのリンクURL
自分のサイトで商品の詳細ページなどがある場合に、そのURLを入力します。
e) アフィリエイトコード(テキスト)
アフィリエイトコード(テキスト)を入力します。
詳細についてはAFFINGER6(アフィンガー6)の公式マニュアルでも確認できます。
ランキング商品の登録が終了したら保存するのを忘れないように注意しましょう。
② ランキング管理の基本設定で見出しや表示位置を設定する
次にランキング管理の基本設定で大見出しや表示位置を設定します。

①:ランキングの大見出し | ランキングの大見出しの設定 |
②:オリジナルページへのリンクボタンに表示するテキスト | オリジナルページへのボタンに表示するテキストを設定 |
ランキング全体の説明 | 大見出しの説明文の設定 |
③:ランキングの表示 | ランキングを表示させる場所の設定 |
④:バナーサイズ | バナーサイズを300pxに設定 |
⑤:演出 | ボタンに光る演出を追加 |


① ランキングの大見出し
ランキングの大見出しを作成します。
例:入力欄に「お勧めレンタルサーバー」と入力するとこんな感じです。

② オリジナルページへのリンクボタンに表示するテキスト
オリジナルページへのリンクボタンに表示するテキストを設定可能です。

ランキング全体の説明
大見出し下のランキングの説明分です。

③ ランキングの表示
ランキングを表示する位置を設定できます。
トップページとサイドバーに表示を選択するとこんな感じです。

④ バナーサイズ
バナーサイズを300pxに変更することが可能です。
⑤ 演出
ボタンに光る演出を加えることができます。
ランキング管理:補足
① ランキングアイコンを変更する
ランキングのアイコンを変更することが可能です。
変更する方法は「ランキング管理」の「アイコン」から1位~3位にそれぞれ用意した画像をアップロードすればOKです。

実際にランキングアイコンを変更してみるとこんな感じです。

アップロードする画像サイズは50~60px程度がいいかもしれません。
上の表示例では60×60pxの画像を作成してアップロードしました。
オリジナルのランキングアイコンを使用したい場合は複数サイズの画像を準備して実際表示を確認しながら設定するのがお勧めです。
② 見出しやボタンの色などを変更する
見出しやボタンの色を「ランキング管理」→「ランキングCSS」で変更することができます。

ランキングCSSで変更できること
ランキング見出し部分 |
---|
ランキング見出しテキスト色 |
ランキング見出し背景色 |
ランキング見出しボーダー色 |

リンクボタン部分 |
---|
リンク文字カラー |
オリジナルリンク背景色 |
アフィリエイトリンク背景色 |

その他 |
---|
ランキングタイトル吹き出し背景色 |
ランキング総タイトル文字色 |
ランキング一覧背景色 |

ランキング管理では1位~3位までのランキングを指定の場所に一括で表示させることができますが、記事内でちょっとしたランキングを作成したいなぁと思う方もいると思います。
例えば、下のような感じのランキングです。

AFFINGER6(アフィンガー6)の記事作成機能を使用して簡単に記事内にランキングを作成することができます。
詳細については別記事で説明していますので、そちらを参考にしてみてください。
→ AFFINGER6(アフィンガー6)の記事作成機能でランキングを作成する方法
ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

AIなんて難しそう・・・
そう感じて活用しないのは勿体無いです。
気軽に使うのに無料お試しがお勧め♪

現在は多くのAIライティングツールがあります。
そのほとんどが無料お試しでの利用が可能です。
お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。
例えば、こんなツールです。
詳しくはこちらの記事で→ 無料お試しがずっと可能なAIライティングツール
広告
AFFINGER6:記事一覧
-
-
AFFINGER6で出来ること【まとめ】-AFFINGER6を徹底解説
2025/2/14
AFFINGER6を使ってみたい!気になる!という方向けに AFFINGER6ってどんなテーマ? AFFINGER6でどんなことができるの? AFFINGER6を使うにはどうすればいいの? といった内 ...
-
-
(通常版)AFFINGER6と(上位版)AFFINGER6 EXの違い【まとめ】
2025/3/7 AFFINGER6
AFFINGER6を購入しようと検討している方や既に通常版のAFFINGER6を使用している方で、その違いが気になる方も多いと思います。 そこで、この記事では(通常版)AFFINGER6と(上位版)A ...
-
-
『SWELL』ってどうなの?-実際に利用したメリットとデメリットをガチレビュー!
2025/2/21 SWELL
SWELLはとても人気の高いテーマです。 この記事はSWELLが気になる方向けにメリットとデメリットを紹介しています。 価格 17,600円(税込み) シンプル&高機能なWordPressテーマ! 最 ...
-
-
AFFINGER6は初心者が購入しても大丈夫?-初心者にお勧めの理由
2025/3/7 AFFINGER6
AFFINGER6を購入しようと思っている初心者の方は、解らないことが多いからこそ購入に対して不安を感じるかもしれません。 この記事は、実際に知識ゼロからAFFINGER6を使用した私が断言できる内容 ...
AFFINGER6の購入とインストール方法
-
-
【知っておくべき!】AFFINGER6の購入方法と購入プランの選び方-⑤種類から最適を選択!
2025/3/12 AFFINGER6
AFFINGER6を使ってみたい! という方に ちょっと待ってください! AFFINGER6を購入する際には複数のプランが存在しますので、自分の取り組み方に合った購入方法を選択した方がお得に購入できま ...
-
-
AFFINGER6(アフィンガー6)のインストール方法-初心者でも安心!購入プランから徹底解説!
2025/2/18 AFFINGER6
AFFINGER6の購入からインストールして使えるようにするまでの手順や注意点を詳しく解説しています。 価格 14,800円(税込み) 有名ブロガーさん多数使用のWordPressテーマ! 「稼ぐ」に ...
-
-
AFFINGER6(アフィンガー6)EX版の購入とアップグレードの方法
2025/3/9 AFFINGER6
この記事ではAFFINGER6の上位版である「AFFINGER6EX」へのアップグレード方法を解説しています。 AFFINGER6EX版にアップグレードする為の条件 AFFINGER6からEX版にアッ ...
AFFINGER6の設定関係
-
-
AFFINGER6導入後にまず何をしたらいいの?-初心者にお勧めの初期設定4項目
2025/3/6 AFFINGER6
「ブログで稼ぎたい!」 って思いブログを始めた初心者の方も多いと思います。 収益化するには何より記事を作成しなければ話になりません。 この記事ではAFFINGER6を始めたばかりの初心者の方向けに、い ...
-
-
AFFINGER6(アフィンガー6)にお勧めのプラグイン【初心者向け】
2025/2/19 AFFINGER6
AFFINGER6にお勧めのプラグインを9つ紹介しています。 初心者の方は何を導入すればいいのか解らないと思いますので、是非参考にしてみてください。 プラグインとは? 「プラグイン」とはワードプレスを ...
-
-
AFFINGER6で今使っているバージョンを確認する方法
2025/3/12 AFFINGER6
AFFINGER6に限らずテーマを最新の状態にアップデートすることは大切です。 ここでは、AFFINGER6で今使っているバージョン情報を確認する方法やアップデートに関する内容を解説しています。 バー ...
-
-
AFFINGER6のアップデート方法(2パターンを解説)
2024/12/30 AFFINGER6
この記事がお勧めな方 AFFINGER6のアップデート方法を知りたい方 AFFINGER6の手動でのアップデート方法が知りたい方 AFFINGER6で自動更新のお知らせを設定する方法を知りたい方 AF ...
-
-
AFFINGER6(アフィンガー6)でGoogleアナリティクスを導入する方法
2025/3/9 AFFINGER6
ここではAFFINGER6(アフィンガー6)でGoogleアナリティクスを導入する方法を初心者向けに解説しています。 AFFINGER6(アフィンガー6)では簡単にGoogleアナリティクスを導入して ...
-
-
AFFINGER6:Googleサーチコンソールへの登録方法
2025/3/9 AFFINGER6
Googleサーチコンソールではあなたのサイトが「どんなキーワードで表示されたのか」を確認することができたり、あなたのサイトのページが「どれくらいインデックスされているか」などを調べることができます。 ...
-
-
AFFINGER6のステマ規制対策-広告表記を表示させる方法
2025/3/8 AFFINGER6
この記事ではステマ規制対策としてAFFINGER6(アフィンガー6)で記事に「広告」表記を表示させる方法を解説しています。 ステマ規制とは2023年10月から開始された「ステルスマーケティング」に対す ...
AFFINGER6の使い方
-
-
AFFINGER6の使い方【まとめ】-初心者向けガイド-
2025/3/8 AFFINGER6
この記事はAFFINGER6(アフィンガー6)の使い方を初心者向けに詳しく解説しています。 見出しの作成方法 記事作成の基本!見出し作成や見出しについての記事です。 カテゴリーの作成とカテゴリーページ ...
AFFINGER6のデザインカスタマイズ
-
-
AFFINGER6のカスタマイズ方法-初心者向けガイド-
2025/3/8 AFFINGER6
この記事ではAFFINGER6のカスタマイズ方法を初心者向けに詳しく解説しています。 デザインカードプラグインでサイトデザインを変更する方法 プラグインでサイトデザインを簡単に変更できるようになりまし ...