一年ほど前から無料ブログを利用させてもらい感謝しています。
カウンターを設置したく思い、色々と検索の末、成功したようですので、その方法を記載したいと思います。
無料ブログにログイン＞「デザインメニュー」＞「テンプレート選択」
「テンプレート選択」＞「カスタム」＞「カスタムブルー」
これがこのブログを作成した際の基本設定です。そして・・・
「テンプレート編集」
ＣＳＳデータのみ編集が可能。
ブログに「カウンター」を貼り付けた作業内容を書いてみます。
１．画像カウンターを「他の無料カウンターサイト」で作る。
私は「Ｗａｎｚネット」（gifを選択）を利用させて戴きました。
２．送られてくる利用方法の中の「イメージタグ」を利用する。
＜img src="*ttp://www.****.net/counter.cgi?******＞
３．ブログの『タイトルの下』の部分に貼り付ける。 【ここからが重要】
ＣＳＳデータ内の「元の記載」
/* ブログのタイトル部下 */
.headerDark {
background-image: url();
background-repeat: ;
background-position: ;
background-color: #1b467b;
}
ＣＳＳデータ内の「変更したあとの記載」
/* ブログのタイトル部下 */
.headerDark {
background-image: url(*ttp://www.****.net/counter.cgi?******);
background-repeat: no-repeat;
background-position: left center;
background-color: #1b467b;
}
【 注 上記データは表示を優先し全角空間を使用していますので
絶対に、このままをコピーペーストしないで下さい。】
上記の中の、変更点（３箇所）の説明（空間も含め全て半角で変更）
元の記載の３行目
background-image: url(); の右３文字「();」の() 括弧の間に
用意したカウンター画像のＵＲＬ「*ttp:/～/?******」を貼り付ける。
元の記載の４行目
background-repeat: ; の右３文字「: ;」（コロン空間セミコロン）を
「: no-repeat;」に変更する。 【 注 「:とn」の間に半角空間 】
元の記載の５行目
background-position: ; の右３文字「: ;」（コロン空間セミコロン）を
「: left center;」に変更する。 【 注 「:とｌ」の間に半角空間 】
これでカウンターの設置が終わりました。
プレビューで確認して下さい。
画像が表示されていれば成功だと思います。
自分が更新してもカウントされませんので、次回の来訪があるまでカウンターは変動しませんでしたが、３時間経った現在、ちゃんとカウントされているようです。
文字数にすると大変なように思えますが、カウンターのＵＲＬを獲得しさえすれば、あとは「ＣＳＳデータ」の３箇所を変更するだけです。
なお、右端に貼り付ける場合は５行目を「: right center;」に
中央に貼り付ける場合は５行目を「: center;」にして下さい。
私の場合はこれで成功しました。
なお、変更を保存する前に必ずプレビューで確認、
失敗の場合は「前回保存時に戻る」で回復して下さい。 祈・成功！
Ｐ．Ｓ．なお、今日スタートしたカウンターの初期値は
管理画面で表示された日々のカウントを含む「１６４００」です。
| Trackback ( 0 )
|
おすすめブログ
@goo_blog
