文字サイズの変更
いつもご愛顧頂き、誠に有難うございます。
テンプレートや記事の文字サイズ変更方法について、今迄記事にしておりませんでした。
不案内なテンプレートで申し訳ございませんでした。m(__)m
カスタマイズをされる方にとっても必要な情報と思いますので、記事にさせて頂きます。

(クリックで大きく表示)
ブログ全体の文字を大きくしたい場合は、ご利用テンプレートのスタイルシート編集枠上段の
テンプレートによって85%では無いものも有ります。その場合も html の font-size の数値を変更して下さい。
1emの大きさはブラウザーのfont-sizeのデフォルト値で、変更がなにも無ければ16pxです。
html{ の下に有る body{ に font-size:1em; と有りますが、html{ で(上記であれば)85%としているので、16pxの85%という大きさになります。html{ のfont-sizeを100%にすると、デフォルト値の16pxで表示されます。
【注意】
投稿画面での文字サイズ設定は、テンプレート毎の基本文字サイズが指定されている場合、上手く反映しない場合が有ります。
当方テンプレートではデフォルトサイズより小さくなっておりますので、それに合わせて投稿画面で文字サイズ設定を致しますと、テンプレートを変更した場合に『大き過ぎ』たり『小さ過ぎ』たりする事が有ります。
入力モードでの文字サイズMediumは16pxですので、「テンプレートの文字が小さいな」と思われましたら、先ず(1)の基本文字サイズを100%にして表示をご確認下さいませ。
[参考数値 1em=16pxを100%とした場合]


・ 通常の(旧)投稿画面。(クリックで大きく表示)

ボタンを押すと選択した文字列にCSSが直書きされます。
変な文字列訳わからん、と仰る方は下記の入力方法をどうぞ。
・ 高機能テキストエディタを使った場合

MS Wordのような画面です。でもこの『W』はWordでは無く WYSIWYGの事です。
WYSIWYGは「What You See Is What You Get」の略で、入力画面上で表示されている通りに表示する事ができます。
・ 新投稿画面の場合

使うかどうか分からないようなボタンを排除し、使い易さを重視したシンプルな投稿画面で、こちらも『見たまま』表示です。
…細かく言うと、ヘッダー部のブログタイトル・ブログの説明文、サイドに有るメニュー部分を除き、(設定していれば)トップページ及び個別記事のプラグイン3、個別記事ページの本文・コメント・トラックバック、カテゴリーや月別・全記事タイトルリスト等の文字は大きくなります。
元々(全体の文字サイズで指定しており)記事カラム部分の文字サイズは指定しておりませんので、一番簡単な方法として新たに文字サイズのスタイルを追加します。
この方法で有れば、テンプレートを他のものに変更しても(2)の注意事項を気にしなくて済みます。
ご利用テンプレートのスタイルシート編集枠最下段に、下記を追加して更新して下さい。
テンプレート名↓の場合は
youth_resp2,3c
genial_resp2c,3c
serene_resp2c,3c
ct_responsive
dt21_ryo,ryo_2c
candy-2c3c
green-2c3c
↓下記を最下段に追加(コピペ可)
テンプレート名↓の場合は
al_responsive2c
↓下記を最下段に追加(コピペ可)
テンプレート名↓の場合は
al_responsive3c
lace-d2c,d3c
lace-al2,al3
↓下記を最下段に追加(コピペ可)
後は更新ボタンを押して頂ければ適用されます。
文字サイズの数値は小数点以下が指定できますので、見栄えの微調整が出来ます。
(閲覧されるブラウザの種類によっても解釈が異なりますが、第3位で切り捨て・四捨五入等が有るものを考慮して、小数点以下は第2位までの指定が無難…と思います。)
テンプレートや記事の文字サイズ変更方法について、今迄記事にしておりませんでした。
不案内なテンプレートで申し訳ございませんでした。m(__)m
カスタマイズをされる方にとっても必要な情報と思いますので、記事にさせて頂きます。
1 ) テンプレート全体の文字サイズ変更
先ず、テンプレート全体の文字サイズ変更についてです。
(クリックで大きく表示)
ブログ全体の文字を大きくしたい場合は、ご利用テンプレートのスタイルシート編集枠上段の
html{
font-size:85%;
という部分の数値を調整します。(小数点以下も可。)テンプレートによって85%では無いものも有ります。その場合も html の font-size の数値を変更して下さい。
1emの大きさはブラウザーのfont-sizeのデフォルト値で、変更がなにも無ければ16pxです。
html{ の下に有る body{ に font-size:1em; と有りますが、html{ で(上記であれば)85%としているので、16pxの85%という大きさになります。html{ のfont-sizeを100%にすると、デフォルト値の16pxで表示されます。
2 ) 投稿画面で文字サイズを変更
文字のサイズを記事内で変更する場合は投稿画面で行います。大小色々変えたい場合はこちらをご利用下さい。【注意】
投稿画面での文字サイズ設定は、テンプレート毎の基本文字サイズが指定されている場合、上手く反映しない場合が有ります。
当方テンプレートではデフォルトサイズより小さくなっておりますので、それに合わせて投稿画面で文字サイズ設定を致しますと、テンプレートを変更した場合に『大き過ぎ』たり『小さ過ぎ』たりする事が有ります。
入力モードでの文字サイズMediumは16pxですので、「テンプレートの文字が小さいな」と思われましたら、先ず(1)の基本文字サイズを100%にして表示をご確認下さいませ。
[参考数値 1em=16pxを100%とした場合]


・ 通常の(旧)投稿画面。(クリックで大きく表示)

ボタンを押すと選択した文字列にCSSが直書きされます。
変な文字列訳わからん、と仰る方は下記の入力方法をどうぞ。
・ 高機能テキストエディタを使った場合

MS Wordのような画面です。でもこの『W』はWordでは無く WYSIWYGの事です。
WYSIWYGは「What You See Is What You Get」の略で、入力画面上で表示されている通りに表示する事ができます。
・ 新投稿画面の場合

使うかどうか分からないようなボタンを排除し、使い易さを重視したシンプルな投稿画面で、こちらも『見たまま』表示です。
3 ) 記事カラムまるごと文字サイズを変更
いちいち記事を書く時にエディタで調整するのは面倒なので、まとめて記事表示部分の文字サイズを変更したい、という場合はスタイルシートを編集します。簡単に言うと「ヘッダーとメニューカラム以外」です。…細かく言うと、ヘッダー部のブログタイトル・ブログの説明文、サイドに有るメニュー部分を除き、(設定していれば)トップページ及び個別記事のプラグイン3、個別記事ページの本文・コメント・トラックバック、カテゴリーや月別・全記事タイトルリスト等の文字は大きくなります。
元々(全体の文字サイズで指定しており)記事カラム部分の文字サイズは指定しておりませんので、一番簡単な方法として新たに文字サイズのスタイルを追加します。
この方法で有れば、テンプレートを他のものに変更しても(2)の注意事項を気にしなくて済みます。
ご利用テンプレートのスタイルシート編集枠最下段に、下記を追加して更新して下さい。
テンプレート名↓の場合は
youth_resp2,3c
genial_resp2c,3c
serene_resp2c,3c
ct_responsive
dt21_ryo,ryo_2c
candy-2c3c
green-2c3c
↓下記を最下段に追加(コピペ可)
.blog-con {
font-size: 1.2em; /* 記事の文字サイズはここを変える */
}
テンプレート名↓の場合は
al_responsive2c
↓下記を最下段に追加(コピペ可)
.con1,.menu3 {
font-size: 1.2em; /* 記事の文字サイズはここを変える */
}
テンプレート名↓の場合は
al_responsive3c
lace-d2c,d3c
lace-al2,al3
↓下記を最下段に追加(コピペ可)
.con2,.menu3 {
font-size: 1.2em; /* 記事の文字サイズはここを変える */
}
後は更新ボタンを押して頂ければ適用されます。
文字サイズの数値は小数点以下が指定できますので、見栄えの微調整が出来ます。
(閲覧されるブラウザの種類によっても解釈が異なりますが、第3位で切り捨て・四捨五入等が有るものを考慮して、小数点以下は第2位までの指定が無難…と思います。)
[Tag] * カスタマイズ
↻
Re: maccha2665 様へ
無事に適用できたようで何よりです。(^^)他にもカスタマイズされていらっしゃり、暗色テーマもとても見易いですね。
また何かお気付きがございましたら、いつでもお声掛け下さいませ。
この度は素敵な出会いを有難うございました。(^-^)
[ 返信 * 編集 ]▼ ▲