前から思っていたんだけどWinでみるとこのブログのフォントがきちゃない。また、12pixだと、ちと年寄りには、モニターの設定によっては小さすぎる。自分自身がジジイだからね。というわけで、変更しよう。
（１）テーマファイルを変更するので、ファイルの権限を書き換え可能にする。
サーバにログインして/Users/[ユーザ名]/sites/blog/wp-content/themes/[テーマ]に行く
-rwxr-xr-x@ 1 sigh staff 13190 Sep 14 2009 style.css になっているから
-rwxrwxrwx@ 1 sigh staff 13190 Sep 14 2009 style.css に変更する。そうすると、
（２）外観ーテーマの編集の
のスタイルシートを開くと
ボタンがに出てくる。書き換え可能にする必要があるわけだ。
（３）書き換える。
body { の部分を探し；
|
1 2 |
font-size: 12px; font-family: Arial, Helvetica, Sans-Serif; |
を
|
1 2 |
font-size: 14px; font-family: メイリオ, Meiryo, Osaka, “ヒラギノ角ゴ Pro W3”, “Hiragino Kaku Gothic Pro”, “ＭＳ Ｐゴシック”, “MS PGothic”, sans-serif; |
に書き換える。Win用に ＭＳ Ｐゴシック、Mac用に Osaka,、ヒラギノ角ゴ Pro W3、英語用にArial, Helvetica でいいんだと思うけどね。
Before After で比べてみると
Windows Chrome では
が
に、
Macintosh Chrome では
が
になった。
Windowsでの見栄えがよくなった。Macではごちゃごちゃした感になっちゃったけど。今度は行間を変えればいいけど、めんどいな。このままでいいや。
[ 追加 ] 2018.5.19
１０３行目
|
1 2 3 4 5 6 7 |
textarea { color: #2b2b2b; font-family: Lato, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; } |
を以下のように変更
|
1 2 3 4 5 6 7 |
textarea { color: #2b2b2b; font-family: メイリオ, Meiryo, Osaka, “ヒラギノ角ゴ Pro W3”, “Hiragino Kaku Gothic Pro”, “ＭＳ Ｐゴシック”; font-size: 14px; font-weight: 400; line-height: 1.5; } |
（４）Footer の調整
文字を大きくしたらフッターの（編集）が２行にわたっちゃうので home,php を書き換え可能にし、
|
1 2 3 4 5 6 7 8 |
<div class="postmeta"> <div class="postmetaleft"> <p><?php the_time('Y年n月d日'); ?> · カテゴリー <?php the_category(', ') ?></p> </div> <div class="postmetaright"> <p><?php comments_popup_link('コメント（0）', 'コメント（1）', 'コメント（%）'); ?> <?php edit_post_link('(編集)', '', ''); ?></p> </div> </div> |
を
|
1 2 3 4 5 6 7 |
<div class="postmeta"> <div class="postmetaleft"> <p><?php the_time('Y年n月d日'); ?> · カテゴリー <?php the_category(', ') ?></p> <p><?php comments_popup_link('コメント（0）', 'コメント（1）', 'コメント（%）'); ?> <?php edit_post_link('(編集)', '', ''); ?></p> </div> </div> |
にして、日付とカテゴリーのブロックとコメントと編集が別のブロックになっていたのを </div> <div class=”postmetaright”>を削除して１つのブロックにし２行表示にし、フッターの(編集）文字列が２行にわたって表記しないようにしてみた。
（５）タイトルの文字の色を変える
本文の文字を大きくしたらタイトルがめだたなくなっちゃったので style.css の
|
1 2 3 4 |
#content h1 a { color: #0B3949; text-decoration: none; } |
だったのを色を変えて
|
1 2 3 4 |
#content h1 a { color: #FF0040; text-decoration: none; } |
にしちゃった。
６）ファイルの権限を戻す
style.cssとhome.phpの権限を７７７にしたのでこれを元の７５５に戻す。忘れずに。
そもそも、テーマというのはデザイナーがこれが一番いいという組み合わせで作成しているのだから、どっかを変更すると、あちこち変なところが出てくる。ほかのテーマに変えたほうがいいけど、このテーマでずっと走っているから変更したくないんだよね。デザイナーがテーマを更新すると、この設定はもとにもどっちゃうんだよね。だから余り変えたくないのだけどね。