« 西亭新九郎(by唐沢商会) | トップページ | 改行の反映とタグの追加 »

2004.02.17

ココログのスタイルシートに独自定義を追加(notスタイルシート置き換え)

ココログの「無地」というスタイルはシンプルでそれなりに気に入っているのだけれど、タイトルが埋もれてしまうため、一日にちょこまかと追加するタイプの書き込みにはちょっと向いていない。
※どう埋もれているかというと、フォントサイズがmediumで、色が#666666。

せめてタイトルの文字サイズをちょこっと大きくできないだろうか。それだけでいいのだけれど…。

ココログのスタイルシートは既にみなさん試行錯誤を繰り返し、結果を公開してくださっている。ありがたや。

ということで、Googleで検索(検索ワード:ココログ スタイルシート 変更)してすぐに出てきたtsupo氏の観測気球: 独自スタイルシート適用 -- RSS valid にするための変更およびトラックバックにあったjuan氏のJuanlog: スタイルシート その2を見ながら、(1)CSSの作成 (2)JavaScriptの作成 (3)JavaScriptの埋め込み を行う。ただし、私は、できればデザインをNIFTYまかせにしたいので、CSSを置き換えるのではなく、“CSSの定義を追加”という方針にする(せっかくカスケードできるんだからほら)。

追加したいCSSは以下(cocolog.css

/*タイトル*/
.content h3 {
color: black;
background: #E0E0E0;
font-size: large;
}

/*フッター*/
.content p.posted {
text-align: right;
}

CSS追加用のJavaScriptは以下。
(まずjuan氏のサンプルソースを使って試して、それから書き換えました。痕跡が変数名に残っています)

//追加定義を書いたCSSファイルのURL
myStyleHref = "http://…/….css";

//linkエレメント生成
link = document.createElement("link");
link.setAttribute("rel","stylesheet");
link.setAttribute("href",myStyleHref);
link.setAttribute("type","text/css");

//headの一番最後にlinkエレメントを追加
head = document.getElementsByTagName('head').item(0);
head.appendChild(link);

そして、tsupo氏のページを参考に、マイリストに埋め込んだのが以下。

<script type="text/javascript" src="http://…/….js"></script>
※使用するリストタイプや埋め込む位置によって他のタグを補う必要があり。tsupo氏の場合は</a>と<a>を補っている。


何かの参考になれば幸いです。

|

« 西亭新九郎(by唐沢商会) | トップページ | 改行の反映とタグの追加 »

XML,XSLT,XSD,HTML,CSS」カテゴリの記事

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

トラックバック

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

この記事へのトラックバック一覧です: ココログのスタイルシートに独自定義を追加(notスタイルシート置き換え):

« 西亭新九郎(by唐沢商会) | トップページ | 改行の反映とタグの追加 »