スマホの文字サイズを変えたいです

[シガナオキ]

■ WordPress のバージョン
6.0.2

■ テーマ・プラグインは全て最新版で確認してください。
確認しました。

■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit

■ テーマのバージョン
14.23.3

■ Pro Unit のバージョン
0.23.2

■ スキンの種類
Origin III

■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
確認しました。

■ 期待する動作
こんにちわ。

本文の文字サイズはパソコン版とスマホ版で変えることはできるでしょうか？

たとえば、本文の文字は小さくてちょっと読みづらいです。

また、パソコン版で大きく目立たせたい文字をサイズを大きく設定すると、スマホで見ると巨大です。

よろしくお願いします。

■ 自分で試した事
*

■ 症状が発生するブラウザ
*

■ 実際の症状
*

[うなこ]

サイトのbodyのフォントサイズを変更する機能がありますが、こちらはいかがでしょうか。

▼Bodyのフォントサイズ指定機能

bodyのフォントサイズ指定機能

横幅が991.98px以下では、設定した数値よりも少し小さくなります。
（例えばbodyのフォントサイズを20pxにした場合は、横幅が991.98px以下では17.5pxになります）

[源太豆谷]

bodyのフォントサイズ指定だと、全体的に変わってしまうのですが、パソコンとスマホ画面とで大きく文字サイズを分けたいときはどうすればよいのでしょうか。

[うなこ]

現在は、bodyのfont-sizeは、デフォルトでは16px、991.98px以下では14pxになります。

body, html {
    font-size: var(--vk-size-text);
}

@media (max-width: 991.98px){
body, html {
    font-size: calc(var(--vk-size-text) * .875);
}
}

いろいろ書き方はありますが、以下のCSSでいかがでしょうか
数字はお好みで変えてください。

body, html {
    font-size: 18px;
}

@media (max-width: 991.98px){
body, html {
    font-size: 14px;
}
}

—–

上記のCSSはbodyのfont-sizeを変えています。

「カスタム書式設定」機能や、ブロックスタイルを追加できる「カスタムブロックスタイル設定」という機能にCSSを追記して調整する方法もあります。

▼カスタム書式設定

VK Blocks Pro1.48.0 でカスタム書式設定を追加しました

▼カスタムブロックスタイル設定

CSSのカスタマイズ方法はこちらをご覧ください
▼できる！WordPressカスタマイズ #01 簡単なデザイン（CSS）カスタマイズ方法徹底解説

できる！WordPressカスタマイズ #01 簡単なデザイン（CSS）カスタマイズ方法徹底解説

[投稿者]

投稿