« お盆休みモード | トップページ | データは何処に?? »

2006年8月12日

夏休み企画:ココログのカスタマイズその1

夏休み企画として、ココログをカスタマイズ方法を書いてみたいと思います。

ココログプロの場合、ホームページの骨格になる、HTML と見た目をコントールする、スタイルシート(CSS)は自由にカスタマイズが出来ます。今回は、ココログフリーを始め、ベーシック・プラズでの方法をご紹介いたします。

まず、理解して欲しいのは、ココログで見え方に関する部分は全て、スタイルシートにて指示されています。
見え方の部分とは、文字の色、文字の大きさ、フォント(字体)の指定から、背景(バックグランド)の色等、全てに及んでおり、スタイルシートをカスタマイズする事で、見え方をカスタマイズ出来ます。

スタイルシートだけでは、3カラム(3段組)を2カラム(2段組)に変更するような、骨格に関するレイアウトのカスタマイズは行えません。骨格に関するレイアウトは HTML もカスタマイズも必要になります。今回の説明では対象外になります。

ちなみに、ココログは春のバージョンアップで、プロ以外でもスタイルシートのカスタマズが出来るようになりました。
スタイルシートのカスタマイズは、

管理ページトップ > ブログ一覧 > 各人のブロブ名 > デザイン > カスタムCSSを編集

で、テキストボックが現れます。
テキストボックス内に、スタイルシートを記述する事で、スタイルシートが反映されます。

と、書いても何をどのように書けば良いのでしょうか正直な所、判らないと思います。
まずは、実際に今利用している、ココログのスタイルシートを確認してみたいと思います。

ココログのスタイルシートを確認するには、ココログのソースを見て、スタイルシートの在処を確認する事が必要です。
ココログを開いてソースを開いて確認します。ソースを開いて確認するには、Windows の IE で有れば、メニューの「表示」「ソース」から確認することが出来ます。

ソースを開いてみると、良く判らない文字列が出てきますが、

と言う、行を探してみてください。
"stylesheet"を検索して見ても良いと思います。10行目位までにあると思います。
上記の記述は、manabiBlog のスタイルシートを所存を示しており、

http://maru.cocolog-nifty.com/manabi/styles.css

の部分がスタイルシートの、所在(アドレス)を示しています。

上記のアドレスをブラウザで開いて見てください。
Windows の環境だと、ファイルのダウンロードが始まるかもしれません。その場合はファイルをダウンロードして見てください。
ダウンロードしたファイルは「メモ帳」(Notepad)もしくは「ワードパット」で、中身を確認する事が出来ます。
動作を確認した所「メモ帳」(Notepad)では、改行がおかしくなるみたいで、「ワードパット」なら問題無く開く事が出来ました。

スタイルシート開いて見てみると、また何だか良く判らない文字列の記述が表記されていますが、この文字列で、HTML ファイルの見え方をコントロールしていると理解してください。

まず、ココログの見え方をカスタマイズするには、スタイルシートと言う物をカスタマイズをするんだと理解して頂ければ、ココログのカスタマイズその1は終了です。

参考資料
ココログに限らず、ホームページ全般を制作したり、カスタマイズするには「メモ帳」が重宝しますが、今回のココログのスタイルシートは、「メモ帳」でちゃんと開く事が出来ませんでした。
出来る事であれば別途「メモ帳」より、高機能なエディターを入手しておくと便利だと思います。お勧めのエディターは Windows 環境で有れば【TeraPad】がお勧めです。

【TreaPad】に関して下記のサイトを参考にしてください。
ベクターソフトニュース - TeraPad
テキストエディタ「TeraPad」を使いこなそう!
TeraPad-FAQ
作者のホームページ

Windows 環境の方で、ホームページ、ブログの制作、カスタマイズを考える方は是非とも、入手しておいた方が便利だと思います。

Macintosh の環境で有れば、【mi】が便利です。
作者のホームページ

【TreaPad】、【mi】はフリーで提供されているツールです。作者の方に感謝します。

|

« お盆休みモード | トップページ | データは何処に?? »

「ウェブログ・ココログ関連」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/6981/11403607

この記事へのトラックバック一覧です: 夏休み企画:ココログのカスタマイズその1:

« お盆休みモード | トップページ | データは何処に?? »