またまた、ワードプレスのテーマを変えてみました
基本フリーのやつをダウンロードして使っています
最近、もう、スマホメインでやったほうがいいような気もして、サイドバーいらないな。とおもいつつ
今回選んだのは「ミニマリスト ブロガー」：minimalist blogger
シンプル＆カクカクして好みです
今まで、こういうの残したことなかったんですが、大体やることが同じで、流行りもあって面白いので、ちょっと残しておこうかと
PageSpeedを測る
最近は至れり尽くせりにカスタマイズできるテーマが多い中、あまりにも設定できる箇所が少なくてｗ
しかし、ミニマリストというだけあり、GoogleのPageSpeed Insightsでは
モバイル92点、PCは100点満点♪
モバイルの点、最初は98あったような気がしたんですが、今見ると下がってる
モバイルは揺らぎがありますが、PCは大体100点キープできている感じです
この点数がどうなんだっていうのはよくわかりませんが
100点だとうれしいｗ
サムネイルが大きすぎる
スマホなら自動的に小さくなりますが、タブレット、PCなど画面が大きなデバイスだとかなり大きな画像
このブログでは、サムネイルを基本200pxにしているので、そのサイズにしてみた
200px画像にフローとさせると、スマホの回り込みが読みづらいので
幅400くらいで区切ろうかなと
@media screen and (min-width: 400px) {
.featured-thumbnail {
width: 200px;
}
}
本当は、個別投稿のサムネイルを消したいですが、class [featured-thumbnail]をつつくと全部消える…
分岐点？がよくわからない
Footerを3行から1行に
3つに分かれたフッターは必要ないので、1行にしてプライバシーポリシーなどを入れておいた
幅を100%にして解決
.footer-column-three {
width: 100%;
max-width: 100%;
}
READ MOREのボタン色を変える
別に変えなくてもよかったんですが、一応「赤」っぽくしてみる
.blogpost-button { background: #6d031c;}
枠の線の色を変える
濃い色できつすぎる気がしたので、色を少し薄くしました
article.fbox {
border: 1px solid #000;
}
一番きつい色だったんですね#000
#cccくらいでいい
ウィジェットの枠色はこちらで変更
.swidgets-wrap {
border: 1px solid #000;
}
ウィジェットタイトルの背景色
タイトルをh3で設定すると、黒い楕円にホワイトフォントのタイトルロゴになっています
形もここで変えられます
色を変えたい場合、
違うところで設定があるみたいで、importantで強く設定すると出来ました
.swidget h3 {background:#色!important;}
色を選ぶとき、最近はまっているのが
和色大辞典
洋色もあるんですが、色にいちいち名前がついていて地味に楽しい
現在のこのブログのリンクの色と、ウィジェットタイトルの色は
深緋こきひ #c9171e
「ふかひ」とも読むみたいです
いや、深はふかですよね
古代から、茜の根で染めたものを緋色というそうです
という地味な知識を増やせますｗ
文字色を変える
外観からの「カスタマイズ」で、文字色すら設定できんとはｗ
コントラストがきついので、文字色を少し薄くしました
.single article .entry-content, .page article .entry-content, article .entry-content {
color:#595857;
}
薄すぎますかね？
読みにくかったらコメントいただけませんか
ほかにも、ヘッダーをつついて入れたりしてみたんですが、ヘッダーをつつくと、PageSpeedの成績がガクッと悪くなるので、外しました。
余計なものを入れると黄色になるから…