goo

メニュー上部にカウンタ設置

gooブログのシンプル系テンプレート(クリアオレンジ、クリアグレー、クリアパープル、クリアピンク、クリアブルー、クリアホワイト)のメニュー上部にアクセスカウンタを設置するサンプルです。
ブログタイトル部分にアクセスカウンタを設置する場合は、「タイトル背景とカウンタ設置」の記事をご覧ください。

gooブログで背景画像を設定(変更)するためにはCSSの編集が必要なので、使用できるテンプレートカスタムマークカスタムマーク の付いているものに限定されます。また、カウンタ画像を貼り付けることができる「場所」が必要です。
今回は、シンプル系テンプレートにある#sideBar#menu1#menu2といったメニューを囲んでいるID(場所)を利用します。

シンプル系テンプレート(クリアピンク左など)での設定例は、以下の通り。

  1. シンプル系左テンプレート/シンプル系右テンプレートの場合
    クリアミント左
    クリアミント右
    CSSの編集で、#sideBar の背景画像としてカウンタ画像を追加する。
    なお、カウンタ画像の高さは20pxと仮定した。
    【修正前】
    /* メニューレイアウト用 */
    #sideBar {
    }
     ↓
    【修正後】
    /* メニューレイアウト用 */
    #sideBar {
      /* メニュー背景にカウンタ画像を追加 */
      /* 画像の高さ+α分の余白を上部に追加 */
      padding: 30px 0px 0px 0px;
      /* あなたのカウンタ画像のURL */
      background-image:
        url("http://your_counter.jp/counter_url");
      /* 中央上部に配置 */
      background-position: center top;
      /* 繰り返し無し */
      background-repeat: no-repeat;
    }
    
    
  2. シンプル系左右テンプレート-左メニュー上部に配置する場合
    クリアミント左右-左メニュー上部配置 CSSの編集で、#menu1 の背景画像としてカウンタ画像を追加する。
    なお、カウンタ画像の高さは20pxと仮定した。
    【修正前】
    /* 左メニュー背景 */
    #menu1 {
      float: left;
      width: 180px;
    }
     ↓
    【修正後】
    /* 左メニュー背景 */
    #menu1 {
      float: left;
      width: 180px;
      /* 左メニュー背景にカウンタ画像を追加 */
      /* 画像の高さ10pxの余白を上部に追加 */
      padding: 30px 0px 0px 0px;
      /* あなたのカウンタ画像のURL */
      background-image:
        url("http://your_counter.jp/counter_url");
      /* 中央上部10pxの位置に配置 */
      background-position: center 10px;
      /* 繰り返し無し */
      background-repeat: no-repeat;
    }
    
    
  3. シンプル系左右テンプレート-右メニュー上部に配置する場合
    クリアミント左右-右メニュー上部配置 CSSの編集で、#menu2 の背景画像としてカウンタ画像を追加する。
    なお、カウンタ画像の高さは20pxと仮定した。
    【修正前】
    /* 右メニュー背景 */
    #menu2 {
      float: right;
      width: 180px;
    }
     ↓
    【修正後】
    /* 右メニュー背景 */
    #menu2 {
      float: right;
      width: 180px;
      /* 右メニュー背景にカウンタ画像を追加 */
      /* 画像の高さ10pxの余白を上部に追加 */
      padding: 30px 0px 0px 0px;
      /* あなたのカウンタ画像のURL */
      background-image:
        url("http://your_counter.jp/counter_url");
      /* 中央上部10pxの位置に配置 */
      background-position: center 10px;
      /* 繰り返し無し */
      background-repeat: no-repeat;
    }
    

# 勿論、gooブログアドバンスならテンプレートを編集できるので、こんな方法で無理矢理設置する必要はありません

また、gooブログではセキュリティ上の問題からscriptタグは使用できませんので、カウンタは「画像形式」のものを使用してください。

画像形式カウンタはご自分で作成されても構いませんが、アクセスカウンタは無償レンタルすることもできますので、プログラミングができない方でもアクセスカウンタ設置はできます。

カウンタ画像URL(http://your_counter.jp/counter_url)の例
青字部分は指定された値を使ってください。

  1. よろづカウンター(忍者TOOLS)の例
    http://ct#.shinobi.jp/xx/カウンタのID
    「カウンタの設置(カウンタ用HTMLソースの貼り方)」にあるimgタグのsrc属性の値です。

  2. アクセスタウンタ(Wanzネット)の例
    http://www.wanz.net/counter/counter.cgi?カウンタのID
    「画像カウンタをイメージタグで表示する場合」にあるimgタグのsrc属性の値です。
● よくある間違い
background-image: url() の()の中には、border="0"alt="文字列"など、src属性の値以外を付加してはいけません。

【指定されたimgタグの例】
<img src="http://ct#.shinobi.jp/xx/カウンタのID" border="0" alt="文字列" />

【誤】
background-image: url("http://ct#.shinobi.jp/xx/カウンタのID" border="0" alt="文字列");
 ↓
【正】
background-image: url("http://ct#.shinobi.jp/xx/カウンタのID");


↑B質問 カウンターについて - goo ブログサークル
タイトル背景とカウンタ設置 シンプル系テンプレートでのタイトル部分設置例
カスタムメタルでカウンタ設置 カスタムメタルでのタイトル部分設置例
クリアミントのCSS
よろづカウンター - 忍者TOOLS (レンタルカウンタ)
アクセスタウンタ設置 - Wanzネット (レンタルカウンタ)

コメント ( 63 ) | Trackback ( 9 )
« メニュー上部... ガンダム占い »
 
コメント
 
 
 
カウンタ付きました (鉄蒸ス)
2005-11-03 08:24:45
 先日はお世話になりました。



 報告が遅くなりましたが、カウンタが無事付きました。

 ありがとうございました。
 
 
 
カウンタ設置法法 (masu)
2005-12-21 19:47:02
先日、CSSにWanzネットでレンタルした

カウンタ貼付けました…が、

カウンタがちゃんと表示されないんです。



ページには出ているんですが、表示される数字は

どうやら「そのPCが始めてアクセスした時点での数字」で、

1日たってからアクセスしても

最新の数字が表示されず、始めてアクセスした時点のまま

変わらないんです。

(何台かでアクセスしてみた結果そうでした。)



それから、別の無料カウンタを申し込んだら

HTMLタグは2行とかできます。"a herf"とかで

始まる…。

それでも貼付けるのは、img=以降だけで

可動できるのでしょうか?



長々と申し訳ありません。

ご返答いただければ幸いです。
 
 
 
どうしてでしょう (かつを)
2005-12-21 22:57:39
>1日たってからアクセスしても

最新の数字が表示されず、始めてアクセスした時点のまま



Wanzネットの調子がちょっと悪いのかも知れませんね。

調子が悪くても、暫くカウンタをつけた上体のままにしてみませんか?



もしかしたら、数日で直るかも知れませんし、カウンタをつけた状態なら、原因が分かるかも知れませんし。
 
 
 
ご返答ありがとうございます (masu)
2005-12-22 00:31:41
一応、Wanzネットの情報交換BBSで質問してみました。

現在返答待ちです。



とりあえず、そのままの状態にしてみます…。



ありがとうございました。



なにか進展があれば、お知らせします。
 
 
 
わざわざ… (masu)
2005-12-22 09:25:37
私のサイトまで足を運んでまで

様子を見ていただいて、ありがとうございます!!



どうやら今度は、ちゃんと機能しているようです。



Wanzの方も、もうひとつレンタルしたHTMLタグから

IMG以降を貼付けた方も。



なんだったのかはわかりませんが、

助かりました。



通りすがりの私に、親切にありがとうございました!!!
 
 
 
再び…(泣) (masu)
2005-12-22 16:27:19
お昼頃に様子を見たら、またまた同じ状況でした…。



最新の数字にならず…。



で、キャッシュを空にしてみたら…

カウンタが動きました!



…が、今、実験的にWanzとHTMLタグ抜粋版と、

両方設置してみていますうち、

(見ていただいたので2コあるのはご存知と思いますが)

HTMLの方が可動していなくって…。。。



画像的にHTML抜粋のほうが好きなんで、ちょっと…。



こちらはひとまず放置して、様子見てみます…。
 
 
 
はじめまして (St)
2006-01-24 23:12:14
カウンタ設置について調べていたら、こちらに辿り着いた次第です。



多くのことを参考にさせていただきました。



ここで一言お礼を。



有難う御座います。 m(__)m



また、トラックバック練習板以外で初めてしたのでうまく出来ているかわかりませんが、トラックバックさせていただきました。



それでは、これにて失礼いたします。
 
 
 
ども (かつを)
2006-01-25 00:13:07
写真が多いとのことなので、「写真風画像と説明書き」(コメント付き画像)なんかも、使えそうですね。
 
 
 
そうですね~ (St)
2006-01-26 21:49:29
コメント付で複数の画像を一つの記事で扱えるというのは大変便利ですね。



近いうちに試してみようと思います。



>>カウンタについて

コメント有難う御座いました。

javascriptが使えない以上どうしようもなさそうですね。

このままでカウンタを使っていこうと思います。



重ね重ね有難う御座いました。
 
 
 
JavaScriptユーザ埋め込み不可のメリット (かつを)
2006-01-26 22:12:55
>javascriptが使えない以上どうしようもなさそうですね。



実は、ユーザ(ブログオーナ)がJavaScriptを埋め込めないというのは、デメリットばかりではないのです。

変なものを埋め込まれないという、閲覧者が享受するメリットがあります。

それ(閲覧者のメリット)はまた、ブログオーナの最大のメリットでもある訳ですし。
 
 
 
総アクセス数 (M)
2006-03-11 22:16:05
こんばんは!

こちらのブログを参考にして、アクセスカウンターを設置しようと考えております。

そこで疑問が.....

gooブログにて、ブログ開設から今日までの総アクセス数を知ることはできますでしょうか?



宜しくお願いいたします。
 
 
 
メモしていない限り不明 (かつを)
2006-03-11 22:44:25
毎日/毎週分のアクセスIP数(やPV数)を記録していいない限り、最大で4週間分しか残ってないですね。



まぁ、アクセスカウンタの値なんて所詮参考値なので、過去3週間のアクセスIP数から週平均のアクセスIP数を算出して、ブログ開設からの経過週数を掛けた値をカウンタの初期値にすればいいと思いますよ。



因みに、アクセスカウンタでカウントされた値とアクセスIP数(やPV数)は、ほぼ100%一致しません。

# アクセスカウンタ数の方が正しくありません
 
 
 
カウンタ・・・ (のん)
2006-03-13 16:14:07
カウンタ設置は カスタムプレートでないとムリなんでしょぉか・・・

どぉにかして 今使ってるテンプレートにカウンタを付けたいと思って 試行錯誤を繰り返しています

カスタムプレートでCSS編集 も考えましたが 何か 納得の行くプレートが見つからなくて・・・
 
 
 
一応無理です (かつを)
2006-03-14 00:07:53
CUSTOMマークのついているテンプレートじゃないと、CSS編集もアドバンスのHTML編集も、どちらもできないので。



まぁ、「最新の記事」の本文にカウンタを表示するというのなら、どのテンプレートでもできますが、誰もが「最新の記事」を表示するわけじゃない(各記事単体しか表示しない方も多い)のがブログの特徴なので、「最新の記事」にカウンタを表示するのは殆ど意味がないのですよ。
 
 
 
こんばんは (うるち)
2006-06-28 04:47:57
カウンタ設置ができなくて困っていたのですが、



この記事のおかげで何とかカウンタをつけることができました。



本当にありがとうございました。
 
 
 
いらっしゃいませ (かつを)
2006-06-29 00:27:38
Wanzネットのカウンタ、きちんと表示されていましたよ!

ということで、いらっしゃいませ~
 
 
 
かつをさん、ありがとうございました♪ (うめもも)
2006-07-26 17:05:21
はじめまして。

このたびは、カウンタ設置をこちらの記事で

助けていただきました。

本当にありがとうございました。



本日カスタムテンプレート修正の記事をアップし、

かつをさんのリンクをつけさせていただきました。

よろしくお願い致します。
 
 
 
初めまして^^ (とりす)
2006-12-14 23:48:34
最近ブログを始めまして、カウンター付けたいなと忍者ツールまで行ったのですが、そこの説明ではまるっきし判らなく、大変助かりました<(_ _)>
3時間の格闘の末・・・なんとかカウンターが出るまでにはなったのですが。
ノーリピートと関係無く、何故か二行画像が(´Д⊂
知恵熱出るそうです。(/ω\)

成功の暁には是非友達にもこちらを紹介したいのですがリンクフリーなのでしょうか?<(_ _)>
とにもかくにも親切な説明に感謝でいっぱいです。
 
 
 
どもです (かつを)
2006-12-17 12:48:29
リンクによって成立する世界ですから、このブログ(に限らずありとあらゆるウェブページ)には自由にリンクを張って構わないのですよ。

で、問題のカウンタが2個(2箇所に)表示されるのは、「カスタムブルー」というテンプレートの仕様(テンプレートのバグ)ですね。
というのも、シンプル系(クリアなんとか)と違って、カスタムブルーの場合は、menuというidが2箇所に指定されているのです。
# それじゃidじゃないじゃん…

だから、CSSテンプレートの方で#menu(左メニュー背景)のセレクタの背景画像にカウンタを指定すると、HTMLテンプレートの方でid="menu"が指定されている2箇所に表示されてしまうのです。

回避策としては、テンプレートを他のもの(カスタムフリーとかシンプル系18種)に変更するか、カスタムブルーのテンプレートで頑張る場合はカウンタを指定するセレクタを変更するかですね。

とはいえ、テンプレートを変更するのは大変でしょうから、現実的な解としてはセレクタを変更するの方でしょう。
例えば.headerDark(ブログのタイトル部下:オレンジ色の帯部分)には今は何も画像が指定されていませんので、.headerDarkのセレクタにカウンタ画像を移動されてはいかがでしょうか?

【修正前】
/* ブログのタイトル部下 */
.headerDark {
  background-image: url();
  background-repeat: ;
  background-position: ;
  background-color: #ff9933;
}
 :
/* 左メニュー背景 */
#menu {
 :
  background-image: url(カウンタ画像のURL);
  background-repeat: no-repeat;
  background-position: center top;
  background-color: #ffff66;
  padding: 20px 0px 0px 0px;
}
 ↓
【修正後】
/* ブログのタイトル部下 */
.headerDark {
  background-image: url(カウンタ画像のURL);
  background-repeat: no-repeat;
  background-position: left center;
  background-color: #ff9933;
}
 :
/* 左メニュー背景 */
#menu {
 :
  background-image: url();
  background-repeat: ;
  background-position: ;
  background-color: #ffff66;
  padding: 0px 0px 0px 0px;
}

それではまた。
 
 
 
ありがとうございます (とりす)
2006-12-17 14:48:05
うう。すいません。丁寧にご説明ありがとうございます。
さっそく参考にさせていただきました!

カムタムブルーのバグですか・・・・治らないわけですね・・・( TДT)

カウンターも無事ブログタイトル下に設置できました!
ありがとうございます<(_ _)>
 
 
 
ありがとうございます! (Sugar)
2007-01-24 11:31:13
こちらの記事を参考にさせていただき、
カウンターの設置が出来ました。

お気に入りのテンプレートがあったので、
なかなかカスタム可能なテンプレートに移行出来ず
ウダウダしておりましたが、ちょっとハッスル?
してみました。

スルッと出来たのでちょっとビックリです。
本当にありがとうございました!!

取り急ぎお礼まで♪
 
 
 
お返事遅くなりました (かつを)
2007-01-28 01:04:32
カウンタ設定、おめでとうございます。
これからも色々なカスタマイズに挑戦してみてくださいねぇ。
 
 
 
お世話になりました (バレンタイン)
2007-02-04 20:22:58
ブログにカウンタを設置するのにこちらの記事を参考にさせていただきました。
おかげで思ったより簡単にできました!
 
 
 
はじめまして (ty-vettchi)
2007-02-06 22:14:17
カウンタの設置をしたいと思い、いろいろと検索し、かつをさんのブログを発見しました。記事も親切丁寧に記載してあり、CSS、HTMLの編集等、なにも知らない私でもカウンタを設置することができ、お礼を言いたくお邪魔しました。
本当に有難うございました。
 
 
 
どもです (かつを)
2007-02-08 00:15:08
カウンタ設置って、思ったほど難しくないですよね?

ということで、お二方ともカウンタ設置おめでとうございます!
 
 
 
はじめまして☆ (naoya)
2007-02-14 22:46:11
カウンター設置のやり方を探していたらこちらのサイトに行き着きましたm(_ _)m

えっと・・
それで、できません(涙)

使用しているテンプレートはクリアブルー左で
左のメニューの上部にカウンターをつけようと思いまして、

/* メニューレイアウト用 */
#sideBar {
/* メニュー背景にカウンタ画像を追加 */
/* 画像の高さ+α分の余白を上部に追加 */
padding: 30px 0px 0px 0px;
/* あなたのカウンタ画像のURL */
background-image:
 url("http://ct1.toumoku.com/ll/0286217);
/* 中央上部に配置 */
background-position: center top;
/* 繰り返し無し */
background-repeat: no-repeat;
}
このような感じにしたのですが・・・。
カウンター設置用のスペースは空いたのですが、肝心のカウンターが表示されません(泣)
もしかして元からメニューにアップロードした画像とかつけていると無理ですか・・?
 
 
 
すみません・・ (naoya)
2007-02-14 23:18:42
私がアホなだけでした・・。
申し訳ございません。
無事に表示させることができました☆

ありがとうございました♪
 
 
 
おめ~ (かつを)
2007-02-17 13:24:50
gooブログの閲覧数/アクセスIP数と、カウンタの数値は、集計方法が異なるため【ほぼ一致しません】。

取り敢えずカウンタは回っているようなので、気にしないのが一番かと(わは)。
 
 
 
ありがとうございます!! (naoya)
2007-02-18 00:11:16
本当に色々ありがとうございました☆
CSSとか全然イジったことなくて、でもカウンター設置したいが為にイジり始めたので、無事に設置できて本当に良かったです!
これからも頑張って下さい♪
それでは失礼しますm(_ _)m
 
 
 
カウンタ設置できました! (kayo)
2007-02-24 21:10:24
はじめまして。
丁寧な説明があったのでカウンタを設置することができました。本当にありがとうございました。
gooブログはいじれないと思っていましたので驚きました。
 
 
 
おへんじ遅くなりました (かつを)
2007-03-01 01:23:24
カウンタはきちんと動いているようで良かったです。

それから「ブックマーク」にまでいれてもらったようで、どうもありがとうございます。
 
 
 
カウンターできました (ebiko)
2007-06-16 21:41:17
カウンタの設置方法を探していてたどり着きました。
忍者カウンターのタグを全部貼るのではなく
<img src="http://ct1.kagennotuki.com/ll/カウンターのID"
の中のURLだけなんですね。
似たURLがもう一つあり、先にそっちを入力したので時間がかかってしまいました。
CSSど素人のためタイトル画像の変更とあわせて半日かかりましたが無事に設置できました。
とっても嬉しいです!!
ありがとうございました。
 
 
 
切れちゃった・・・ (ebiko)
2007-06-16 21:45:12
<img src="http://ct1.kagennotuki.com/ll/カウンターID"
だけなんですね。
もう一つ似たURLを先に貼り付けたため表示されずタイトル画像の変更とあわせて半日かかりました。
CSS初心者でも無事に設置できました。
とても役に立ちました。嬉しいです!!
ありがとうございました。
 
 
 
なぜかコメントができません (ebiko)
2007-06-16 21:48:13
ありがとうございました!
 
 
 
<の後ろは切れちゃうんです (かつを)
2007-06-19 23:06:01
お返事遅くなりました。
先ずは、カウンタ設置おめでとうございます。

>なぜかコメントができません

え~とですね、gooブログの場合は「<」の記号を(含む)コメントしたい場合は、「&lt;」と書かないといけないのです。
そうしないと次に「>」がくる(またはコメントの最後)までをHTMLタグの内容とみなして、コメント欄に表示してくれないのです。
# コメント欄ではHTMLタグは使えませんから、タグとみなした部分は全て捨てられてしまう

ということで、コメント通知メールからコメントを復活しておきます。


カウンターできました (ebiko)
2007-06-16 21:41:17
カウンタの設置方法を探していてたどり着きました。
忍者カウンターのタグを全部貼るのではなく
<img src="http://ct1.kagennotuki.com/ll/カウンターのID"
の中のURLだけなんですね。
似たURLがもう一つあり、先にそっちを入力したので時間がかかってしまいました。
CSSど素人のためタイトル画像の変更とあわせて半日かかりましたが無事に設置できました。
とっても嬉しいです!!
ありがとうございました。

切れちゃった・・・ (ebiko)
2007-06-16 21:45:12
<img src="http://ct1.kagennotuki.com/ll/カウンターID"
だけなんですね。
もう一つ似たURLを先に貼り付けたため表示されずタイトル画像の変更とあわせて半日かかりました。
CSS初心者でも無事に設置できました。
とても役に立ちました。嬉しいです!!
ありがとうございました。


ということで、今後ともよろしく~。
 
 
 
初めまして (すぐる)
2007-07-20 01:13:14
gooブログにカウンターを付けようかと思い、こちらのブログに辿り着きました。
忍者カウンターを貸りたものの、自分の理解力がないためかカウンターが表示されません…
シンプルのテンプレートで、クリアホワイト左を使っているのすが…
すみませんが、教えて頂けますでしょうか?
 
 
 
お返事遅くなりました (かつを)
2007-07-23 13:10:32
カウンタ設置の件ですが、先程すぐるさんのブログのCSSソースをみさせていただきましたが、「惜しい!」という感じです。
というのも、メニューレイアウト用のセレクタ「#sideBar」に背景画像用のプロパティ「background-何とか」を追加したのは正しそうなのですが、肝心のbackground-imageプロパティの指定に行間区切り記号の「;」が抜けているようです。

【誤(現在)】
#sideBar {
background-image: url("画像のURL")
background-repeat: no-repeat;
(以下略)
 ↓
【正(修正方法)】
#sideBar {
background-image: url("画像のURL");
background-repeat: no-repeat;
(以下略)

単に「background-image:~」の最後に「;」が抜けているだけのようなのですが、ブラウザは「;」がないことで「background-imageの指定が正しくない」とみなすのでしょう。

ということで、CSSを更新後にご自分のブログを再表示(リロード)してみてください。
 
 
 
よくある間違い… (かつを)
2007-07-23 13:37:35
って、「よくある間違い」がよくないんじゃん…。
 
 
 
お忙しいところ、ありがとうございました。 (すぐる)
2007-07-27 23:49:11
遅くなりましたが、わざわCSSソースをチェックして頂きましてありがとうございます。
かつをさんのおかげで、無事にカウンタを付ける事が出来ました。
また遊びに来ますので、宜しくお願いします。
 
 
 
良かったですね (かつを)
2007-07-31 02:02:20
今度はきちんとカウンタが表示されていました、良かったですね。

ということで、今後ともよろしく~。
 
 
 
初めましてで失礼致しました (いくぞー)
2007-07-31 20:16:37
かつをさん、こんばんわ。お世話になっておきながらご挨拶が遅くなってしまいました。

まずは、ご指摘のあった私のブログ記事のURLですが、トラバではなく記事の方に修正いたしました。本当にすみませんでした。
もしやとおもいますが、トラックバックの件ではご迷惑をお掛けしてしまったのでは?今回の事で、自分のトラバについての理解が不十分だった事に気付く事が出来ました。以後気をつけます

そしてカウンター設置の件ですが、こちらの記事を参考にしながらTRYしたら、驚くほど簡単に出来てしまいました♪簡単・明瞭・丁寧な説明に本当に感謝しています。これからも過去の記事を漁りながら勉強させて頂きますので、よろしくお願い致します。
 
 
 
どういたしまして (かつを)
2007-08-04 10:15:47
junk.testカテゴリの記事は「とりあえずやってみた」という記事ばかりなんですが、(うまくいったものは)そのときの手順・手法をできるだけ簡潔に書くようにしているので、それを簡単とか明瞭とか思ってもらえたのであれば、嬉しいですね。
# 丁寧かどうかは(わは)

今後も色々なカスタマイズに挑戦してみてくださいね。
 
 
 
カウンター設置できました!が、スッキリせず(汗 (まめだぬき)
2008-01-02 01:41:34
はじめまして。
こちらのブログを参考にして、なんとかカウンターを設置することが出来ました。
ちゃんと動いているのかは心配ですが・・・^^;

一つ疑問に思ったのですが、
忍者ツールのようなimg srcのカウンターだと表示できるのに、
ブンブンカウンターはsrcだけで、それ以下のURLを入力しても表示されないのは何故なのでしょうか。
自分なりに調べたのですが全く解決できず;
もしよろしかったら教えていただけないでしょうか><;
 
 
 
ブンブンカウンターはJavaScript (かつを)
2008-01-04 14:16:43
コメントありがとうございます。

>こちらのブログを参考にして、なんとかカウンターを設置することが出来ました。
>ちゃんと動いているのかは心配ですが・・・^^;

おめでとうございます。ちゃんと動いているみたいですよ。
あと、疑問の方ですが、ブンブンカウンターはJavaScript形式のみで利用できるので(imgタグで利用できる形式ではないので)、この記事にある方法(CSSで背景画像に指定する方法)では、カウンタ画像を表示することはできません。
ただし、ブンブンカウンター(BlogToyのパーツ)は、gooブログでも「ブログパーツ」として利用できるようです。

● gooブログでのBlogToyの設置方法
http://blogtoy.net/guide/guide14

● gooブログの使い方>ブログパーツ
http://blog.goo.ne.jp/how_to/e/89b470fc570d02bbdcc5c80003546e85

よって、gooブログの記事(エントリ)の一部として、ブンブンカウンターを使うことはできますし、【gooブログアドバンス】の場合はテンプレート編集でブンブンカウンターをブログのメニュー欄やタイトル付近に表示することができるようです。
# 私はアドバンスではない(無料版)なので、ブンブンカウンターをメニュー部分に表示することはできませんが

こんなんで、回答になってますでしょうか?
 
 
 
ご回答ありがとうございます! (まめだぬき)
2008-01-05 02:52:23
丁寧なご回答、そしてブログにも御越しくださりありがとうございます!

忍者ツールで「JavaScriptが使用できない場合は設置することが出来ない」と書いてありつつ設置することが出来たので、もしやと考えてしまいましたがダメなのですね^^;

おかげ様でスッキリすることができました♪
ありがとうございます!!
 
 
 
よろずカウンターを設置したいのですが (Bazz)
2008-01-13 15:37:13
はじめまして。

忍者ツールのカウンターをgooブログの
カスタムブルーに設置したいのですが、うまくいきません。
2006年の12月にも同じような質問と回答があったので、
参照したのですが、うまくいきません(泣)

現在はこうなっています↓

/* ブログのタイトル部下 */
.headerDark {
background-image: url(http://www.wanz.net/counter/counter.cgi?*****
);
background-repeat: no-repeat;
background-position: ;
background-color: #1b467b;
}

↑の
background-image: url(ココ);に何を入れればよいのかわかりません^^;

http://ct#.shinobi.jp/xx/カウンタのID

とありますが、カウンタのIDとはどうやってわかるのでしょうか。

初歩的な質問ですみません。答えてくださると非常に助かります(><)お願いします。
 
 
 
imgタグのsrc属性ですが (かつを)
2008-01-13 16:26:18
url()の()の中には、「カウンタの設置(カウンタ用HTMLソースの貼り方)」にあるimgタグのsrc属性の値を入れることになります。

例)
<img src="http://ct#.shinobi.jp/xx/カウンタのID" border="0" alt="文字列" />

なら

"http://ct#.shinobi.jp/xx/カウンタのID"

の部分です。

ですが、「http://ct#.shinobi.jp/xx/」の部分は、あなたのカウンタ(よろずカウンター)の「カウンタ用HTMLソース」として指定された値を使用してください。
# 最近はshinobi.jpだけではないので、例を全て挙げることはできませんので…

いかがでしょうか?
 
 
 
できました! (Bazz)
2008-01-13 17:05:14
わかりやすい説明ありがとうございます!

なんとか、かつを様のヘルプでよろずカウンターの設置方法がわかりました!

おっしゃるとおりにやってみてプレビューしたらできたので、
あとで、更新しようと思います。

本当に助かりました!ありがとうございますヽ(≧▽≦)/
 
 
 
カウンタ設置できたようですね (かつを)
2008-01-14 22:22:16
設置というか変更ですが、きちんとできたようですね。良かったです。
 
 
 
教えてください。 (トムジェリ)
2008-01-29 21:17:13
はじめまして。
カウンター設置でこちらのブログを教わりたどり着きました。
テンプレートは、シンプルもカスタムも気に入ったものがなく
記事に貼り付けたいと考えています。
現在、あしあとも先の日付にして貼り付けているのですが
それにカウンターを設置することは可能でしょうか?
ご指導、よろしくお願いします。
 
 
 
未来日付の記事でもできます (かつを)
2008-01-30 00:18:48
>現在、あしあとも先の日付にして貼り付けているのですが
>それにカウンターを設置することは可能でしょうか?

できます。
「あしあと」と同じ記事でも違う記事でも、未来の記事でも過去の記事でも、カウンタサイトで「指定されたimgタグ」をそのまま使えばいいのです。
また、scriptタグのタイプの場合でも、「あしあと」と同様にgooブログで許可されたものであれば、「goo ブログパーツに変換」することで、記事の本文欄に貼る事ができます。

ただし、常にブログのトップに表示されるようにしている未来記事であっても、毎回必ず表示される訳ではないので、毎回カウントされる訳ではありません。
というのも、各記事のPermaLink(記事固有のURL)や、日付指定、月指定、カテゴリ指定などでブログを表示してみれば分かりますが、その場合には「あしあと/カウンタ用」の未来記事は表示されませんので。

ということで、それでもよいということであれば、未来記事にカウンタを設置することができます。
こんなんで回答になっていますでしょうか?
 
 
 
初めまして… (みど)
2008-02-13 22:28:52
どちらにコメントをつけようか悩んだのですが、こちらに…

本日は、わざわざ来て頂いた上にコメントまで頂きまして、ありがとうございました。
自分で、理解しきっていないなぁ~と思いながら書いていた記事でしたので、恥ずかしくて…

アドバンスでなくても、ここまでカスタマイズ出来るものなのですね…
びっくりです。
これからも色々と勉強させて下さい。
よろしくお願いします。
 
 
 
どもです (かつを)
2008-02-14 01:27:48
CSSだけでも、そこそこカスタマイズできます。

とはいっても、メニューの項目を追加・変更したりはできないんですよ。
だからやっぱり、アドバンスは魅力ですよね。
 
 
 
教えて下さい (yukki)
2008-03-27 03:08:36
初めまして!カウンターを設置するのにこちらの
おかげで出来たのですが・・・。
なぜかカウンターを設置すると
カレンダー、カテゴリー、ブックマークといった様な
文字が消えてしまうのですが・・・。
全部消えるものと文字の半分が消えるものとあります!
カウンターを外してみると文字は又復活して
現れるのですが・・・。
これはどういう事かわかりますか?すみませんが
教えていただけると助かります。
 
 
 
ありがとうございました! (yukki)
2008-04-02 00:32:45
ず~っと悩んでいたので教えて頂きありがとうございました!
カウンターのせいではないと知らずに何時間も
格闘してしまいました!
↑皆さんかつをさんのお陰で随分助かって感謝してますね!
人に感謝される事ってすごい事だと思います!!
 
 
 
Unknown (ターちゃん)
2008-07-16 19:46:08

おかげさまで、GOOブログ(無料版)カスタムブルーに
カウンターは設置できました。
ところが、123456789の画像のみで、まるでカウンターとして機能しません。

命を吹き込むには、どのようにすればいいのでしょうか?。
 
 
 
現在の値が「サンプル画像URL」でした (かつを)
2008-07-17 01:12:37
CSSを拝見したところ、

/* 左メニュー背景 */
#menu {
 :
background-image:
url("http://ct2.shinobi.jp/ctr/0001625.png");

となっていました。
この「http://ct2.shinobi.jp/ctr/0001625.png」はカウンタのサンプル画像URLですので、いつまでたっても「0123456789」から変化しません。

ここには、「http://ct#.shinobi.jp/xx/カウンタのID」のような形式の、あなたの「カウンタ用HTMLソース」として指定された値を使用してください。
 
 
 
カスタムブルーでは「.headerDark」の方がいいかも (かつを)
2008-07-17 01:33:39
あと、お使いのテンプレートはカスタムブルーのようなので、カウンタを背景画像に指定するセレクタは、「#menu」(左メニュー背景)よりも「.headerDark」(ブログのタイトル部下)の方がよいかも知れません。

というのも、カスタムブルーのHTMLテンプレートには、何故か「id="menu"」の属性が2箇所に付加されているので、「#menu」のセレクタの背景画像にカウンタを指定するとカウンタが2箇所表示されてしまうのです。

「2006-12-17 12:48:29」のコメントにも同じことを書いていますが、「.headerDark」にカウンタを指定する例は、以下の通りです。

/* ブログのタイトル部下 */
.headerDark {
 background-image: url(カウンタ画像のURL);
 background-repeat: no-repeat;
 background-position: left center; /* 左端・上下の中央 */
 background-color: #008000;
}

なおbackground-positionに指定する値は、10px center (左から10ピクセル・上下の中央)などでも構いません。
 
 
 
もう一度お願いします (ターちゃん)
2008-07-17 17:27:14
かつおさん ありがとうございます。
ところで大変申し訳ないのですが、

、「http://ct#.shinobi.jp/xx/カウンタのID」のような形式の、あなたの「カウンタ用HTMLソース」として指定された値を使用する、

と指導していただきましたが、そのやり方がわかりません。
本当の初心者で恥ずかしいのですが、ぜひ教えてください。お願いいたします。
 
 
 
[管理ページ]の[HTMLソース]です (かつを)
2008-07-17 21:34:31
お返事ありがとうございました。

忍者カウンター(よろづカウンター)の「管理ページ」にある「HTMLソース表示」で表示されるタグの一部を使います。
どこを使うかというと、

● 【指定されたimgタグの例】
http://blog.goo.ne.jp/mid_knight/e/1487946c3a37cb1874e3800650b006b4#your_counter_url

にあるように、表示されたHTMLソースのうち、~ <img src="http://カウンタのドメイン/xx/カウンタのID" border="0" alt="カウンター" /> ~ の"http://カウンタのドメイン/xx/カウンタのID"の部分だけを指定します。
# httpより後ろの部分はあくまで例であり、利用者毎に異なる値になります

勿論、忍者カウンターの「管理ページ」にログインするためには忍者カウンターへの利用者登録が必要ですし、「HTMLソース表示」する前にお好みの内容に「カウンター設定」する必要があります。
詳細は、カウンター提供サイトのヘルプを参照願います。

● 忍者カウンターヘルプ
http://www.ninja.co.jp/help/counter2/

残念ながら私が(ちょっと)アドバイスできるのは、【カウンタ設定まで完了】した後にそれをどうやって(無理やり)gooブログに使えるかなぁという点だけで、実はカウンタ設定の詳細に詳しくはありません。
いかがでしょうか?
 
 
 
ありがとうございました。 (ターちゃん)
2008-07-18 14:22:32
かつをさん ありがとうございました。
何度か挑戦した結果、

background-image:
url("http://ct2.ushimairi.com/ll/1116733" border="0" alt="カウンター" );

と入力したら、やっとカウンターを設置することができました。

また何かわらないことがあったら、質問させてください。本当に感謝申し上げます。。
 
 
 
そ、それ駄目です… (かつを)
2008-07-19 00:25:08
記事の「よくある間違い」にある通り、それは駄目なパターンです。

background-image:
url("http://ct2.ushimairi.com/ll/1116733" border="0" alt="カウンター" );

ごく一部のブラウザで偶然カウンタが表示されることも無い訳ではありませんが、この指定は誤りです。
正しくは、

background-image:
url("http://ct2.ushimairi.com/ll/1116733");

でなければいけません。
# 「border="0" alt="カウンター"」の部分が、余分です(あってはいけません)
 
 
 
重ねてありがとうございました (ターちゃん)
2008-07-19 10:06:15
かつをさん、重ね重ね 迷惑をおかけしました。偶然とはいいながら表示されたので、良かれと思っていました。
よく見れば、最初の説明で丁寧に書いてくださっていたのですね。

今後ともご指導方よろしくお願いします。
 
コメントを投稿する
 
コメントをするにはログインが必要になります

ログイン   gooIDを取得する
 
この記事のトラックバック Ping-URL
 
 
・このブログへのリンクがない記事からのトラックバックは受け取らないよう設定されております
※ブログ管理者のみ、編集画面で設定の変更が可能です。
 
 
RSSTIMESの設定 (中島かつをの『子供、いらない』)
ブログパーツRSSTIMESの設定サンプルです。 # RSSTIMESって何って方は、先ず「RSSTIMESを設置してみる」をご覧ください 1. RSSTIMESのページにアクセス gorou.zapto.orgのRSSTIMESページを開く。 2. RSSのURLの入力 「RSSのURL、一月ごとに表示
 
 
 
カウンタが付けれるかも? (箱入り鉄道むすめ)
 Javaが使えないgooブログなのでカウンタをあきらめていたんだけど、その後色々情報を集めた所、カウンタが付けられるかもという希望が。 「中島かつをの『子供、いらない』」さんのWebサイトで、色々とgooブログを作る上での裏技を紹介して下さっていた。  その中にカウ
 
 
 
少し変更っと (街中の写真館 -windows photo-)
web拍手とカウンタを設置してかれこれ2週間ほど経過したのかな。 web拍手では、コメントをくれる方がいて、設置してみてよかったなぁと思うところです。 しかしながら、カウンタが…。 一応まわっているんですが、どうにも反応するときとしないときがあるようで。 gooの
 
 
 
試行錯誤 (さくら日和)
gooブログにはカウンターがない。 だから背景画像として無理やり貼り付けるしかない。 頑張ってやったんだけどなぜか2重になる…。 直し方が分からないから、まあこれでいっかと。 参考にさせて頂いたのは中島かつをさんの 『子供、いらない』というブログの、 「メニュ
 
 
 
gooブログにカウンター設置 (かなやん、されるがまま)
gooブログにカウンターは設置できないのかと思いきや、ありました もう感謝感謝です 子供、いらない:メニュー上部にカウンタ設置 どんどん数値が増えていくといいなぁ~なんて
 
 
 
カウンターをつけてみた。 (忘れっぽいので・・・覚え書き。)
gooブログでもアクセスカウンターが表示出来ると判ったので、 CSS編集の練習も兼ねてつけてみた。 場所はメニューの所のTOP。そんなにアクセスは無いけど、 あればあったで楽しいかな、と思って^^ 中島かつをの『子供、いらない』blog内のメニュー上部にカウンタ ...
 
 
 
キリバンはやらないけど・・・・ (とりあえず日記帳)
なんとかカウンターの設置に成功しました。 こんなに面倒くさいなんたぁ、思わなかった。 有料版ならもっと楽にできるらしいが、それでもほかの所に比べたら融通が利かない。無料版でも楽に色々できる所もあるし。 皆さん、ブログ選びは慎重にね♪ 本当の目的はカウンタ...
 
 
 
カウンタGET! (ひるいく?)
ブログにカウンターを設置してみました。 CSSのお勉強ですね。 中島かつをさんの『子供、いらない』というブログの、 「メニュー上部にカウンタ設置」という記事を参考にさせていただきました。 ありがとうございます。 カウンタレンタルは、"NINJA TOOLS"を利用させ...
 
 
 
gooブログにアクセス・カウンターを設置する (武和真利の社会ブログ)
gooブログにはアクセス・カウンターがついていません。サイドバーのメニューに「アクセス状況」というものがありますが、これは昨日までの統計であり、現在の状況を表しているわけではありません。 もちろん、それだけでも悪くはありません。なぜ今日現在の状況を把握す....