カテゴリー: ブログカスタマイズ

今や検索エンジンとしてその名を知らない人の居なくなった Googleは技術力を以て知られもする処です。 なんとなれば検索エンジンを全世界のWebサイトに適用しようと思えば 途轍もないコンピュータパワーを必要とするからで それを制御し得ていることで技術者から注目される存在であるのです。

そのGoogleの凄まじいとも言えるコンピュータ資源は一般にも多く開放されており、 その一つが今回自己管理化にあるWebサイトの登録方法を紹介する Webマスターツール となります。 登録すればGoogleに蓄積された様々なデータが閲覧可能となり 以前本ブログに紹介したようなブログシステムの不具合なども知って対応が可能にもなります。

• Webマスターツールの新機能インデックスステータスを使って見た（2012年9月15日）
• Webマスターツールでブログシステムの404エラーを補正する（2012年9月30日）
• はまぞうの吐き出す404エラーが洒落にならない数字になっている（2012年11月17日）

Webマスターツールに登録するサイト

Webマスターツールには自らが管理しているホームページやブログしか登録出来ません。 Webマスターツールと言うのはGoogleが検索エンジンを運営するに当たって 収集したデータの内、その管理するホームページに関する部分だけ垣間見せてくれるツールです。 他人のホームページのデータが見えてしまってはプライバシーの問題もありますし、 登録したホームページに関してはクローリングボット（検索エンジンデータ収集プログラム）の調整も可能ですから 悪用される可能性がないとも言えず実に都合が悪いからです。

今回は本ブログ運営者が本ブログとは別に 前世紀1999年から運営しているサイトをWebマスターツールにずっと登録しないままでいましたので、 そのサイト うさ犬ランド を登録試験に供したいと思います。

サイトを追加ボタンのクリックから開始

WebマスターツールはGoogleアカウントを所有していれば誰でも利用可能です。 Webマスターツール にアクセスして赤い なるボタンをクリックすれば下の図の様な画面に遷移するでしょう。

ブログにソーシャルボタンを表示するのは当たり前になりました。 勿論本ブログにもソーシャルボタンを備え付けています。

備え付けているソーシャルボタン

本ブログに備え付けたるソーシャルボタンは以下。

• Twitter ツイートボタン
• Facebook いいねボタン
• Google+ Plus One ボタン
• はてなブックマーク ボタン

これらは全て提供元が別ですからサイズがバラバラで ブログに表示するとみっともないことになってしまいます。

普段ホームページの指導などを余所様にするときに 成るべく見る人のことを考えれば 文字（フォント）のサイズは切り替えられる方が好いですね、 などと言いながら紺屋の白袴、 己のブログにはその機能を今だ設置しておりませんでしたので 今回本ブログにも文字サイズを見る人の都合に依って 切り替えられるようにカスタマイズしてみました。

文字サイズ切替機能の現物確認

論より証拠、百聞は一見に如かずとも申します。 既に文字サイズ切り替え機能は実現していますので、 先ずは実際にどのような動きをするか試して貰った方が早いでしょう。 但し、お手持ちの環境に依っては想定通りの動きをしない場合もありますので あらかじめご了承下さい。

さて大変申し訳ないながらフォントサイズの切り替え用のボタンは 取敢えずのレイアウトの都合上今回は本ブログは左サイドメニューのず…っと下の方、 HP作成浜松Tips と RSSリーダー登録 の間に 文字サイズ切替 と銘打って配置してあります。 右の図と同様のものが其処には配置されており、 それが今回設置した 文字（フォント）サイズ切替機能ボタン、大、中、小の3種になります。 孰れまたレイアウトの変更の際には ユーザービリティ上、画面上部に持って行く積りではいますが、 今はブログに設置を試みた、と言うことでこの不都合な位置になっています。

標準が小さ過ぎたWeb業界のフォントサイズ

ボタンを見付けられた方は…

ホームページを開いたときに ホームページアドレスの左に小さな画像が表示されていることがあります。 これは Favicon（ファビコン） と呼ばれるものでFavorite icon（フェイバリット・アイコン）、即ち お気に入りのアイコンと言う意味の英語を略したものだと言われます。

本ブログのファビコン

勿論ホームページだけでなくブログでも設置可能です。 本ブログでもマスコットキャラクターのはなまる君を ファビコンに仕立て上げてみました。 右上の図がブラウザのIE（インターネットエクスプローラー）で 本ブログを開いたときに見られるはなまる君ファビコンです。

ファビコン用の画像を用意する

本記事ではこのはなまる君ファビコンの作り方と設置方法を記します。 先ずは画像を用意します。 この時用意する画像は…

本ブログは2010年9月10日に投稿した記事 はまぞうTop200ブログランキング推移表 とともに開始され爾来約1年と半年、20万ページもの閲覧をいただきました。 まことにありがたく思っています。

本ブログ立上げ当初の趣意

しかし不易流行とはよく言ったもの、立ち上げ時の思惑とは少々形態が異なってきました。 9月10日の最初のに見られるように当初は HamaZoブログシステムに於いてランキングが当日のものしか見られないため、 それをデータベースに登録していつでもランキングに興味のある方にご覧いただけるようなシステム HamaZoランクチェック！ を開発し、その使い方を解説するために開設したのでした。 そのため本ブログのタイトルも HamaZoランクチェック！Blog としたのでした。

実は開設より暫く経て、 本ブログの立上げ趣意を記事にせんものとして下書きのままに放置していた稿が眠っています。 寝た子を起こす真似をすれば以下が当該文章になります。

時々初心者を抜けて中級者になろうとするぐらいのブロガーさんから ブログに書けない文字を書きたい時にはどうすれば良いの？と質問を受けます。 例えば > や < がそうですね。 ブログはホームページと同じ理屈でパソコン画面上に表示を行います。 その時のルールを HTML と言い、 > や < は重要な役割を果たす為に、 ブログで文字として入力した積もりでも表示される時には 文字として扱われないので表示されなくなってしまうのですね。 剰え意図せぬルールが適用されて表示が崩れてしまいます。

処が本記事ではご覧の通り、ちゃんと表示されています。 これを実行するには…

ブログで記事を投稿し続けていれば記事数も段々と増え、 記事の少ない頃に設定したカテゴリーが適当ではなくなってくるケースも少なくないのは ベテランブロガーと謂わずとも経験されているのではないでしょうか？ 本ブログ運営者もこの処総記事数が増え、 例えば取敢えず その他 にカテゴリー分けしておいた記事が或る別カテゴリーとして纏まりを見せ始めるにつけ、 別カテゴリーを立てて該当する記事を移動したいと思っていました。 処が上手い方法を知らないと、 いちいち変更しようと思う記事を編集するようにしてからカテゴリーを再設定して再投稿することを 総ての該当する記事に於いて実行しなければいけません。 いくらなんでもちょっとこの作業は滅入ってしまいます。

そんなことを思っていた処、 浜松西部ブログ村 でビンゴ！の質問と解説がありました。 余りにも便利な割りに知られてないと思われるこの機能、 今回は特別、教えちゃいましょう！ ブログ村に出掛けてもいないのに知ることが出来るとてもお得な記事となっております（笑）。

その方法とは…

本ブログ運営者は本ブログの他に うさ犬ランド と称すオリジナルキャラクターによるホームページを運営しています。 本ブログにも漸次アクセスされる方も増えてきましたので 出来ることならオリジナルキャラクターサイトの存在も知って貰うが吉と、 自前のサイト向けに自前のバナーで謂わば広告を設置することにしました。 設置場所としては2011年7月3日に ブログからFacebook Comments機能を取り外す ことをしたその後釜に据えています。 この位置に大きくカラフルなイラストバナーを配置することで 記事の独立性の認識の向上が図られるとも考えています。

設置するにあたり手法は javascript を採用しています。 バナーデザインとしては右上図にあるように横長のものを5タイプ用意していて、 表示の度に無作為にプログラムにひとつ選択させて、 見る方の目を飽きさせないように配慮しました。 またリンク先はただ一つではなく 季節をテーマとしたオリジナルキャラクターの特に 夏のページ55頁に対して、これもまたプログラムにランダムに一つ選択させて リンクを繋げるようにしています。 従って55×5＝275種類のリンクが用意されることになります。 静的にこれだけのリンクを用意するのは容易ではありませんから 矢張り此処は動的にリンクを処理出来る javascript の登場となった訳です。 またリンク先のちょっとした確認が出来るように リンクには title属性 を設定してありますので、オンマウスでリンク先頁のタイトルが表示されるようになっています。

ブロガーさんなら分かって貰えると思いますが 毎度のブログ記事の投稿は結構大変なものですよね。 頑張って更新をしている自ブログですから 他の運営サイトを其処で紹介出来るというのも ブログ継続のちょっとしたモチベーションになるのではなるのではないかと思います。

はまぞう（HamaZo）ブログに於いては記事投稿画面で 追記 リンクをクリックして表示される文字入力画面に入力することで、 トップページには表示されないでいて個別ページは表示される内容を記すことが出来ます。 トップページでは記事の一覧性を良くして、 もう少し読みたい時には 「続きを読む」 リンクをクリックして貰うことで更に詳細を表示出来るメリットがあります。

追記については様々意見があり、 記事は短くしてなるべく使用するべきではない、などと言う意見も聞かれます。 姉妹ブログ ホームページ作成浜松Tips （※） では追記を利用することも多く、その為本ブログ2011年4月14日には 追記のある時「続きを読む」リンクのデザインを目立たせるCSS なる記事で問題に対応した旨、記しました。 その記事中に於いては以下引用

本ブログには基本的には 追記 しませんのでブログ記事に 続きを読む が表示されることはありません。

で記し、基本的には追記をなるべく使用せずに済まそうと思っているのですが、 漸次総記事数が増えるに連れ、時には記事が長くなり使わざるを得ない場合も増えてきました。 普段は使わない追記が時に現れるとなるとその判別性が悪ければ 頻繁に利用するブログに於いてより問題は深刻です。 其処で本ブログにも「続きを読む」リンクを目立たせるべくCSSの記述を追加しました。