【Cocoon】行間・段落間の余白が見やすくなるオススメの設定【ブログ/ワードプレス】

余白が違うと印象が変わる

僕はワードプレスの無料テーマ『Cocoon』でブログ記事を書いているんですが、最近あることに気付きました。

「自分のブログ記事は文字が詰まっていて窮屈すぎる」

なんかもう、パッと見で読む気が失せてしまいました

色々と調べた結果、『Cocoon』の段落間や行間の余白設定をいじることで解決したので書き残しておきます。

この記事を読めばわかること。

・段落間の余白の変更方法
・行間の余白の変更方法
・段落間と行間の余白が「いい感じ」になる設定
この記事を書いた人
いなご

・YouTubeを3ヶ月で挫折
・ブログは6ヶ月連続収益0円
→月間1万PV、収益9,000円達成!
・脳科学、生物学、心理学を勉強中
・独自の「継続理論」で「ブログ・YouTubeの続け方」を発信しています
プロフィール詳細
いなごのTwitterアカウント

いなごをフォローする

Cocoonの段落間の余白設定

僕の言う「Cocoonの段落間の余白」とはこれのこと。

「Cocoon」の段落間の余白

今のワードプレスで言う「ブロック同士の余白」です。

これが設定によって狭くなったり広くなったりする

「Cocoon」の段落間の余白が狭い
「Cocoon」の段落間の余白が広い

↑ 右の画像のように段落間の余白が広い方が見やすいですよね

段落間の余白を『Cocoon』の設定から変更していきます

ワードプレスの管理画面を開いて、左メニューの「Cocoon設定」→「Cocoon設定」の順にクリック

「Cocoon」の設定画面を開く

右上の「本文」タブをクリック。左下に出てくる「行の余白」という部分の青いバーを動かして余白を変更できます。

「Cocoon」の段落間の余白を変更する手順

初期設定だと1.4くらいでかなり狭いので、青いバーを動かして段落間の余白を調整しましょう。

迷ったら僕と同じく最大の4にしておけばいい感じになります。

変更後は、『変更をまとめて保存』をクリックして保存します。

↓ スマホ画面で見た時の状態。左が余白1.4、右が余白4です。

スマホ画面の段落間の余白を比較

↓ パソコン画面。左が余白1.4で、右が余白4。

「Cocoon」の段落間の余白1.4
「Cocoon」の段落間の余白4

Cocoonの行間の余白設定

「Cocoonの行間の余白」とはこれのこと。

「Cocoon」の行間の余白

「1つのブロックの中で改行があった時の余白」です。

行間の余白の設定方法はさっきと同じ。
まずは「Cocoon設定」→「Cocoon設定」の順にクリック

Cocoon設定の画面を開く手順

右上の「本文」タブをクリック。今回は上の「行の高さ」を調節します。

行間の余白を変更する手順

とはいえ、行間の余白はそのままでもいい感じになっています

僕は初期設定の1.8から1.6に変更しているけど気休め程度。

変更したら忘れずに保存しましょう。

Cocoonの段落間・行間の余白がいい感じになる設定

この記事では『Cocoon』の段落・行間の余白の設定方法をお話しました。

いい感じに見える設定は、

・段落間の余白=4
・行間の余白=1.6

今回『いい感じの余白設定』として紹介したのは、僕の主観です。

僕の設定をそのまま真似するのもOK。

色々試して、あなただけの「いい感じの余白設定」を見つけられたら、最高ですね。

コメント

タイトルとURLをコピーしました