نحوه ایجاد بلوک در وردپرس [ راهنمای جامع برای مبتدیان و حرفه‌ای‌ها ]

وردپرس به عنوان محبوب‌ترین سیستم مدیریت محتوا  در جهان، همواره در حال بهبود تجربه کاربری خود است. یکی از مهم‌ترین تغییراتی که در سال‌های اخیر در وردپرس ایجاد شده، معرفی ویرایشگر گوتنبرگ است. این ویرایشگر که از نسخه ۵.۰ وردپرس جایگزین ویرایشگر کلاسیک شد، بر پایه “بلوک‌ها” طراحی شده است و به کاربران این امکان را می‌دهد که به راحتی محتوای خود را مدیریت و ویرایش کنند.

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

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

بلوک در وردپرس چیست؟

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

ویژگی‌های اصلی بلوک‌ها در وردپرس

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

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

ایجاد بلوک‌های تو در تو در وردپرس

یکی از ویژگی‌های قدرتمند ویرایشگر گوتنبرگ در وردپرس، امکان ایجاد بلوک‌های تو در تو (NestedBlocks) است. این قابلیت به کاربران اجازه می‌دهد تا چندین بلوک را درون یک بلوک اصلی قرار دهند و به این ترتیب، ساختارهای پیچیده‌تر و حرفه‌ای‌تری برای صفحات و نوشته‌های خود ایجاد کنند.

چرا باید از بلوک‌های تو در تو استفاده کنیم؟

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

این بلوک‌ها در چه مواردی استفاده می‌شوند؟

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

برای ایجاد بلوک‌های تو در تو در وردپرس، می‌توان از بلوک‌های خاصی مانند بلوک گروه (Group)، بلوک ستون (Columns) و بلوک کاور (Cover) استفاده کرد. مراحل انجام این کار بسیار ساده است. ابتدا باید بلوک والد (اصلی) را اضافه کنید. در ویرایشگر وردپرس، روی دکمه “+” کلیک کرده و یکی از بلوک‌های گروه، ستون یا کاور را انتخاب نمایید.

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

چگونه بلوک‌های تو در تو در وردپرس بسازیم؟

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

1. افزودن بلوک والد (اصلی)

برای ایجاد بلوک‌های تو در تو، ابتدا نیاز است که یک بلوک اصلی (والد) اضافه کنید که سایر بلوک‌ها درون آن قرار بگیرند. بلوک‌های والد معمولاً برای گروه‌بندی و سازماندهی محتوا به کار می‌روند و به شما اجازه می‌دهند که چندین المان مختلف را در کنار هم داشته باشید. برای این کار:

در ویرایشگر وردپرس، روی دکمه “+” کلیک کنید.

در بخش جستجوی بلوک‌ها، عبارت “Group” (گروه)، “Columns” (ستون‌ها) یا “Cover” (کاور) را جستجو کنید.

یکی از این گزینه‌ها را انتخاب کرده و در صفحه خود قرار دهید:

بلوک گروه (Group): این بلوک مانند یک ظرف عمل می‌کند و می‌توان هر نوع بلوکی را درون آن قرار داد. مناسب برای گروه‌بندی بخش‌های مختلف محتوا است.

بلوک ستون (Columns): به شما امکان می‌دهد محتوای خود را در چندین ستون مرتب کنید. این گزینه برای نمایش اطلاعات به‌صورت مقایسه‌ای یا چیدمان‌های چندبخشی بسیار مفید است.

بلوک کاور (Cover): این بلوک معمولاً برای قرار دادن یک تصویر پس‌زمینه همراه با متن یا سایر عناصر به کار می‌رود.

2. افزودن بلوک‌های داخلی

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

روی فضای داخلی بلوک والد کلیک کنید تا علامت “+” ظاهر شود.

نوع بلوکی که می‌خواهید اضافه کنید (به عنوان مثال متن، تصویر، دکمه، لیست و غیره) را انتخاب کنید.

این کار را برای افزودن چندین بلوک دیگر تکرار کنید تا ساختار موردنظر شما شکل بگیرد.

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

اگر از بلوک ستون (Columns) استفاده کنید، می‌توانید در هر ستون یک تصویر، یک توضیح کوتاه و یک دکمه قرار دهید تا کاربران بتوانند اطلاعات را به‌صورت مرتب و واضح مشاهده کنند.

3. تنظیم و ویرایش بلوک‌های تو در تو

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

جابجایی بلوک‌ها: برای تغییر ترتیب بلوک‌ها، کافی است روی هر بلوک کلیک کرده و از فلش‌های بالا و پایین استفاده کنید. همچنین می‌توانید با کشیدن و رها کردن (Drag & Drop) موقعیت بلوک‌ها را تغییر دهید.

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

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

4. ذخیره و استفاده مجدد از بلوک‌ها

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

برای ذخیره بلوک‌ها، روی سه‌ نقطه در نوار ابزار بلوک کلیک کنید.

گزینه “ایجاد بلوک قابل استفاده مجدد” (Add to Reusable Blocks) را انتخاب کنید.

یک نام برای این بلوک انتخاب و روی گزینه “ذخیره” کلیک کنید.

اکنون، هر زمان که بخواهید از این بلوک در بخش‌های دیگر سایت خود استفاده کنید، کافی است هنگام افزودن بلوک، به بخش Reusable Blocks مراجعه کرده و آن را انتخاب کنید.

5. پیش‌ نمایش و انتشار محتوا

بعد از طراحی و تنظیم بلوک‌های تو در تو، بهتر است قبل از انتشار، پیش‌نمایش آن را بررسی کنید تا از درستی چیدمان و نمایش صحیح المان‌ها مطمئن شوید. برای این کار:

روی دکمه “پیش‌نمایش” (Preview) کلیک کنید.

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

روی دکمه “انتشار” (Publish) کلیک کنید تا صفحه شما در سایت نمایش داده شود.

جدول خلاصه روش ساخت بوک تو رد تو در وردپرس

جدول خلاصه روش ساخت جدول تو درت و در وردپرس

سخن پایانیبا ایجاد بلوک‌های در وردپرس امکان طراحی صفحات منظم، حرفه‌ای و کاربرپسند را فراهم می‌کنید. با استفاده از بلوک‌های والد مانند Group، Columns و Cover می‌توانید چندین المان را در کنار هم قرار دهید و بخش‌های مختلف سایت را به‌طور سازمان‌ یافته به نمایش بگذارید. در این مقاله، نحوه ایجاد بلوک‌های والد، افزودن بلوک‌های داخلی، ویرایش و تنظیم آن‌ها، ذخیره بلوک‌های پرکاربرد و انتشار محتوا را بررسی کردیم.این روش به بهبود خوانایی محتوا، افزایش انعطاف‌پذیری در طراحی و بهینه‌سازی سئوی سایت کمک می‌کند. اگر قصد دارید بدون نیاز به کدنویسی، طراحی صفحات خود را ارتقا دهید، استفاده از بلوک‌های تو در تو در ویرایشگر گوتنبرگ بهترین گزینه است. با تمرین و استفاده از این قابلیت، می‌توانید سایت‌هایی جذاب، حرفه‌ای و کاربرپسند بسازید!