日々いろんな出来事がありますが、やっと当ブログでデザインテンプレートの試用を始めました。
思い切って始めれば何とか形になるものです。
『Smart』を基本にカスタマイズ開始
当初の予定通り「Smart」テーマデザイナー対応版（目次なし）をダウンロード、ファイル解凍しました。
こちらで出来るだけ完成させてから、メインブログに適用する予定です。
投稿編集機能の「見出し」仕様が更新されている
デザインテンプレートだけでなく、bloggerの仕様も更新されている。
これにより大きな影響が見込まれるのが見出しサイズの扱いです。
以前はH2「見出し」までの構成でしたが、今後はH1「主見出し」を考慮して内容を編集する事になります。
デザインテンプレートファイルを更新
ブログ管理画面の【テーマ】から、カスタマイズ詳細で「元に戻す」を選択。
最新のテンプレートファイルをアップロードして、ブログデザインが更新されました。
青色を基調としたデザインで、このままでも主な機能は使えます。
再構成の開始
この時点で過去の追加内容は消えているため、地道に再構成を進めていきます。
順番は前後しますが、2月15日時点の作業内容はこのあたり。
- Googleアドセンス関連コード追加
記事下に検索広告を設置 - 構成色をテーマデザイナー機能で簡易設定
- ガジェットの再配置
- 自動目次機能の追加
- カエレバ・ヨメレバ装飾追加
- 簡易設定で変更できない背景色を透明化（CSS）
おおむね順調なGoogleアドセンス
Googleアドセンス関連はHTML/CSSの編集が必須です。
これを最初に追記しておけば、自動広告機能が有効化されます。
それに加えて記事内下部に検索機能広告を配置しました。
視覚効果は地味なので、今後の成果が気になります。
構成色は簡易機能で済ませたい
デザインには疎いので、できるだけ一括して設定したいものです。
標準機能のテーマデザイナーで、青から緑を基調とした色に変更。
自動目次機能は過去のコードを流用
『Smart』純正の自動目次生成機能は、過去記事に修正が必要になります。
それを避けるため、以前に構成したコードを追記しました。
現在のところ、H1見出しが含まれていても自動生成に支障はないようです。
カエレバ・ヨメレバの装飾はweb検索で探しました
以前まで使っていた装飾はカエレバ限定だったので、できればヨメレバを含めて使いたいところです。
機能と外見を兼ね備えた装飾は、地道にweb検索して探せば好みのものがあるでしょう。
追記する方法ですが【テーマ】⇒『カスタマイズ』⇒「詳細設定」から、一番下の項目にある「CSSを追加」にコピーして、状況を保存しましょう。
簡易設定できなかった【背景色】を透明色にできました
ブログ上部のヘッダーにGoogleアドセンス広告のガジェットを配置すると、空きスペースが青色になってしまうのが悩みでした。
どこかに関連するコードがあるのは確実なので、web表示した状態でF12を押して表示されているweb色コードを解析。
該当する色コードを、テーマ内検索で発見しました。
これを純正の青色から白色のコードに変更した結果、空きスペースの色が周囲と一体化して問題解決。
これで気兼ねなくレスポンシブ広告を配置できます。
続きは各端末で確認してから
『Smart』の表示は端末によって異なるので、一気に進展させるのは私には難しい。
地道に更新箇所を探していきます。
【追記】文字間隔の調整（縮小）しました
文字サイズ調整後、ブログ投稿本文の文字間隔（横空間）が広く感じていました。
関連キーワードで検索したところ『サルワカ』に解説ページがあったので変更しました。
2021年2月22日時点では letter-spacing: 0.05em という設定です。
コメント