FC2ブログで人気記事ランキングを表示する

今回、僕も導入したACR WEBのブログパーツの紹介をします。登録は完全に無料でカスタマイズが自由です。
まずは僕のPC版のサイドバーの「人気記事ランキング」を確認してください。テンプレートに違和感無く表示するようにカスタマイズをしています。

では、このACRWEBのFC2ブログへの導入手順を書いてみます。

ACR WEBはこちらから

まずはリンクをクリックしてください。アクセスしたらACRのトップページに飛びます。トップページの左側のメニューの中の「ページランキング」をクリックします。(赤線の部分)

acrweb kanrigamen

管理ページサンプルのリンクなどが表示されるページが出てきますが、そのページの下部に新規登録を打ち込むフォームがあります。

acrweb meil

上から順番に打ち込みます。メールアドレス、URL(ブログのトップページの)、ユーザーIDは管理画面にログインするときに必要になりますので覚えておいて下さい。

さらにパスワード(こちらもIDと同じでログインに必要です)、サイトのジャンルはそのままで良いです。最後に利用規約に同意し申し込むをクリック。

すると、すぐにメールが送られてくると思います。そのメールに管理画面URLの貼り付けてありますので、そこから管理画面にジャンプします。

管理画面で先ほど設定したIDとパスワードを入力して管理画面にログインします。

スポンサーリンク

管理画面にログイン

管理画面にログインするとページ上にメニューがあります。

メニューは環境設定、置換設定、除外設定、タイトル除外設定、上級者向け設定、タグ取得、ランキングの自動更新、パスワード変更とあります。

僕も完全には使いこなせていませんが分かる範囲で説明します。

環境設定

環境設定で「ランキングの表示をカスタマイズ」を行います。

acr web tikan

上記は僕の設定になりますがページランキングに「タイトル」を表示する場合のタイトル部分の設定になります。

僕の場合はFC2ブログはフリーエリアを使用する場合にタイトルが表示されるので、非表示にしています。非表示にする場合は「タイトルサイズ」を0に設定するとタイトルは表示されません。

さらに奇数、偶数順位、表ラインの色はテンプレートに合わせて白色に設定しています。リンクの色もテンプレートに合わせて青色に文字サイズもサイドバーの文字の大きさに合わせています。

表全体の幅は使っているテンプレートのサイズに合わせればいいと思います。最後の集計方法や表示方法は好みで♪

タイトル自動設定

これは必ずやっておいたほうが良いです。設定は簡単で、あなたのブログのRSSのURLを打ち込めば完了です。

その設定をしておけば”その後に更新した記事はタイトルを自動で取得してくれます”。問題はそれ以前の記事なのですが…自分で打ち込む必要があります。

そこで使うのが「置換設定」になります。

置換設定

この置換設定で「タイトルを取得していない記事」のURLを入力しなければいけません。

しかし、全部の記事をする必要は無いと思います。例えばランキングの表示数を10件に設定しているのであれば、ランキングには当然ですが上位10記事が表示されます。

表示される記事の中にタイトルを取得できていない記事が表示されると「URLのみの」表示になります。
後は簡単です、記事ランキングにURLが表示されタイトルが取得できていない記事のURLを置換設定に入力するだけです。

acrweb tikan

ランキングに表示されているURLを置き換え前のURL、置き換え後のURLどちらにも入力しタイトルを打ち込むだけです。

除外設定、上級者向け設定

除外設定はそのままの意味になります。ランキングから除外したいURLを入力し、除外するだけの項目になります。
上級者向け設定は使う機会はあまりないです。

タグの取得

最後にタグを取得します。この時の注意点が「カウント取得用タグ」と「ランキング表示用タグ」の2つのタグをFC2側に貼り付ける必要があります。

僕の場合はランキング表示用タグの上にカウントタグえお貼り付けています。

PC版のサイドバーを見れば分かりますが、ランキングの上にカウントのタグが表示されています。

最後に

最初から落ち着いて手順を踏めば簡単に設置できます。しかし、めんどくせーよ!という方には簡単なブログパーツもあります。

簡単なブログパーツ

見た目的なことを気にしないのであれば簡単に設置できるのでお勧めです^^

こちらの記事もあわせてどうぞ!
便利アイテムまとめ

FC2ブログで人気記事ランキングを表示する
この記事をお届けした
0822の奇跡の最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする