ココログバージョンアップに伴う修正&新カスタマイズ
ココログのバージョンアップ(TypePad 1.5対応)に伴って、従来のスタイルシート(CSS)やスクリプト(JavaScript)のままだといくつかの不具合が生じるようです。今回ココログの再設定をして再構築したら、デザインやカスタマイズが全体的に激しく狂う状態になってしまいました(苦笑)。
そこで、ココログのバージョンアップ対策のために行った修正事項を列挙しておきます。もし表示上の不具合が見られた場合は、コメント等で教えてください!
○ココログバージョンアップ対策の修正事項現象1: 上部のバナー画像が完全に消えてしまう。
原因: ソース中のバナー部分にあたるIDとクラス等の構成が変更されたため、従来の自作スタイルシートで対応しきれなくなった。
対策: 自作スタイルシートを新構成に対応させるように修正した。また、それだけではバナー画像が表示されるだけで、トップページへのリンクが無効になるので、暫定対処としてJavaScriptでリンクを反映させた。また後日、見直しを行う予定。
→ココログプラス・プロのデフォルトのスタイルシートファイル「styles.css」を参考にして(私はココログベーシック)、自作スタイルシートを修正したところ、元通りになりました! 暫定対処のスクリプトも必要無くなり、大満足! っていうか、それが通常?
一言コメント: これが一番ヤバかった~(苦笑)。トップ部分が無いblogの姿って、情けないよ~。これだけは最優先で修正作業を行いました。現象2: 記事に対するコメントが複数ある場合、各コメントの下部にフッタ装飾(アフィリエイト広告・告知等)が入る。
原因: コメント投稿者名の横に“|”の記号が入るようになったため、それを識別してフッタ装飾をする自作スクリプトが誤動作を起こしていた。以前は、記事本文の直後のみに記号があったので、そこだけフッタ装飾されていた。
対策: スクリプトに識別させる記号を“|”から“in”に変更した(記事本文の直後にあるユニークな識別語)。
一言コメント: とりあえず、記事本文直後の通常フッタ部分が正しく識別できればOK!現象3: フッタ装飾によるアフィリエイト広告文の行間隔が広くなり過ぎている。
原因: デフォルトのスタイルシートファイル「styles.css」で「span」タグの定義が新規追加されており、「line-height: 150%」に設定されていた(1.5倍の行間隔になった)。以前は定義が無かったため、通常表示だった。
対策: 自作スクリプトに「span」の定義を追加し、「line-height: 110%」で行間隔の定義を上書き反映させた(1.1倍の行間隔)。
一言コメント: 他にも「image」タグ関連でいくつか追加されていますが、影響して困る人は少ないと思われます。
また、修正と共に行ったカスタマイズ変更も列挙しておきます。同じく、表示上の不具合が見られた場合は、コメント等で教えてください!
○バージョンアップ対策ついでに行った新カスタマイズ・コメントリストツリー化の記事タイトル強調(色・太字)
他所様の作成したスクリプトに修正を加えました。作者が修正を許可しています。
またカテゴリリスト等で、スクリプトでのアイデアを流用してツリー化しています。
・記事に対するコメントとトラックバックに折りたたみスイッチボタンを設置
他所様の作成した折りたたみスクリプトを一部変更。
他所様の作成したスクリプトに修正を加えました。作者が修正を許可しています。
[上記スクリプトの作者の方々には、近いうちに感謝の意をお伝えしたいと思います(その際にはこの部分に追記します)]
・コメント注意告知とトラックアック注意告知のスクリプト正式設置&見直し
告知文は随時変更しようと思います。
・リンク部分のマウスオーバー時の色強調
白色の背景色強調を加えました。
・コメント投稿フォームのカラーリング
フォント指定も一部行っています。逆に見栄えが悪いようならやめます。
・記事部分のフォントは「MS UI ゴシック」系を優先。
サイドバーのフォントは「Verdana」系を優先。
いずれもWindowsを意識したものですが、Macを考慮して「Osaka」系の定義も取り込みました。
何をどうやったか気になる方も、コメント欄で気軽に質問してくださいね。ちょっと新しい「あずスタ」をどうぞよろしくお願いします!
| 固定リンク
この記事へのコメントは終了しました。
コメント