どうでしょうか？
これまで「Zikazev Blue」というテンプレートを使用していて、まあまあ満足していたのですが、ひとつだけ不満があって、スマホで見たときに表示が崩れるという問題がありました。
そこで新たなテンプレートを探してたのですが、最近になって良さそうなのが見つかりましたのでここ１週間で変更してみました。
新しいテンプレートは、「Alexis」というやつです。
https://newbloggerthemes.com/alexis-blogger-template/
シンプルなテンプレートでレスポンシブ対応です。
また、スマホでもきれいに表示されます。
あと、デフォルトのままではきれいに表示されなかったりしたので、いくつか調整しています。
・フォントを日本語フォントに変更
・記事タイトルの色とサイズ変更
・引用タグCSS変更
・ハンバーガーメニューが表示されない対策
・記事日付表示修正
・タイトルが全部大文字になるのを修正
特にハンバーガーメニューが表示されない問題は悩みました。
CSSをいろいろ変更したりして試しましたがうまくいかず、最終的にブラウザの開発ツールでエラーになってる箇所を見つけ対応しました。
何が悪かったかというと、スムーズスクロールのスクリプトを入れてたのですが、それがハンバーガーメニューの固定表示させる処理とバッティングしてたようでうまく動いていませんでした。このスムーズスクロールのスクリプトは辞めにして代わりに下記のCSSで対応することにしました。
html{
scroll-behavior: smooth;
scroll-padding-top: 50px;
}
※scroll-padding-topは、ページ内リンクで移動したときに上部固定メニューの下に隠れてしまうのでその高さ分だけずらすために設定しています。
とりあえず、これでしばらく使っていきたいと思います。
今後また飽きてきたら変更するかもしれません。
スポンサーリンク