通常ページへ

THE THOR【ザ・トール】行間とフォントを見やすくカスタマイズ

THE THOR（ザ・トール）のデフォルト状態の行間。

「狭い！(´⊙ω⊙`)」と思いませんでしたか？

とくにスマホで見た時、これはカスタマイズしないと！と思いました。

 

この記事では、行間とフォントサイズの変更の方法を紹介します♪

 

本記事の内容

  1. WordPressエディタでフォントを変える方法
  2. THE THORカスタマイズでフォント設定を登録
  3.  THE THOR行間をコピペでカスタマイズ

 

 
sora
初心者の方でも大丈夫！
 
くまくま
コピペ作業だよ♪

 

目次

WordPressエディタでフォントとサイズを変更方法

 

個別でフォントを変更する時は、WordPressのエディタで変更することが出来ます。

ここではクラシックエディタとブロックエディタの両方の設定方法を紹介します。

 

・クラシックエディタ

 

 

赤丸をクリックするとフォントの種類が、青丸をクリックすると個別でフォントのサイズが変更できます。

 

・ブロックエディタ

 

 

 

青丸の箇所をクリックすると使用してるフォントサイズを変更することが出来ます。

自分の好きなサイズにする場合は「カスタム」に数字を入れてください。

 

THE THOR（ザ・トール）サイト全体のフォントとサイズを設定

 

画面左側の刷毛マーク「外観」　→　「カスタマイズ」→「基本設定」　→　「基本スタイル設定」をクリックしてください。

 

 

 

 

PR

THE THOR（ザ・トール）デバイス別のフォントサイズ変更

 

■スマホ全体のフォントサイズを選択

THE THOR（ザ・トール）のデフォルトのフォントサイズは「小」になります。

 

 
sora
私は小さい画面で見るなら大きい方がいいかなぁと思い「大」に設定してあります。

 

■PC全体のフォントサイズを選択

こちらもTHE THOR（ザ・トール）のデフォルトのフォントサイズは「小」になります。

 

 
私はPC画面は「中」に設定してあります。

THE THOR（ザ・トール）サイト全体のフォントの種類を変更

 

デフォルトのフォントの種類は「游ゴシック体」になっています。

 

 
私は「メイリオ」に設定してあります。

 

「NOTO　Sans　JP（WBフォント）」は読み込みに時間がかかるので注意してください。

 

 THE THOR行間をコピペでカスタマイズ

 

投稿記事の書き方と、見やすくするための行間のカスタマイズのやり方を紹介します。

 

THE THOR（ザ・トール）CSSコピペは「追加CSS」

 

画面左側の刷毛マークの「外観」→「カスタマイズ」→「追加CSS」をクリックしてください。

 

必ず半角文字になっていることを確認して作業をしてください。
 
下のコードをコピペした後、「公開」をクリックしてください。

 

THE THOR（ザ・トール）行間のＣＳＳ

 

.content p{line-height: 45px; }

 

この1行をコピペするだけでTHE THORの行間が広がります。

この数値を大きくすると行間が開いていきます。

 

 
sora
私は45pxで設定してあります。

THE THOR【ザ・トール】行間とフォントを見やすくカスタマイズ　まとめ

 

THE THORの行間を調整することで読みやすいサイトにする方法を紹介しました。行間を広げるためにエンターキーを何度も殴打するという作業が減ったと思いますwww。

リストも広げようかと思ったのですが、リストを広げると目次も広がるので私は使用をやめました(^^;;

最後まで読んでいただきありがとございました。

ランキングに参加しているのでクリックしてくださると嬉しいです(^^♪