マキバ号のブログ一覧

またまたスタイルシートの弄りです(^o^)/
愛車紹介のヘッダー画像にアクセスカウンターを設置する方法を詳しく載せますね(^o^)/
例によって自己責任でお願い致します。

下のURLをタップして
まず忍者ツールズから無料のカウンターをゲット

http://www.ninja.co.jp




パソコンとスマホでは画面が違いますが
新規ユーザー登録をタップ




こちらはパソコン画面
登録するアドレスを打ち込んで
送信(^o^)/

するとアドレスにメールが届くので
内容通りに登録を進めます
ここが一番注意が必要ですが
いつも登録者がブラウザで見るスマホ又はタブレット パソコンから登録してください
いつもスマホで見るのにパソコンで登録してしまうと、カウンターがパソコンではカウントされませんが、スマホではカウントされてしまいます。

以下登録完了後の設定になります




登録するとブログやホームページ アクセス解析など利用出来るようになります。
今回は無料の忍者カウンターを選択してください。
すると上の画面になるので、みんカラと同じ名前でもいいので打ち込み
他2つも記入
作成ボタンをタップ

これでカウンターが利用出来るようになりました(^o^)/
もう少し頑張ってくださいね〜

忍者カウンター管理ページを出して




ここを自分の好みでカスタマイズします
わからない方は同じに設定すれば間違いないです(^o^)
カウンター画像の選択は次の設定画面から好きな画像を選んでください
種類も豊富で大きさも色々なので探すのが楽しいですよ〜




共有イメージ検索から好きなカウンターの画像を登録してください
そのままだと手裏剣のカウンターのまま表示されます




以上設定が終わりましたら
HTMLソース表示を選択してください。
ソースが上下2つありますね
私は下をコピーしました
ボタンを押してもiPadではコピーできなかったので
ソースをタップして全て選択からコピーしました

コピーしたらメモ帳にペースト




画像はコピーしたものですが
'' ''内の赤いURL部分が必要な部分です
青ではダメです
下のURL部分と比べて数字以外が同じなら
下の3行のプログラムをコピーして使用しても構いません
#######の部分は後で画像の数字と入れ替えればいいです
この数字が違うと他人のカウンターになってしまうので注意が必要です

background-image:url("http://ct2.shinobi.jp/ll/#######");
background-position:815px 12px;
background-repeat:no-repeat;


今度はスタイルシートを弄ります
ここまで出来れば簡単です




マイページからスタイルシート→詳細設定を選択して
下にスクロール




ヘッダータイトルの一番下に3行のプログラムを貼り付けます
赤い枠の部分ですね。前からあるプログラムは消さないでください。
後は数字を#######の部分に打ち込みます
後は保存をタップして完了(^o^)/

あっまだありました(^_^;)
画像の緑の線に注目



この数字を変えるとカウンターの位置を調節できます。2つとも0
にすると左上の赤い部分にカウンターが表示されます。
後はこのみで各自微調整してください
お疲れ様でした(^o^)/

忘れてましたが簡易編集でヘッダー画像や色などを変更して保存すると3行のプログラムが消えます(⌒-⌒; )
3行のプログラムはどこかにメモしておきましょう(^o^)/

次回はフラグカウンターの設置とメンテナンスを載せます