MovableType: 2009年2月アーカイブ: 25時の追跡

　一連のカスタマイズに伴いトップバナーも変えることに、またブログタイトルを画像にしたくて色々試行錯誤しました。参考にしたのは上記サイト。本当はブログタイトルを画像にしてもブログへのリンクは残したかったのですが、上手くいきませんでした。

#header {
    padding: 15px;
    border-bottom: 1px solid #669;
    color: #999;
    background: #8fabbe;
    text-align: left;
}
#header a,
#header a:link,
#header a:visited {
    color: #fff;
    background: transparent;
    font-size: 32px;
    text-decoration: none;
}
#header a:hover {}
#header a:active {}
#header { 
    background: url("http://www.x.com/x/x.jpg") no-repeat top left;

　小粋空間テンプレートのCSSを以上のように修正、テキストファイルの上にタイトル画像がきて、テキストファイルが隠れ、一見テキストファイルへのリンクはあたかも画像にリンクされたように見え、上手く成功したように見えます。　しかしIEでブログ画面を開き、画面をスクロールすると、トップバナーの真ん中付近、ちょうどタイトルと同じ高さの白い線が入ってしまいます。　画面をリロードするとその白い線は直るのですが、またスクロールすると同じ結果。　

　テキストとタイトル画像の重なりの影響でしょうが、色々検索してみても解決策が見つかりません、従い小粋空間さんのアドバイスを仰ぐことに。

#header {
    padding: 15px;
    border-bottom: 1px solid #669;
    color: #999;
    background: #8fabbe;
    text-align: left;
    height:100%;
    text-indent:-9999px;

　小粋空間さんのアドバイスに従い、以上のようにheightとtext-indentを追加、これで画像へのリンクはなくなりましたが、例の白い線は解決しました。　さらに色々検索してみるとtext-indent:-9999pxは避けるべきというような記事もありますが、当方にとってはなにが問題か理解不能、とりあえずこれで様子を見てさらに勉強したいと思います。

小粋空間さんのテンプレートに戻す

　MT4.2導入後、デフォルトテンプレートを使っていましたが、再度小粋空間さんのテンプレートに戻してみました。もちろん前回もトライしたのですが上手くいかなかった。　それはアーカイブページがすべてリンク切れになってしまうのです、それ以降、ずっと悩んでいたけど、デフォルトテンプレートだとその問題は発生しないし、再構築時間も短いので、仕方なく使ってたわけです。

　今回再トライしようと再度小粋空間さんのマニュアルを見ながら、導入、そして再構築、やはり結果は同じ、アーカイブページは表示されません。　再度ネットで検索しながら悩むこと1時間、理由がわかりました。

　PHP化している場合は、ヘッダーの一行目のXML宣言を削除しなければならないのです。

<?xml version="1.0" encoding="<$MTPublishCharset$>"?>

　もっとも大事なことを忘れていた、恥ずかしながらようやく解決。　

　それと最低限のカスタマイズ、それはページ分割です、これも小粋空間さんのページに書かれていたPageButeを使うことにしました。

　小粋空間：PageBute プラグインによるページ分割

　それとブログタイトルも変えました、こっそりと。　理由はわかる人はわかる、それで良い。

25時の追跡

トップバナーを画像に

小粋空間さんのテンプレートに戻す