WordPressで段落にスペースを追加したり、インデントしますか？ほとんどのテキストは左寄せで表示されますが、タイポグラフィや読みやすさを向上させるために段落をインデントしたい場合もあるでしょう。この投稿では、WordPressで段落を簡単にインデントする方法を紹介します。
方法1：ビジュアルエディターのインデントボタンを使う
デフォルト設定では、ほとんどのWordPressテーマは段落を左寄せ、または右から左への言語の場合は右寄せで表示します。
段落をインデントしたい場合は、ビジュアルエディターのインデント増加ボタンをクリックして手動でインデントすることができます。これで段落の左側にスペースが追加されます。
複数の段落をインデントしたい場合は、それらの段落を選択し、インデント増加ボタンをクリックする必要があります。
インデントを増やすボタンを複数回クリックすることもできます。例えば、2回クリックすると、インデントの間隔が2倍になります。
また、インデントを減らすボタンをクリックすると、間隔を狭めることができます。
方法2：テキストエディターを使用して手動で段落をインデントする
ビジュアルエディターのテキストインデント・ボタンを使うのが、WordPressで段落をインデントする最も簡単な方法です。しかし、これでは追加したいスペーシングの量をコントロールする権限がありません。
より高度なユーザーは、テキストエディターに切り替えて、手動でスペースを追加することができます。必要なのは、テキストを段落タグの<p>タグと</p>タグで囲み、次のように段落テキストにインラインCSSを追加するだけです：
<p style="padding-left:25px;">段落テキストはここに...</p>。
この方法では、インデントとして使用するスペーシングをコントロールすることができます。この方法は、それほど頻繁に段落をインデントする必要がない場合に最適です。しかし、頻繁に段落をインデントするのであれば、これは理想的な解決策ではありません。
方法3：段落の最初の行だけをインデントする
ウェブページでは、ワープロや組版で使われる伝統的な段落間隔を使用しません。
WordPressでも、段落をインデントすると、段落全体にスペースが追加されます。
ニュースや雑誌サイト、文芸誌のようなサイトでは、より伝統的な段落間隔を追加したい場合があります。その場合は、テーマにカスタムCSSを追加する必要があります。
まず、外観 ” カスタマイズにアクセスし、WordPressテーマカスタマイザーを起動します。次に「追加CSS」タブをクリックします。
左ペインにカスタムCSSを追加できるテキストボックスが表示されます。このCSSコードをボックスに追加する必要があります。
[cbk1］
このCSSコードは、段落に.custom-indentクラスがある場合、text-indentとして60pxを追加することをブラウザーに伝えるだけです。
WordPressで投稿を編集し、テキストエディターに切り替えることができます。次に、段落を<p class=”custom-indent”>と</p>タグでこのように囲みます：
<p class="custom-indent">段落テキストはここに...</p>。
投稿をプレビューすると、段落の1行目だけが空白になっていることがわかります。
この方法は、いくつかの段落だけをインデントしたい場合にうまく機能します。しかし、サイトのすべての段落にこのスタイルを追加したい場合は、カスタムCSSをこのように変更する必要があります：
[cbk2］
このCSSルールは、WordPressの投稿やページ内のすべての段落の最初の行を自動的にインデントします。
この投稿がWordPressで段落をインデントする方法を学ぶのにお役に立てば幸いです。WordPressのビジュアルエディターを使いこなすためのヒントもご覧ください。
この投稿を気に入っていただけたなら、WordPressの動画チュートリアルをYouTubeチャンネルに登録してください。Twitterや Facebookでもご覧いただけます。
Syed Balkhi says
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
cuneyt says
thank you, really simple explanations with exact pictures. helped me a lot.
WPBeginner Support says
You’re welcome, glad our guide was helpful
管理者
Paulette Brown says
I found “Customize” at the top in the black menubar when I’m signed in for editing my WordPress site.
Your instructions don’t mention that I need to click the blue “Publish” box to add the CSS. Mine doesn’t say “Save and Publish”. I found elsewhere that I need to click this, and when I change themes I may need to do this CSS entry again.
The site-wide indent first line CSS doesn’t work the way I expected. Nothing seems to have happened.
Does it need to be on the three lines you show, or can it be all on one line?
WPBeginner Support says
Apologies for that lack of clarification, you are correct that if you change themes with method 3 it will require you to readd the CSS. The three lines are for display but either method should work properly.
Your theme may be overriding the CSS, you may want to check with the support for your specific theme if there is a setting that would be preventing it.
管理者
Sergiu says
I wish indents, and numbering have a keyboard shortcuts as text processors have ..
chas says
It works, but treats the whole article as one paragraph I’m trying to post a short story with many paragraphs
all I cab do is insert one CR after another and that’s a royal pain
Lucas says
It works for inside text, but it also does so in comments. Is there a way to make it post-only?
Roman says
None of this works for me. I’m either inserting it wrong, or wordpress has changed, and this doesn’t work anyone. I can’t even find the “additional css” after going into “appearance” to “customize”.
Sam says
This definitely works. You have to search around your “customize” location. It also depends on your theme developer, they may move the add/custom CSS.
Cavid Muradov says
Very thanks for text indent