☆みんカラにアクセスカウンタを設置しよう☆

※現在はみんカラのスタイルシート仕様が変わっているためこの方法では設置できないかもしれません。検証してません、ご迷惑をおかけしますスミマセン。。。



☆みんカラにアクセスカウンタを設置しよう☆


はい、とりあえず思いつきでカウンタを設置してみたのですが、意外と反響があったのでみんカラにアクセスカウンタを設置する方法を紹介しようと思います。大したことではありません。大丈夫。君ならやれる。何故なら僕でも出来たから！！！

できるだけわかりやすく解説していこうと思いますのでよろしくお願いしますね＾＾



①導入(読み飛ばし可)

さて、まず何でもいいのでカウンタを用意しなければなりません。今回はCGIではなく、CSS<スタイルシート>を利用してカウンタを設置します。こっちの方が楽でしょう。僕が実際に登録した手順で紹介しますので、その後はご自分の好きなように改造しちゃってください☆




②．忍TOOLSにIDを登録する。

今回、アクセスカウンタにはSHINOBI.JPのツールを使います。管理の便利さ、デザインの豊富さ、使い勝手等最強の部類に入ります。

まずIDを登録してください。上のURLの一番右上からIDを登録するページに飛びます。

************* 重要 *************

今回の方法を使う場合、必ずリンクへSHINOBI.JPを追加してください。

でないと規約違反となり、削除の対象となります。詳しくはこちら
SHINOBI.JPさんのご厚意でカウンタ設置が可能になっています。

*******************************



③．カウンタの作成！

さて、②が完了したら、管理ページにログインします。ページの右上から行けます。

管理ページの右側下段に、「作成できるツール」という項目がありますので、『カウンター作成』をクリックしてください。

ツールの名前：「みんカラカウンタ」
ツールの説明：「みんカラ用のカウンタ（笑）」

とでもしておきましょう。(後から変更可能です)　

利用規約を熟読した後、チェックボックスにチェックをして、作成ボタンを押しましょう。





その後適当にOKボタンを押したりしていると、ツール一覧のページに行きます。

カウンタが作成されたことを確認しましょう。


できた


さて、これのみんカラカウンタをクリックしてください。

するとこんな画面が出ます。「カウンターの設置」ボタンをクリックしてください。



画面にカウンタのソースが表示されます。



アメブロっていうのはアメーバブログというブログサービスのことですが、今はシカトしてください。

このアメブロ専用タグの　<img src> 属性のところのURLを使います。メモる必要は無いですが、後から使うのでここに書いてあるということを覚えておいてくださいね。




ちょっと息抜きに、カウンタのデザインもここで決めちゃいましょう。(後から簡単に変更できます。)



上の画面のように「カウンターの選択」ボタンから色々選べますので適当にいじってカウンタを選んでみてください☆






④CSSの編集

さて！いよいよCSS（スタイルシート）の編集です。

１．マイページを開く
２．メニューの「スタイルシート」をクリック。
３．カスタマイズ１のラジオボタンに印をつけて、「スタイル編集」ボタンをクリックします。

４．「ブラック」を選んで「読み込みボタン」をクリックします。(↓画像)


注意）僕のページは「ブラック」ベースで書いてありますが、ここではみなさんのページあったデザインを選んでくださいね☆



５．すると確認のダイアログが出ます。

もちろんOKをクリックです。



すると、こんな画面が出ますね。


今回は上のbodyの中をいじります。

自分のみんカラの全てのページに適用されるキマリごとみたいなことが書いてあります。



６．body 内にコードを追加します。



赤枠内を追加しくてださい。

以下をコピペで行けます。


/* 画像の高さ＋30pxの空白を上部に追加 */
padding: 30px 0px 0px 0px;

/* カウンタのURL */
background-image:
url("カウンタURL");

/* ページの右上から10pxの位置に配置する */
background-position: right 10px;

/* 繰り返し表示しない */
background-repeat: no-repeat;


カウンタURLのところには③で作成したカウンタのURLを入れてください。
このとき、アメブロ用の img src のところのURLを選んでくださいね。僕は違う部分のURLを書いて失敗しました＾＾；




⑤確認

編集画面の下にある「プレビュー」ボタンをクリックして確認してみてください。

右上にカウンタが表示されていれば完了です。

カスタマイズ１のところへ(変更を記述した方)のスタイルにチェックを入れ、「選択したスタイルに変更」ボタンを押しましょう。



これで完了です！



ふー･･･。

さて、いかがでしょう？？出来ましたか？？　画像が多すぎて説明わかりづらいですかね…。

今回の方法でうまく出来ないという方は遠慮なく質問なさってください☆
他のマニアックな方法にチャレンジする方は･･･頑張ってください＾＾；



※注意

・今回はbody属性をいじり、カウンタを背景画像としています。よって、すでにブログの背景に画像を使用している人は別の方法が必要になります。
→カウンタ画像の設置をbody以外に設定することで、背景画像とカウンタ画像を共存させてらっしゃる方のページを紹介します。
銀珊瑚さん、はぎ@滋賀さん のページです。大変わかりやすい説明です。参考に是非☆
基本的に各フィールドの background-image: url("カウンタURL"); を変更する必要があります。

・忍カウンタの「その他の設定」で「二重カウントを防止する」にしておかないと、カウンタがガンガン回っちゃいます。(ある意味PVと同じ働きをします)
・みんカラのPV機能と忍のアクセス解析機能は多少なり異なった手法で行われていると思われます。





あー･･･ちゃんと説明出来てるかなコレ･･･。

出来なかったらスイマセン！！



お役に立てましたでしょうか？

みなさんもアクセスカウンタを設置してみんカラを楽しんでみませんか？





今回、一部の皆様に多大なご迷惑をおかけしました。
大変深く反省しております。申し訳ありませんでした。

今回のことを厳粛に受け止め、今後に活かしていきたいと思います。





<2007/2/17 追記>
この度このブログのコメント数が200件に到達致しました。
こんなブログに足あとを残して頂き、本当にありがとうございました。

お礼。