learndl learndl triboon

آموزش اضافه کردن خط جداکننده افقی در وردپرس

آموزش اضافه کردن خط جداکننده افقی در وردپرس

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

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

افزودن یک خط جدا کننده افقی در ویرایشگر وردپرس

برای افزودن یک خط جداکننده افقی با استفاده از ویرایشگر بلاک وردپرس، روی نماد (+) کلیک کنید تا یک بلاک جدید در هر کجا که می‌خواهید خط جداکننده قرار بگیرد، اضافه شود.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

سپس بلاک «جدا کننده» را از لیست نمایان شده پیدا کرده و یا نام آن را در نوار جستجو تایپ و در نهایت انتخاب کنید.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

پس از افزودن، خط جداکننده خط افقی خود را در ناحیه محتوای خود خواهید دید.

استایل‌دهی خط افقی در ویرایشگر بلاک وردپرس

به‌طور پیش فرض، خط جداکننده افقی در وردپرس خاکستری رنگ است. می‌توانید با کلیک بر روی خط، ظاهر آن را تغییر دهید.

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

در صورت تمایل می‌توانید خط افقی را به یکی از این موارد تغییر دهید:

  • یک خط گسترده که تمام عرض محتوای پست شما را پوشش می‌دهد.
  • سه نقطه که در مرکز محتوای شما نمایش داده می‌شود.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

نکته: در برخی از قالب‌های وردپرس، هم خط عریض و هم خط پیش‌فرض کل عرض پست شما را پوشش می‌دهند.

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

آموزش اضافه کردن خط جداکننده افقی در وردپرس

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

افزودن یک خط افقی در ویرایشگر کلاسیک وردپرس

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

برای انجام این کار، ابتدا وارد ویرایشگر نوشته یا برگه مورد نظر خود شده و همانند تصویر زیر،‌ روی آیکون «تغییر نوار ابزار» کلیک کنید.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

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

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

آموزش اضافه کردن خط جداکننده افقی در وردپرس

اضافه کردن دستی تقسیم کننده خط افقی با استفاده از HTML

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

<hr>

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

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

بلاک فاصله‌گذار

فاصله‌گذار یا Spacer به شما امکان می‌دهد فضای سفید خالی بین بلاک‌ها اضافه کنید. به عنوان مثال، اگر می‌خواهید در انتهای پست خود قبل از یک پیشنهاد ویژه فاصله کمی قرار بگیرد، می‌توانید از فاصله‌گذار استفاده کنید.

در تصویر زیر، یک نمونه استفاده از این بلاک آمده است:

آموزش اضافه کردن خط جداکننده افقی در وردپرس

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

در عکس زیر، نحوه نمایش فاصله در خروجی سایت قرار داده شده است:

آموزش اضافه کردن خط جداکننده افقی در وردپرس

بلاک بیشتر یا More

اگر قالب وردپرس شما تمام محتوای پست‌ها را (به‌جای خلاصه آن‌ها) در صفحه اصلی وب‌سایت نمایش می‌دهد، اضافه کردن تگ «بیشتر» باعث می‌شود پست شما در نقطه مورد نظر خاتمه پیدا کرده و بازدید کننده می‌تواند برای خواندن روی ادامه مطلب کلیک کند.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

تصویر بالا نشان می‌دهد که در ویرایشگر محتوا چه چیزی را خواهید دید و عکس زیر نحوه نمایش آن در سایت شما برای بازدیدکنندگان را نشان می‌دهد.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

بلاک جداکننده برگه یا Page Break

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

آموزش اضافه کردن خط جداکننده افقی در وردپرس

توجه داشته باشید که چگونه از شماره صفحات استفاده می‌کند و به خوانندگان اجازه می‌دهد بتوانند انتخاب کنند که به کدام صفحه بروند.

آموزش اضافه کردن خط جداکننده افقی در وردپرس

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

امیدواریم این مقاله، در نحوه اضافه کردن خط جداکننده افقی، آن هم در انواع مختلف به شما کمک کرده باشد.

با آموزش‌های بیشتر با وبیت همراه باشید.

به این مطلب امتیاز دهید

امتیاز کلی : 0 / 5. تعداد آرا : 0

اولین نفر باید که به این مطلب امتیاز میدهید

وبیت این پست توسط نگارش شده است.

در کانال وبیت عضو شو تا از آخرین اخبار ، آپدیت محصولات و تخفیف ها با خبر بشی ☺ عضویت در کانال تلگرام

اشترک گذاری

مقاله های پیشنهادی

وبیت این مطالب را به شما پیشنهاد میدهد

ارسال نظر ( 0 نظر تایید )

نظرات پس از رویت و تایید مدیران نمایش داده می شود
هنوز نظری ثبت نشده است ، اولین نفری باشید که نظر میدهید !
همکاران وبیت