アッフィーこんな悩みを解決できる記事をご用意しました!
私はブログを始めて3年。
これまでに100本以上の渾身の記事を書き上げてきました。
その結果、累計で6桁の収益を達成することができました。
当サイトは、SWELLを3年間使い込んだ経験を活かし、SWELL 段落ブロックの全機能と具体的な使い方を徹底解説します。
この記事を読んで実践すれば、ブロックツールバーの操作からサイドバーの詳細設定まで完全に習得できます。
そして、段落ブロックを自在に扱えるようになるので、あなたの記事の読みやすさと品質が格段に向上するでしょう。
SWELLのポテンシャルを最大限に引き出し、読者から「見やすい」と評価される記事を一緒に作っていきましょう。
まだSWELLを購入していないなら、以下の記事を参考にSWELLを導入してください。


\ 初心者に最もおすすめなWordPressテーマ /
SWELLの魅力を知りたいなら、次の記事が参考になりますよ。ぜひ参考にしてみて下さい。


SWELL段落ブロックの基本
段落ブロックは、記事作成で最も頻繁に使うブロックです。
SWELLではWordPress標準機能に加えて、豊富な装飾機能が追加されています。
まずは段落ブロックの基本的な概念と操作方法を理解しましょう。
WordPress標準ブロックを拡張した機能
段落ブロックはWordPressに標準搭載されているブロックですが、SWELLテーマを導入することで機能が大幅に拡張されます。
WordPress標準機能では文字色やサイズの変更といった最低限の装飾しかできません。
しかしSWELLでは28種類のボックスデザインやマーカー線、アイコンボックスなど、プロ並みの装飾が簡単に使えるようになります。
たとえば、重要な部分にマーカー線を引いたり、注意書きをボックスで囲んだりする作業が、ワンクリックで完了します。
装飾に悩む時間を減らし、記事執筆に集中できる点がSWELL導入の大きなメリットです。
\ 初心者に最もおすすめなWordPressテーマ /
改行と段落の違い
段落ブロックの使い方を説明する前に、ブログ初心者が迷うことの多い改行と段落の違いについて確認しておきましょう。
改行と段落は似ているようで、実は明確な違いがあります。
改行は段落内で行を変えるだけの操作で、Shift + Enterキーで実行します。行間は変わらず、文章が続いている印象を与えます。
この文章は改行と段落の違いについて説明しています。
改行は行間が変わらず文章が続くイメージです。
一方、段落は文章の意味のあるかたまりを区切る単位で、Enterキーだけで作成できます。
この文章は改行と段落の違いについて説明しています。
段落を分けると行間が広くなります。
段落を分けると行間が広くなり、視覚的にも内容が切り替わったことが分かりやすくなります。
- 行を変える場合・・・Shift + Enter
- 段落を分ける場合・・・Enter
段落ブロックでできること
SWELLの段落ブロックでは以下のことができます。
以下で深掘りします。
テキストを入力する
SWELLの段落ブロックにはテキストを入力することができます。
ブロックツールバーを使うと、テキストに装飾をかけることができます。


テキストを入力しました。
テキストを太字にしました。
テキストを斜めにしました。
テキストのサイズを大きくしました。
テキストの色を変更しました。
テキストに背景色をつけました。
テキストにマーカーをしました。
いろいろなブロックを挿入する
SWELLではSWELLオリジナルブロックをはじめ、機能強化されたコアブロックが用意されており、クリックするだけで段落ブロックに挿入することができます。


私がよく利用するブロックをご紹介しますね。
✳︎気になるブロックをクリックすると紹介記事に飛べますよ!
ブロックを装飾する
SWELLではブロックの装飾を以下の28種類のデザインから選べます。
ボーダー01
ボーダー02
ボーダー03
ボーダー04
ストライプ
方眼
角に折り目
ステッチ
かぎ括弧
かぎ括弧(大)
窪み
浮き出し
左に縦線
付箋
吹き出し
吹き出し2
ポイント
チェック
バツ印
はてな
アラート
メモ
装飾の仕方については後ほど「ボーダーセットで枠線デザインを選ぶ」と「スタイル装飾でボックスデザインを追加する」で解説しますね。
新しいブロックを追加する6つの方法
ブロックエディタは見出し、段落、画像などをブロック単位で管理しています。


記事を書くためには、見出し、段落、画像などのコンテンツの数だけ新しいブロックを追加する必要があります。
新しいブロックを追加する方法は複数ありますが、ここでは6つ紹介します。



状況に応じて使い分けると作業がスムーズになりますよ。
方法①:Enterキーで追加(最も簡単)
投稿編集画面の初期状態では、空白の段落ブロックが一つだけ用意されています。


段落ブロック内の文章の末尾でEnterキーを押してみて下さい。


すると、すぐ下に空白のブロックが追加されます。


文章を書きながら自然に次の段落を作れるため、最も簡単で使用頻度が高い方法です。
方法②:ブロックツールバーから追加
ブロックツールバー右端の「」(オプション)から「前に挿入」または「後に挿入」をクリックしましょう。


すると、すぐ上または下に空白のブロックが追加されます。


方法③:画面左上の「+」から追加
方法①、方法②は空白ブロックを追加する方法でした。
ここからは、その他のブロックを追加する方法を紹介しますね。
画面左上の「+」ボタンをクリックしましょう。


ブロックの一覧が表示されるので、追加したいブロックのアイコンをクリックして下さい。


なお、「+」をクリックする前にどこを選択していたかにより、追加される場所が変わります。
| どこを選択していたか? | 追加される場所 |
|---|---|
| 空白ブロックを選択していた場合 | その場所にブロックが追加される |
| 空白ブロック以外を選択していた場合 | その下にブロックが追加される |
| どこも選択していない場合 | 記事の一番最後に追加される |
方法④:ブロック間の「+」から追加
既存の2つのブロックの間にマウスを合わせると表示される「+」ボタンをクリックしてください。


すると、ブロックの候補が表示されるので、追加したいブロックのアイコンをクリックしましょう。


候補の中に追加したいブロックがない場合は、検索窓にブロック名を入れて検索しましょう。


「すべて検索」をクリックすると。【画面左上の「+」をクリック】と同じブロック選択画面が表示されます。


追加したいブロックのアイコンをクリックして、ブロックを追加しましょう。



この方法は、テキストとテキストの間にブロックを挿入したい場合に便利ですよ
方法⑤:空白ブロックの右端の「+」から追加
空白の段落ブロックの右端の「+」ボタンをクリックしてください。


するとブロックの候補が表示されますので、追加したいブロックのアイコンをクリックしましょう。


この後の手順は【ブロック間の「+」から追加】と同じです。
方法⑥:スラッシュコマンドを使う
空白ブロックで「/」と「ブロック名」を入力すると、ブロックの候補が表示されます。
たとえば「/カラム」と入力すると、カラムブロックとリッチカラムブロックが候補として出てきます。


「/」を使う方法は、キーボード操作だけで完結するため、慣れると最も速く追加できます。



紹介した方法の中から、自分に合った方法を見つけてくださいね!
ブロックツールバーとサイドバーの役割
段落ブロックの装飾や設定は、主にブロックツールバーとサイドバーの2箇所から行います。


ブロックツールバーはブロック上部(または画面左上)に表示され、文字揃えや太字、リンク挿入といった基本操作がワンクリックで実行できます。
一方、サイドバーは画面右側にあり、ボックス装飾やボーダーセット、余白調整など、より詳細な設定を行う場所となります。
たとえば、文字を太字にしたいときはツールバーで瞬時に設定し、段落全体をおしゃれなボックスで囲みたいときはサイドバーから選ぶという使い分けです。
次からは、ブロックツールバーとサイドバーでどんなことができるのかを見ていきましょう。
SWELLのブロックツールバーでできること
ブロックツールバーは、段落ブロックを選択したときに上部(または画面左上)に表示されるメニューです。


文字装飾から配置調整まで、よく使う以下の機能がまとまっています。
順番に見ていきましょう。
ブロックタイプを変換する
段落ブロックは、ツールバー左端のアイコンをクリックすることで、見出しやリストなど別のブロックタイプに変換できます。


すでに入力した文章をそのまま活かしながらブロックタイプを変更できるので、わざわざ文章をコピーして貼り直す手間がかかりません。
たとえば、段落として書いた文章を「これは見出しにしたほうがいいな」と思ったら、ツールバーから「見出し」を選んでみてください。


すると、文章が見出しに変換されます。





一度入力した内容を無駄にせず、柔軟にレイアウトを調整できますよ!
段落ブロックを移動する
ブロックツールバーの上下矢印ボタンを使えば、段落ブロックを好きな位置に移動できます。
上矢印をクリックすると上へ、下矢印をクリックすると下へ、段落ごと移動します。




また、ツールバー左側の6つの点(ドラッグハンドル)をドラッグ&ドロップすれば、離れた場所にも一気に移動可能です。





この機能で簡単に段落の順番を入れ替えよう!
文字揃えを変更する
ツールバーの文字揃えアイコンをクリックすると、段落全体の配置を「左寄せ」「中央寄せ」「右寄せ」に変更できます。


初期設定は左寄せですが、2行目以降を「テキスト中央寄せ」「テキスト右寄せ」に設定すると以下のようになります。





文字配置を工夫するだけで、記事の印象がガラッと変わりますよ!
デバイスごとに表示を切り替える
SWELLのブロックツールバーには、デバイス別に表示を制御する機能があります。
「PCのみ表示」「スマホのみ表示」を選択することで、表示するデバイスにより段落の表示・非表示を切り替えられます。


PCで表示すると、「PCサイズでのみ表示する」に設定した文章が表示され、


スマホで表示すると、「スマホサイズでのみ表示する」に設定した文章が表示されます。


たとえば、詳しい説明文はPC版だけに表示し、スマホでは簡潔な文章だけを見せる、といった使い分けが可能です。



デバイスごとに最適な情報量を見つけて、読者の離脱を防ごう!
ブロック下の余白量を調整する
ブロックツールバーの余白調整アイコンから、段落ブロックの下に入る余白を0〜6emの範囲で設定できます。


余白を広げると視覚的に区切りが明確になり、逆に余白を狭めると段落をまとまりとして見せることができます。



重要なポイントの前に余白を広めに取ると、読者の注意を引きやすくなりますね!
太字とイタリックで強調する
ツールバーの「B」ボタンで太字、「I」ボタンでイタリック(斜体)に変更できます。


重要なキーワードや読者に伝えたい箇所を太字にすると、流し読みしている人の目にも留まりやすくなります。
イタリックは引用や補足説明など、本文とは少し違ったニュアンスを伝えたいときに便利です。



使い方は簡単。文字を選択してボタンをクリックするだけ!


リンクを挿入する
ツールバーのリンクアイコンをクリックすると、選択した文字にリンクを設定できます。


外部サイトへのリンクはもちろん、同じブログ内の別記事(内部リンク)も簡単に挿入できます。


リンクの設定については、「【リンクの貼り方】WordPressブログにURLを貼る方法」で詳しく解説しています。参考にしてください。


内部リンクについては「SEOに効果的な内部リンクの貼り方のコツと注意すべき点を解説」も参考になりますよ。


その他の機能
「さらに表示ボタン」(をクリックすると、WordPressに標準で用意されているその他の機能が使えます。


インラインコードを設定する
インラインコードは、文章中にプログラムコードやHTMLタグを表示させるときに使います。
ツールバーの「さらに表示」ボタン(下矢印)から「インラインコード」を選択すると、選択した文字が等幅フォントで強調表示されます。





下図のように一目で区別できるので、読者が「これはコードだ」とすぐに理解できますよ!


文章中に画像を挿入する
①画像を挿入する位置を選択し、②ツールバーの「さらに表示」ボタン(下矢印)から③「インライン画像」をクリックすると、文章の途中に画像を埋め込めます。


たとえば「このアイコン![]()
![]()





小さなアイコンや絵文字的な画像を挿入するのに適していますよ!
キーボード入力を表示する
キーボード入力機能は、読者がキーボードで入力すべき文字を示すときに使います。
ツールバーの「さらに表示」()をクリックして表示されるメニューから「キーボード入力」をクリックすると、選択した文字がキーボードキー風に表示されます。


すると、選択した文字がキーボードキー風に表示されます。
たとえば「Command + Cでコピーできます」のように、ショートカットキーを説明する際に視覚的に分かりやすくなります。


上付き・下付き・打ち消し線を使う
ブロックツールバーの「さらに表示」をクリックして表示されるメニューで「上付き」、「下付き」、「打ち消し線」が設定できます。


たとえば以下のように使用できます。
| 効果 | 使用例 |
|---|---|
| 上付き | m²(平方メートル) |
| 下付き | H₂O |
| 取り消し線 |
脚注を追加する
ブロックツールバーの「さらに表示」をクリックして表示されるメニューから「脚注」を選択すると、選択した部分に脚注番号が付き、記事の最後に脚注ブロックが自動で追加されます。


SWELL独自の装飾機能
SWELLのブロックツールバーには、WordPress標準にはない独自の装飾機能が追加されています。


順番に見ていきましょう。
書式クリアで装飾をリセットする
SWELL装飾メニューの「書式クリア」を選択すると、選択した文字に施されたすべての装飾を一括でリセットできます。





個別に解除する手間が省けていいですよ!
コード表示(DIR・FILE)を使う
SWELL装飾メニューの「コード(DIR)」や「コード(FILE)」を選択すると、ディレクトリ名やファイル名を視覚的に区別して表示できます。


たとえば、
エクスプローラーを開きます。
C:\Program Files\MyApplication\(DIR) に移動してください。
その中にある config.ini(FILE) をメモ帳で開きます。
のように使用します。
これにより、ユーザーが見落としがちな「パス」や「ファイル名」が強調されるので、操作ミスを減らせます。
注釈を追加する
脚注よりも軽い補足情報を、その場で伝えたいときに使える機能です。


たとえば、
おすすめのプランは「スタンダードコース」です。月額980円(※初回登録時は初月無料キャンペーン対象)で利用できます。
のように、条件や補足をさりげなく示すことができます。



記事を読み進めながら補足情報を確認できるので便利ですね!
インラインボタンを設置する
SWELL装飾メニューの「インラインボタン」を使うと、表の中に小さなボタンを設置できます。


たとえば以下のように設置できます。
商品比較表などで「購入する」といったリンクボタンを配置したいときに便利です。
表にリンクボタンを設置する手順はここをクリック →












カスタム書式で独自スタイルを適用する
SWELL装飾メニューの「カスタム書式」を使うと、事前に登録したCSSスタイルを選択した文字に適用できます。


SWELL設定 ➡️エディター設定 ➡️ カスタム書式で、よく使う装飾をクラス名とともに登録しておけば、ワンクリックで呼び出せます。





上記のカスタム書式を設定すると、こんな風に装飾されますよ。
ちなみに、上記CSSは以下のとおりです。
/* カスタム書式:キーボード風 */
.swl-format-1 {
display: inline-block;
padding: 2px 6px;
font-family: monospace;
font-size: 0.9em;
line-height: 1.4;
color: #333;
background-color: #f7f7f7;
border: 1px solid #ccc;
border-radius: 3px;
box-shadow: 0 2px 0 rgba(0,0,0,0.1);
margin: 0 2px;
}


参考にしてみて下さいね
書式セットで一括装飾する
SWELL装飾メニューの「書式セット」を使うと、太字・文字色・背景色・マーカー・フォントサイズをまとめて設定した書式を一括で適用できます。


SWELL設定 ➡️エディター設定 ➡️ カスタム書式で書式セットを登録しておけば、複数の装飾を一度に施せます。
たとえば「太字+黒文字+黄色マーカー」という組み合わせを「重要ポイント」として登録すれば、毎回個別に設定する手間がなくなります。


アイコンを挿入する
SWELL装飾メニューの「アイコン」をクリックすると、文章中にアイコンを挿入できます。


「アイコン」をクリックするとSWELLで利用できるアイコン一覧が表示されます。





アイコンを探してクリックするだけです!
ショートコードを活用する
SWELL装飾メニューの「ショートコード」から、事前に登録した以下のショートコードを挿入できます。
- 記事内広告
- スマホだけ改行
- PCだけ改行
- アイコン
- 評価用スター
- HTML挿入


テキストの大きさを変更する
「フォントサイズ」をクリックすれば、選択したテキストの大きさを変更できます。


大きさはXS、S、L、XLを指定する方法と、サイズを入力する方法があります。
テキストのサイズを変更したら、「適用」をクリックして保存しましょう。
テキスト色を変更する
次はテキストの色の変更方法です。
変更したいテキストを選択し、「テキスト色」をクリックしてください。


カラーパレットが表示されるので、変更したいカラーを選択します。


他の色に変更したい場合は、縞模様の部分をクリックしてカラーパレットを表示させ、①マウスで色を選択、または②カラーコードを入力して色を選択しましょう。


カラーコードを調べるのには、「Color Picker for Chrome」が便利です。
クリックすると開きます/
「Color Picker for Chrome」を使ってカラーコードを調べる手順はこちら ➡️
ChromeウェブストアーからColor Picker for Chromeのページを開きましょう。


ページが開いたら右上にある「Chromeに追加」ボタンをクリックしてください。


「Color Picker for Chrome」を追加するか確認されますので、「拡張機能を追加」をクリックします。


すると、「Color Picker for Chrome」が追加されました、とのコメントが表示されます。


これで「Color Picker for Chrome」の導入は完了です。
導入したらよく使う拡張機能としてお気に入りに固定しておきましょう。
下の画像のように、拡張機能ボタン⇒固定ボタンの順にクリックしてください。


固定すると、Chrome上部にあるツールバーに常時表示されるようになります。


カラーピッカーを使う時は、webサイトを開いた状態で①拡張機能をクリックして表示される、②「PICK COLOR」をクリックしてください。


「PICK COLOR」をクリックすると、カーソル付近が虫眼鏡のように拡大されます。
調べたい箇所にカーソルをおいてクリックしてください。


クリックすると、下図のようにカラーコードが表示されます。
これをコピーすれば、カラーコードのコピーは完了です。


背景色を設定する
続いてテキストの背景色の変更です。
①変更したいテキストを選択し、②「背景色」をクリックしてください。


カラーパレットが表示されるので、背景色にしたいカラーを選択します。


ほかの色に変更したい場合は、テキスト色の場合と同様にカラーパレットを使って変更しましょう。
マーカーを引く
SWELLのツールバーにあるマーカーアイコンをクリックすると、選択した文字に蛍光ペン風のマーカー線を引けます。
WordPress標準にはない機能で、SWELLならではの便利な装飾です。


カラーが選択できるウィンドウが開くので、マーカーの色を選択しましょう。


マーカーの色はSWELL設定 ➡️ エディター設定➡️マーカーから変更でき、マーカーの形状も太線やストライプなどから選択できます。





重要なポイントを目立たせたいときには、欠かせない機能ですよ!
段落ブロックの便利なオプション機能
ブロックツールバーの「」(オプション)メニューには、ブロックの管理や再利用に役立つ機能がまとまっています。


コピーやグループ化など、知っておくと作業効率が格段にアップする機能ばかりですよ!
ブロックをコピー・複製する
オプションメニューから「コピー」を選択すると、段落ブロックをクリップボードにコピーできます。


「複製」を選択すれば、選択中のブロックと同じものがすぐ下に作成されるので、似た内容の段落を連続して作りたいときに便利です。


前後にブロックを追加する
オプションメニューの「前に挿入」「後に挿入」を使うと、選択中のブロックの直前・直後に新しいブロックを追加できます。


たとえば、見出しの直前に導入文を追加したいとき、「前に追加」をクリックすれば、


ピンポイントで空の段落ブロックを配置できます。


スタイルをコピーして再利用する
オプションメニューの「スタイルをコピー」を使うと、選択中のブロックに施された装飾だけをコピーできます。


その後、別のブロックを選択して「スタイルを貼り付け」を実行すれば、同じ装飾を再現できます。


複数ブロックをグループ化する
オプションメニューの「グループ化」を使うと、複数の段落ブロックを1つのグループとしてまとめられます。


グループ化すると、グループ全体にボーダー設定を適用したり、スタイルを設定したりできます。
スタイルを設定する手順は以下の通りです。




すると選択した段落ブロックをグループ化できます。




ブロックをロックして保護する
オプションメニューの「ロック」を使うと、ブロックの移動や削除を防げます。


誤って重要な段落を消してしまったり、位置を変えてしまったりするのを防ぎたいときに便利です。



作業中のミスを防ぐのに使いましょう!
パターンとして保存する
オプションメニューの「パターンを作成」を使うと、段落ブロックをパターンとして登録できます。


登録したパターンは、エディター画面の「パターン」タブからいつでも呼び出せます。
パターンの登録と呼び出しの手順は以下のとおりです。






これでパターンの登録が完了します。




「マイパターン」をクリック





繰り返し使う定型文や装飾済みのブロックを保存しておくと、記事作成がグッと楽になりますよ!
HTMLで直接編集する
オプションメニューの「HTMLとして編集」をクリックすると、選択したブロックをHTMLコードで直接編集できます。


実際に「HTMLとして編集」をクリックしてみました。


たとえば、独自のCSSクラスを追加したり、Xのポストを張ることができます。
ブロックを削除する
オプションメニューの「削除」を選択すると、ブロックを削除できます。


SWELLサイドバーでできる詳細設定
SWELLの段落ブロックには、記事編集画面の右側にあるサイドバーを使って、デザインや表示に関する高度な設定を適用できます。


設定タブ
「設定」タブでは、主にブロック全体に対する装飾や表示のルールを設定します。


順番に見ていきましょう。
ボーダーセットで枠線デザインを選ぶ


段落ブロックに枠線を簡単に追加できます。
枠線の種類は以下のとおりです。
ボーダー01
ボーダー02
ボーダー03
ボーダー04
枠線の太さや枠線の色は、SWELL設定➡️エディター設定➡️ボーダーセットタブのボーダーセットの登録でカスタマイズできますよ。


スタイル装飾でボックスデザインを追加する


ボックス装飾は、ワードプレステーマSWELLの大きな魅力の一つです。
スタイルは24種類もあります。
ストライプ
方眼
角に折り目
ステッチ
かぎ括弧
かぎ括弧(大)
窪み
浮き出し
左に縦線
付箋
吹き出し
吹き出し2
ポイント
チェック
バツ印
はてな
アラート
メモ



沢山ありすぎて、どれを使うか迷ってしまいますね
デバイス制限で表示を最適化する
記事を閲覧するデバイス(PC、タブレット、スマホ)ごとに、そのブロックを表示するか非表示にするかを制御できます。


例えば、スマホでは不要な大きな表をPC限定にしたり、PCでは表示せずスマホだけで簡潔な案内を表示したりといった使い方が可能です。
この機能はブロックツールバーの「デバイスごとに表示を切り替える」と同じ機能です。


ブロック下余白で間隔を調整する
段落ブロックの直下の余白(間隔)を「0em〜6em」の範囲で調整できます。


この機能はブロックツールバーに設置された「ブロック下の余白量」と同じ機能ですが、より細かく設定できます。


HTMLアンカーでページ内リンクを設定する
HTMLアンカーとは、そのブロックをページ内リンクの移動先として指定するための「目印」のことです。


たとえば、h2見出しの中で「この章の目次」を作る時に活躍します。


追加CSSクラスでカスタマイズする
ブロックエディターの標準機能やSWELLの機能だけでは設定できない、独自の装飾やレイアウトを適用したい場合に利用します。


あらかじめCSSファイルに記述したスタイル(例:字下げや特殊な背景色)を、この入力欄にクラス名として指定することで呼び出せます。
CSSを記述できる中級者以上向けの機能です。
スタイルタブ
「スタイル」タブをクリックすると、文字の大きさや色など、タイポグラフィ(文字のデザイン)に関する設定ができます。


スタイルタブには以下のような機能があります。
順番に見ていきましょう。
テキスト色、背景色を設定する
段落ブロック全体の文字の色(テキスト色)、背景色を設定できます。


カラーパレットやお好みのカラーコードを使って、簡単に色の変更が可能です。


タイポグラフィで文字スタイルを整える
タイポグラフィでは、ブロック内の文字のサイズや行の高さ(行間)などを詳細に設定できます。


タイポグラフィは、オプションマークをクリックし項目にチェックを入れることで、行間や文字間隔なども変更できるようになりますよ。


SWELL段落ブロックを使いこなすコツ
SWELLの装飾機能は非常に豊富ですが、無計画に使うと記事全体がごちゃついて見えてしまいます。
ここでは、読者に読みやすい段落ブロックの適切な使い方とテクニックをご紹介します。
1段落3〜4行を目安にする
一つの段落は、3〜4行程度になるように調整しましょう。
文章ばかりが続く塊は、読者にとって非常に大きな負担となり、離脱の原因になるからです。
行数が多くなったら、Enterキーを使って適切に段落を区切りましょう。
適切な段落分けを行うことで、読者は文章を「意味のある塊」として認識しやすくなります。
装飾は重要箇所だけに絞る
太字やマーカー、文字色などの装飾機能は、最も伝えたい核心部分だけに限定して使いましょう。
全ての文章に装飾を施すと、どこが重要なのかが逆に分からなくなってしまいます。
例えば、結論やキーとなる専門用語、重要なメリットなど、読者に「ここだけは注目してしてほしい」と思う箇所に装飾をするのがおすすめです。
装飾を絞り込むことで、読者の視線が狙ったポイントに集まり、記事の主張が際立つように整います。
マーカーと太字を組み合わせる
インライン装飾のなかで最も強調力が高いのが、マーカー(蛍光ペン)と太字の組み合わせです。
マーカーだけでは弱く、太字だけでは他の見出しと紛れてしまう可能性があります。
伝えたいキーワードを太字にした上からマーカーを引くことで、文章の流れを止めずに圧倒的な視認性で強調できます。



SWELLの段落ブロックツールバーから簡単に設定できますよ


ボックス装飾で情報を際立たせる
SWELLのサイドバーから設定できるボックス装飾(スタイル装飾)は、文章以外の情報を扱う際に非常に役立ちます。
例えば、読者への注意書きには「アラート」スタイル、記事の結論には「ポイント」スタイルを使い分けましょう。
通常の段落とは視覚的に明確に区別できるため、その情報が特別な重要性を持つことを読者に直感的に伝えられます。
スマホ表示を必ず確認する
装飾や段落分けを行った後は、必ずスマホやタブレットでの表示を確認する習慣をつけましょう。
記事作成のほとんどはPCで行われますが、現在のWebサイトの閲覧は約7〜8割がスマートフォンからだからです。
PCでは見栄えが良くても、スマホで確認すると文字が詰まっていたり、ボックスが画面からはみ出したりしている場合があります。
読者の多くを占めるスマホユーザーへの配慮が、記事の読みやすさ向上につながります。
SWELL 段落ブロックのデザインを効率化するテクニック
SWELLはデザイン性の高さが特徴ですが、毎回同じ装飾を施すのは手間がかかります。
ここでは、一度作ったデザインや装飾セットをすぐに呼び出せるようにする、時短のためのテクニックをご紹介します。
書式セットを活用する
書式セットとは、あらかじめ設定した文字の装飾(太字や文字色、背景色など)を保存し、ワンクリックで適用できる機能のことです。


例えば、サイト内で使用する「注意喚起の文字色+マーカー」を登録しておくと、以降の執筆時に手間を大きく削減できます。
登録は、WordPressダッシュボードからSWEL設定➡️エディター設定➡️カスタム書式タブで行います。


書式セットを使えば記事デザインの一貫性を保ちつつ、作業時間を大幅に短縮できますよ。
作成したブロックをパターン登録で再利用する
よく使う段落ブロックの組み合わせや装飾が完了したブロックは、「パターン」として保存しておきましょう。


例えば、「ボックス装飾を施した段落」と「その下の画像」をセットで登録できます。
パターン登録をしておくと、新しい記事を書く際にエディターから簡単に呼び出して再利用が可能です。



ブロックを作り直さなくてもいいので、記事執筆のスピードが格段に上がりますよ!
パターン登録の仕方と呼び出し方は「パターンとして保存する」を確認して下さい。
SWELL段落ブロックでよくある質問
段落ブロックの操作に慣れてくると、細かいデザインやレイアウトの調整方法について疑問が出てくるものです。
ここでは、SWELLユーザーから特によく寄せられる質問にお答えします。
順番に見ていきましょう。
マーカーの色を変更するには?
マーカー(蛍光ペン)の色は、「SWELL設定」→「エディター設定」の「マーカー」タブの「マーカー設定」で、色やスタイルを自由に変更できます。


サイトのメインカラーに合わせて色をカスタマイズし、記事全体に統一感を持たせましょう。
段落の余白をより広くしたい場合は?
段落ブロックと次のブロックとの間隔を大きく空けたい場合は、「スペーサー」ブロックを間に挟んでみましょう。


スペーサーブロックは、文字通り空白のスペースを作るためのブロックです。
このブロックを挿入し、ドラッグ操作で簡単に高さを調節できます。
挿入方法は以下のとおりです。
余白を入れたい部分で「+」(ブロック追加)ボタンをクリックし、検索窓で「スペーサー」を検索し選択します。


スペーサーブロックが挿入されたら、ドラッグ操作でお好みの高さに調整しましょう。


これで段落ブロックの間にスペースができます。





これでブロック間を大きく開けることができますよ!
ブロック装飾の設定を変更したい場合は?
ブロック装飾のデザインを変更したい場合は、「SWELL設定」から行います。
WordPressの管理画面から「SWELL設定」→「エディター設定」の「ボーダーセット」タブまたは「アイコンボックス」タブを開いてください。




ここで、枠線のスタイルや太さ、アイコンの色などをあらかじめ設定しておきましょう。
まとめ|SWELL段落ブロックを使いこなして高品質な記事を作ろう
今回は、SWELLテーマにおける段落ブロックの全機能と操作方法を網羅的に解説しました。
本記事の内容は以下のとおりです。
記事で学んだツールバーとサイドバーの役割を理解し、基本操作から応用操作までを使いこなすことが大切です。
特に、装飾を重要箇所に絞る、1段落3〜4行を目安にするといったコツを守ることで、読者がストレスなく読み進められる記事になります。
SWELLの段落ブロックを活用すれば、デザインに悩む時間を減らし、執筆に集中できるようになります。
本記事を参考に、SWELLが持つ力を最大限に引き出して、読者に価値を届けるコンテンツ作成に役立ててください。
これだけの高機能がプラグインなしで使えるのはSWELLだけです。
まだSWELLを導入していない方は、ぜひ以下のレビュー記事で他の神機能もチェックしてみてください。


\ 初心者に最もおすすめなWordPressテーマ /











