アクセスランキングをスクロール表示にしてみた | パソコンが好きになるブログ〜表技・裏技・便利技伝授!

パソコンが好きになるブログ〜表技・裏技・便利技伝授!

北海道札幌市中央区 大通駅徒歩7分のパソコンスクール「リズ札幌・ライフデザインスクール」パソコンインストラクター川上雄大によるパソコン・IT・ワンポイントレッスン。
スクールでのいろんな方のパソコンレッスンだったり、パソコンとは関係ない話だったり…

こんにちは、パソコンワンポイントレッスン!

PCインストラクターの川上です。


私の場合、実際のパソコンレッスンでアメブロのカスタマイズの仕方も教えなければならないので、色々と実験をしているわけでして・・・

でも、このブログでの実験をマジマジとご覧になっていらっしゃる読者の方もいらっしゃるわけでして・・・

実は、ある方からメッセージをいただきまして、

「アクセスランキングに私のブログ名が載らないように、順位表示数を限定しているのでしょうか?」


といった・・・


いえいえ、とんでもございません!


そもそも、アクセスランキングをなぜ設置しているかというと、

私のブログをご紹介いただいたブログにアクセスをお返しするために設置しているのです。
(過去記事『アクセスランキングの基本的な使い方』をご覧になっていただけるとありがたいです。それから、この方も便利だって言ってますよ~^^)

ですから、できるだけすべての方を表示したいのです^^!


ACRランキングでは最大が50件までの表示となっています。
でも、50件すべて表示すると、下にびろ~んと長くなっていて見づらかったりします。


そこで、見つけました!
ある記事を。

そうなんです、スクロールさせればよかったのですね^^!


ということで、早速、アクセスランキングをこのようにスクロールするように設定しました。

川上雄大のワンポイントレッスン
 

アクセスランキングをスクロール表示する方法

設定方法は

1.ブログパーツ(ここではACRアクセスランキング)に適当な名前をつける
(私は「ranking」とつけました。半角英数であればなんでもよいですよ。)

2.フリープラグインにて、ブログパーツ(ここではACRアクセスランキング)を

<div class="ranking"></div>


で囲む

川上雄大のワンポイントレッスン
 
※<div class="ranking"></div>は自分で入力するかコピペしてくださいね。 
ご自分のフリープラグインの中を探してもないですからね~^^

→[保存]ボタンを押す

3.CSS(スタイルシート)に次の記述を追加する
(一番最後でいいですよ)

/*ACRランキングスクロール*/
.ranking{
overflow: auto; height: 470px;
}


川上雄大のワンポイントレッスン


私は、高さを470pxにしましたが、200pxとかでもいいですので、ご自分で調整してみてください。

→[保存]ボタンを押す

川上雄大のワンポイントレッスン

<注意1>
「リクエストは既に処理中であるか無効です」と表示されてしまっても、慌てずに保存しなおしてみてください。
過去記事の『「リクエストは既に処理中であるか無効です」に対抗するには』もご覧になってみてください。

<注意2>
ここで、「表示を確認する」を押しても、表示されませんので↓↓↓

川上雄大のワンポイントレッスン


4.最後に、自分のブログに戻って、「F5」キーを押して更新して完了!

なかなかスクロールが表示されない場合は、
Ctrl+F5キー
を押して、強制更新しましょう。


ちなみに、私が見つけたある記事とはこちらになります↓↓↓


福島県から
水村亜里(みなむら あさと)さんの
研Q114.サイドバーで場所をとるランキングなどをスクロール表示にする方法。


岩手県から
震災復興をアメブロから応援中!のたっくんさんの
◆ページランキングにスクロールバーを設置する方法




とても参考になりました。ありがとうございました。



以上、アクセスランキングをスクロール表示するでした。

LIDS澄川・ライフデザインスクール
川上 雄大