トップページ > 記事閲覧
【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 05:45
投稿者 Yujiro
参照先
HAIK(cool)で、本文全体のフォントサイズを変更する簡単な方法は
ないでしょうか。

全ページに渡って一律に変更したままという意味です。

本文の部分だけ120%とか・・・

サイト情報の設定>その他のタグ の中に書けるようなスクリプトが
あれば良いのですが。
Re: 【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 22:56
投稿者 Yujiro
参照先
えーと、面白いことには!

スマホで読みやすいほどの大きさのフォントにしたほうがPCでも読みやすいっすわ。

フォントの大きさに対するline-heightの設定は重要。

ここいらでスレッド閉じさせていただきます。

お世話になりました。ありがとうございます。
Re: 【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 21:51
投稿者 Yujiro
参照先
お世話になりました。

結果うまくいきました。

結局は普通にに・・

<style type="text/css">
<!--
p {
line-height: 1.9;
font-size: 18px;

}
-->
</style>
(実際には数値を様々に変えて試し)

こんな指定をその他のタグに入れて完了です。何度かのリロードで確か
に効いてます。慌てずにもう少し検証してみるべきでした。正直突貫工
事でこのザマです。

既存の修飾用のコードに対してどのように見えるのか、これは検証が必要。

さて、私の場合そもそもは各デザインでオリジナル状態そのままを使う
方針を持っていました。

細かいデザインよりもコンテンツ内容に集中するためです。

しかしながら、ここ数年来スマホからのアクセスをに関して離脱率が高
いと思うようになり、スマホでのページ閲覧について考えていたところ
です。何せスマホは全アクセスの75%近くあります。

すると、オリジナル状態ではどうしてもスマホでのフォントサイズがか
なり小さいと感じ、「これでは離脱するだろう」と予想されました。

しばらく様子を見なければなりませんが、Googleアナリティクスの感触
ではどうも離脱低減に効果ありな気がしています。

スマホで字が小さすぎると、どんなに良い内容を書いていようが、見て
もらえないっす。
Re: 【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 12:10
投稿者 Yujiro
参照先
tomozo さん のほほんさん。 ありがとうございます。

実はtomozoさんのやり方で、先に「line-height: 1.9;」だけを使って書
いていました。(これはうまく行っていた)

そして、さらにフォントのサイズそのものを大きくしようと以下のよう
な書式にしてみたのですが、2行目の指定(font-size: 18px;)がキャン
セルされるんですよね。そこで行き詰まりました。

1行目の定義しか反応してくれないというわけです。(これが後からわかって行き詰まる)

---この下から---------------------------------------
<style type="text/css">
<!--
p {
line-height: 1.9;
font-size: 18px;

}
-->
</style>
---この上まで---------------------------------------

書き方何かまずいのでしょうか?
私、CSSはとんと勉強不足なんです。

追記:あ、いやできてる!問題なしの様子かも。リロードを繰り返したら目的の表示のよう!

追って経過を書きます。ブラウザキャッシュ、HAIK側のキャッシュなど関係ありか。
Re: 【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 11:48
投稿者 のほほん
参照先
横から失礼致します。

QHM時代から使えた【#select_fsize】で対応するのも手かもしれませんね
(手っ取り早くて簡単にすますなら)

その他だと下記の様な記載での対応でしょうか…
↓サイト設定のタグに入れて対応

<script type="text/javascript"><!--
function large() { document.body.style.fontSize = "***"; }
function middle() { document.body.style.fontSize = "***"; }
function small() { document.body.style.fontSize = "***"; }
//--></script>


***の部分には80%、20px、14pt等で指定する

文字サイズ変更ボタンをメニュー等に↑上記を使用して入れる
↓こんな感じで…

<input type="button" onClick="large()" value="大">
<input type="button" onClick="middle()" value="中">
<input type="button" onClick="small()" value="小">


一番簡単で手っ取り早いのはtomzo様の方法でしょうかね

因みに私はJSで画像つけてボタンでやってますねぇ
80%、100%、120%で指定して

何か参考になれば幸いです。
Re: 【質問】本文のフォントサイズ変更の方法
投稿日 : 2017/12/11(Mon) 10:53
投稿者 tomzo (管理者)
参照先
Yujiroさん

HAIKで本文全体の文字サイズを変更するときは、以下のスクリプトを 
設定 > サイト情報の設定 > その他のタグ に記述すれば可能です。
これは、使用しているデザインに関係なく有効です。

---この下から---------------------------------------
<style type="text/css">
<!--
p {
font-size: 18px;
}
-->
</style>
---この上まで---------------------------------------

- WEB PATIO -