چگونه تورفتگی پاراگراف در وردپرس ایجاد کنیم؟

برای ایجاد تورفتگی پاراگراف در وردپرس، اول باید مشخص کنید که فقط خط اول از حاشیه فاصله بگیره یا می‌خواید کل پاراگراف جابه‌جا بشه. در وردپرس ۷.۰ و نسخه‌های جدیدتر، تورفتگی خط اول از تنظیمات خود بلوک پاراگراف در دسترسه. اگه از نسخه قدیمی‌تر یا ویرایشگر کلاسیک استفاده می‌کنید، با چند خط CSS هم می‌تونید همین کار رو انجام بدید.

در ادامه، هرکدوم از این روش‌ها رو قدم‌به‌قدم با هم بررسی می‌کنیم. تفاوت تورفتگی خط اول و فاصله‌دادن به کل پاراگراف رو هم می‌بینید و یاد می‌گیرید برای نوشته‌های فارسی از چه کدی استفاده کنید.

تورفتگی پاراگراف دقیقاً چیه؟

تورفتگی یعنی متن کمی دورتر از حاشیه شروع بشه. ویژگی text-indent فقط خط اول پاراگراف رو جابه‌جا می‌کنه. در مقابل، ویژگی‌هایی مثل padding-inline-start به کل پاراگراف فاصله می‌دن.

این فاصله بعضی متن‌ها رو مرتب‌تر و خواناتر نشون می‌ده، ولی لازم نیست در همه پاراگراف‌ها ازش استفاده کنید. در خیلی از صفحه‌ها، فاصله مناسب بین پاراگراف‌ها برای خوانایی کافیه. یادتون نره که تورفتگی به‌تنهایی رتبه سئو یا بازدید سایتتون رو بیشتر نمی‌کنه.

روش اول: تورفتگی خط اول در وردپرس ۷.۰ و جدیدتر

در نسخه‌های جدید وردپرس، بلوک پاراگراف گزینه Line Indent رو در اختیارتون می‌ذاره. Line Indent همون فاصله‌ایه که فقط به ابتدای خط اول پاراگراف اضافه می‌شه.

1. نوشته یا برگه‌ای رو که می‌خواید ویرایش کنید، باز کنید.
2. روی بلوک پاراگراف موردنظرتون کلیک کنید.
3. اگه نوار تنظیمات کنار صفحه بسته هست، روی آیکون تنظیمات در بالای ویرایشگر کلیک کنید.
4. بخش Typography یا «تایپوگرافی» رو باز کنید. تنظیمات مربوط به ظاهر نوشته در این بخش قرار دارن.
5. مقدار Line Indent رو تغییر بدید و نتیجه رو همون‌جا داخل ویرایشگر ببینید.

اگه گزینه Line Indent رو پیدا نمی‌کنید، نسخه وردپرس سایتتون رو بررسی کنید. این قابلیت از وردپرس ۷.۰ اضافه شده و در نسخه‌های قدیمی‌تر باید سراغ روش CSS برید.

روش دوم: ایجاد تورفتگی در ویرایشگر کلاسیک

اگه سایتتون هنوز از افزونه Classic Editor استفاده می‌کنه، محیط نوشتن و ویرایش محتوا با ویرایشگر بلوکی فرق داره. Classic Editor همون محیط قدیمی ویرایش نوشته در وردپرس رو برمی‌گردونه.

برای فاصله‌دادن به یک بخش از متن، اول اون بخش رو انتخاب کنید. بعد روی دکمه افزایش تورفتگی در نوار ابزار بزنید. هر بار که روی این دکمه کلیک می‌کنید، فاصله متن بیشتر می‌شه. برای کم‌کردن فاصله هم می‌تونید از دکمه کاهش تورفتگی کمک بگیرید.

این راه سریع و ساده هست، ولی اندازه فاصله رو با دقت زیادی کنترل نمی‌کنه. ظاهر نهایی اون هم ممکنه در قالب‌های مختلف فرق داشته باشه. پس اگه فاصله مشخصی مدنظرتونه، استفاده از CSS انتخاب بهتریه.

روش سوم: فاصله‌دادن به کل پاراگراف با CSS

CSS زبانیه که ظاهر بخش‌های مختلف صفحه رو مشخص می‌کنه. با کمک CSS می‌تونید اندازه تورفتگی رو دقیقاً به‌اندازه دلخواهتون تنظیم کنید. اگه هنوز با ساختار این فایل آشنا نیستید، آموزش ساختار اصلی فایل CSS شروع ساده‌ای براتون هست. بعد از اون هم می‌تونید سراغ آموزش ویژگی‌های پرکاربرد CSS برید.

برای اینکه کل پاراگراف از حاشیه فاصله بگیره، منوی سه‌نقطه بلوک پاراگراف رو باز کنید. بعد گزینه «ویرایش به‌صورت HTML» رو بزنید و کلاس custom-indent رو به تگ پاراگراف اضافه کنید:

<p class="custom-indent">متن پاراگراف شما در این بخش قرار می‌گیره.</p>

حالا کد زیر رو به بخش CSS اضافی سایتتون اضافه کنید:

.custom-indent {    padding-inline-start: 25px;}

ویژگی padding-inline-start در ابتدای جهت متن فاصله ایجاد می‌کنه. یعنی در متن فارسی، فاصله از سمت راست ساخته می‌شه و در زبان‌های چپ‌به‌راست از سمت چپ. به همین دلیل، این روش برای سایت‌های چندزبانه و متن‌های راست‌به‌چپ از padding-left مناسب‌تره.

روش چهارم: تورفتگی فقط در خط اول با CSS

اگه می‌خواید فقط ابتدای خط اول فاصله داشته باشه، کلاس custom-indent رو مثل روش قبلی به پاراگراف اضافه کنید. این بار به‌جای فاصله‌دادن به کل پاراگراف، از ویژگی text-indent استفاده کنید:

.custom-indent {    text-indent: 2em;}

واحد em به اندازه نوشته وابسته هست. مقدار 2em تقریباً به‌اندازه عرض دو نویسه فاصله ایجاد می‌کنه و با تغییر اندازه فونت هم هماهنگ می‌مونه. اگه این فاصله با ظاهر قالب سایتتون جور نیست، می‌تونید عدد اون رو کمتر یا بیشتر کنید.

کد CSS رو کجا وارد کنیم؟

در قالب‌های کلاسیک

از پیشخوان وردپرس به «نمایش ← سفارشی‌سازی» برید و بخش «CSS اضافی» رو باز کنید. کد رو داخل کادر بذارید و نتیجه رو در پیش‌نمایش ببینید. اگه همه‌چیز درست بود، روی «انتشار» بزنید.

در قالب‌های بلوکی

قالب بلوکی قالبیه که بخش‌هایی مثل سربرگ و پابرگ اون هم با بلوک‌ها ویرایش می‌شن. در این نوع قالب‌ها معمولاً سفارشی‌ساز قدیمی رو نمی‌بینید.

1. از پیشخوان وردپرس به «نمایش ← ویرایشگر» برید.
2. بخش Styles یا «استایل‌ها» رو باز کنید.
3. منوی سه‌نقطه رو باز کنید و Additional CSS یا «CSS اضافی» رو بزنید.
4. کد رو وارد کنید و تغییراتتون رو ذخیره کنید.

ممکنه اسم بعضی گزینه‌ها با توجه به زبان پیشخوان یا نسخه وردپرس کمی فرق کنه. قبل از ذخیره نهایی هم بهتره صفحه رو در موبایل و دسکتاپ ببینید تا مطمئن بشید فاصله بیش‌ازحد نیست.

اعمال تورفتگی به همه پاراگراف‌های نوشته

اگه مطمئنید که خط اول همه پاراگراف‌های نوشته‌ها باید تورفتگی داشته باشه، می‌تونید از کد زیر کمک بگیرید:

article p {    text-indent: 2em;}

این انتخاب‌گر همه تگ‌های پاراگراف داخل article رو هدف می‌گیره. ولی ساختار HTML همه قالب‌ها شبیه هم نیست. ممکنه این کد پاراگراف‌های بخش‌هایی مثل فرم، توضیحات محصول یا کادرهای ویژه رو هم تغییر بده. پس قبل از استفاده سراسری، حتماً اون رو در چند نوع صفحه امتحان کنید.

برای بیشتر سایت‌ها بهتره تورفتگی رو فقط به پاراگراف‌های موردنظرتون بدید. این روش کنترل بیشتری بهتون می‌ده و احتمال به‌هم‌ریختن بخش‌های دیگه سایت رو هم کمتر می‌کنه.

جمع‌بندی

برای ساخت تورفتگی پاراگراف در وردپرس، روش مناسب به نوع فاصله‌ای بستگی داره که می‌خواید ایجاد کنید. اگه فقط خط اول باید کمی جلوتر شروع بشه، در وردپرس ۷.۰ و نسخه‌های جدیدتر از گزینه Line Indent استفاده کنید. ویژگی text-indent هم همین نتیجه رو با CSS بهتون می‌ده. برای جابه‌جایی کل پاراگراف هم padding-inline-start انتخاب مناسب‌تریه، چون جهت متن فارسی رو در نظر می‌گیره.

بهتره تورفتگی رو فقط جایی به کار ببرید که واقعاً خوندن متن رو راحت‌تر می‌کنه. بعد از اعمال تغییرات هم صفحه رو در موبایل و دسکتاپ بررسی کنید تا فاصله با قالب سایتتون هماهنگ باشه و متن از حاشیه بیش‌ازحد دور نشه.

تیم تولید محتوا

ما در تیم تولید محتوای میهن وردپرس در تلاش هستیم تا بهترین مقالات آموزشی در زمینه وردپرس و کسب‌و‌کارهای اینترنتی را تهیه کنیم. صحت محتوای این صفحه توسط رضا راد بررسی خواهد شد.