どうも、森です。
四苦八苦の末、ブログ工事を一区切りさせましたのでご報告です。
ひとまず作業終了しました
2月4日の工事のお知らせから1週間。
課題対応については赤字で追記しました。
また、その他変更等は最後に追記しました。
「いつかやろう」と思っていたブログデザイン改装。
こういった分野にはひときわ疎いもので、難航しています。
本番環境でいきなりいじっているので、たぶん今日の夜に見た方はコロコロとデザインが変わっていると思います。数日かかる予定ですので、その間不便をおかけします。
何卒ご容赦ください。
主な変更点
「はてなブログ」はテーマからベースのデザインを選んで設定します。初期設定が楽な反面、突き詰めていけばワードプレスに自由度は劣ります。
今回の改装希望は下記のとおり。
- 記事の見出しをカード型に
- ワンカラムデザイン継続（PCで見たときもサイドバーを表示しない）
- 背景色を引き続きチェレステに近い形で継続
下記の旧デザインを見るとわかりますが、記事の見出しがカード型ではないせいで全体が冗長。改装が必須でした。
とはいえ、私自身は余白を贅沢に使いたい派で、この余白にノペーッとチェレステ色が刺さるようなレイアウトを極力替えたくない。
そこで、今回はテーマを選ぶにあたり条件を満たせそうな「ZENO-TEAL」と「Thumbnail 」に候補を絞りました。
今のところはThumbnailで設定していますが、もしかすると変更するかもしれません。
【以下追記】
全体的な見た目、カスタムにあたってのサポートが充実していることからZENO-TEALも試しましたが思ったとおりにカスタムできず断念しました。
現在判明している問題点
2月3日時点で判明している問題点を書き出していきます。
記事の背景色がおかしい
できるだけデザインCSSは引き継いでいたのですが、背景色のデフォが白でしたので別個指定したところ、記事の背景色まで同化。
これ、記事本文の部分と背景が同一だった場合は再度テーマから選び直しです。
【追記】
背景色問題は一応解決しました。
ヘッダー画像がおかしい
たぶん、スマホで見る分にはジャストだと思います。
ただ、PCで見たときの大きさが問題です。
この状態なら問題ないのですが、下記のようにウィンドウを拡大するとビロビロにヘッダー画像が伸びてきてしまい、表示がおかしくなります。
【追記】
色々試行錯誤しましたが、スマホ表示とのデザイン連動の関係もあり画像がビロビロになる問題は妥協してそのままに。
目次がくどくなっている
目次の設定はCSSを引き継いで書いたはずですが、ブログテーマの方で指定している目次と喧嘩している状態なのではと思っています。
本来、目次下の見出しには番号を付与しない設定でしたが、いちいち番号が入ってしまっています。
【追記】
見ているうちに「そんなに悪くなくない？」と思えてきてしまったので先送りします。そのうちシレッと変わっているかもしれません。
広告表示がグチャグチャになった
こればかりはテーマ、設定、アドセンスの複合問題です。
何とか折り合いをつけたいと思っています。
【追記】
「自動広告を入れていない全てのページに自動広告をオートで入れる」という悪魔のようなベータ機能がオンになっていたせいでレイアウトがメチャクチャになっていたようです。
まだ微妙におかしいところもありますが、妥協しつつ順次改善していきます。
最後に
今の段階でわかっているおかしな箇所については、数日中には修正したいと思います。
「ここも妙な表示になっているよ！」というのがあれば、ぜひ教えていただければ幸いです。
最後に「この作業が終わったら羊蹄山の記事を書きたいなぁ」ということで、羊蹄山の画像でお送りします。あぁ、つくづくこういう作業向いてません…。
追記：その他変更点
余剰スペースにどせいさんが入りました。
気が向いたら増減させます。
