آموزش کامل ویرایشگر جدید وردپرس ۵ | گوتنبرگ

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

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

ویرایشگر کلاسیک در مقابل گوتنبرگ

کوچ کردن از ویراشگر کلاسیک که تقریبا در اکثر سیستم‌های مدیریت محتوا رواج دارد یک جرات و جسارت می‌خواهد تا کاربران را به سوی ویرایشگر جدید سوق دهد؛ وردپرس این جسارت را به خرج داد تا تحولی در ویرایشگر‌های جدید به وجود آورد.

ویرایشگر کلاسیک وردپرس

این ویرایشگر از سال ۲۰۰۳ تا سال ۲۰۱۸ میزبان وردپرس بوده است و به همین علت عده‌ی زیادی از کاربران و مدیران وب سایت‌ها به این نوع ویرایشگر عادت کرده‌اند.

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

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

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

با اضافه شدن گوتنبرگ در سال ۲۰۱۸ این ویرایشگر توانست معایب ویرایشگر کلاسیک را تا حدی برطرف کند.

ویرایشگر وردپرس ۵ | گوتنبرگ

گوتنبرگ با قابلیت بلوک بندی، پا به دنیای وردپرس گذاشت و امروزه تبدیل به یک ویرایگشر پیشرفته در وردپرس

در گوتنبرگ برای نوشتن یا قرار دادن هر نوع اِلمانی یک بلوک جداگانه درست می‌شود؛ ما در این مقاله استفاده از پرکاربرترین بلوک‌ها و ترفند‌های گوتنبرگ را به شما آموزش خواهیم داد.

نحوه استفاده از ویرایشگر گوتنبرگ

بیاید ویرایشگر جدید وردپرس را با اضافه کردن یک پست جدید بررسی کنیم.

اضافه کردن عنوان

بعد از کلیک بر روی «افزودن نوشته» با صفحه‌ی زیر مواجه می‌شوید؛ در بلوک اول می‌توانید عنوان یا تیتر خود را وارد کنید.

اولین بلوک خود را ایجاد کنید

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

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

همانطور که در بلوک بالا مشاهده کردید شما ‌می‌توانید متن‌های خود را به راحتی چپ‌چین، وسط‌چین و یا راست‌چین کنید. همچنین Bold و Italic هم در نوار ابزار بلوک به راحتی قابل دسترس است.

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

در ویرایشگر گوتنبرگ قابلیت هایلایت و اضافه کردن تصویر به متن در بلوک امکان پذیر شده است.

اما آخرین گزینه تولبار، مربوط به تنظیمات بیشتر بلوک است.

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

تکثیر: این گزینه این امکان را به شما می‌دهد تا بلوک دیگری همانند بلوک حال حاضر خود داشته باشید.

درج در قبلی: این گزینه یک بلوک جدید در بالای بلوک فعلی شما اضافه می‌کند.

درج در بعدی: این گزینه یک بلوک جدید در پایین بلوک فعلی شما اضافه می‌کند.

ویرایش به عنوان HTML: وقتی روی این گزینه کلیک کنید کد‌های خام HTML به شما نمایش داده می‌شود.

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

حذف بلوک: این مورد هم بلوک فعلی شما را حذف می‌کند.

تبدیل بلوک

با کلیک بر روی گزینه اول، قسمت تبدیل به بلوک برای شما ظاهر می‌شود.

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

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

اضافه کردن بلوک جدید

برای اضافه کردن بلوک جدید چند راه‌کار و گزینه پیش روی شماست:

۱- با حرکت نشانگر ماوس به کنار‌ه‌های پایینی یا بالایی بلوک فعلی و ظاهر شدن علامت + می‌توانید بلوک جدید اضافه کنید.

۲- با زدن دکمه Enter از روی صفحه‌کلید به صورت خودکار بلوک بعدی برای شما ایجاد می‌شود.

در این روش در صورتی که بر روی اینتر کلیک کرده باشید بلوک جدیدی ساخته می‌شود.

برای تغییر بلوک از پاراگراف به انواع دیگر کافی است علامت + در سمت راست را کلیک کنید تا اِلمان‌های مختلف برای شما به نمایش در بیاید.

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

همچنین می‌توانید اِلمان‌های مورد نظر خود را با این قابلیت اضافه کنید؛ به عنوان مثال برای اضافه کردن بلوک تصویر کافی است عبارت /تصویر را وارد کنید.

۳- اضافه کردن بلوک از طریق تولبار 

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

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

انتقال بلوک‌

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

برای انتقال بلوک نیازی به کپی کردن بلوک و قرار دادن آن در بلوک دیگر نیست! 

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

با دو روش می‌توانید بلوک‌های خود را به سمت بالا یا پایین انتقال دهید.

• استفاده از فلش‌های رو به بالا و پایین
• استفاده از کلید وسط فلش‌ها

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

پاک کردن یک بلوک در گوتنبرگ

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

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

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

بلوک‌های قابل استفاده مجدد

اگر یک متن تبلیغاتی دارید که می‌خواهید در پست‌های آینده خود از آن استفاده کنید، نیازی به ایجاد دوباره بلوک نیست.

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

نگاهی به دسته‌بندی های پیش فرض گوتنبرگ 

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

بلوک‌های عمومی

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

بلوک‌های قالب بندی شده

بیشتر این بلوک‌ها  developer-friendly هستند و توسعه‌دهندگان وب بیشتر با این بلوک‌ها سر و کار دارند اما شاید بلوک جدول و کشیدن نقل قول برای شما مفید باشد.

بلوک‌های عناصر طرح

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

بلوک‌های ابزارک‌ها

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

بلوک‌های جاسازی(تعبیه شده)

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

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

مروری بر قسمت سند و بلوک سایدبار

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

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

سایدبار سند

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

۱- وضعیت و مشاهده‌پذیری

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

مورد بعدی مربوط به نوع نوشته است: با توجه به محتوای تهیه شده توسط شما می‌توانید میان گالری،تصویر، ویدیو و صوت یکی را انتخاب کنید.

همچنین امکان انتخاب نویسنده،تاریخ انتشار و انتقال به زباله دان در قسمت وضعیت و مشاهده پذیری وجود دارد.

همچنین امکان انتخاب نویسنده،تاریخ انتشار و انتقال به زباله دان در قسمت وضعیت و مشاهده پذیری وجود دارد.

۲- پیوند یکتا

در این قسمت شما می‌توانید URL پست خود را ویرایش یا تغییر دهید. 

به عنوان مثال شما می‌توانید ادرس URL زیر را متناسب با نوشته خود تغییر دهید.

https://mywebsite.com/gutenberg-block-builder

دسته‌ها

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

برچسب‌ها

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

تصویر شاخص

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

چکیده

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

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

نوار کناری بلوک

این نوار بر خلاف نوار سند با توجه به وضعیت بلوک متغییر خواهد بود و شما می‌توانید تنظیمات مربوط به هر بلوک را در این نوار کناری انجام دهید. 

تنظیمات مربوط به متن

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

۱- تنظیمات متن: شما می‌توانید اندازه قلم خود را با استفاده از این گزینه بزرگ‌تر یا کوچک‌تر کنید. 

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

۲- تنظیمات رنگ: در این قسمت همانطور که از نام ‌آن پیداست شما می‌توانید رنگ متن و همچنین رنگ پس زمینه بلوک خود را انتخاب کنید.

۳- پیشرفته: اگر با تنظیمات CSS آشنایی دارید و می‌دانید چگونه یک کلاس را به متن خود اضافه کنید پیشنهاد می‌شود از این قسمت هم استفاده کنید. 

تنظیمات مربوط به تصویر

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

در تنظیم تصویر شما می‌توانید یک تگ Alt به تصویر خود اضافه کنید (تگ Alt در تقویت جایگاه سئوی وب سایت شما تاثیر گذار خواهد بود ). 

همچنین قابلیت تغییر اندازه و ابعاد تصویر هم در این دسته‌ی بندی امکان پذیر خواهد بود. 

سایر بلوک‌ها هم تنظیمات مخصوص و مربوط به خود را دارند که با کمی تغییر می‌توانید کاربرد هر کدام از آن‌ها را بیابید.

جزئیات نوار ابزار

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

۱- بلاک‌ها

اولین دکمه مربوط به اضافه کردن بلوک می‌باشد که با شکل + نمایش داده شده است.

۲- بازگردانی/باز انجام

در این قسمت می‌توانید آخرین تغییراتی را که در صفحه ایجاد کرده‌اید را به مرحله قبل (Undo) و یا به مرحله بعد (Redo) بازگردانید.

۳- ساختار محتوا

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

۴- راهبری بلوک 

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

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

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

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

تنظیمات

وجود دکمه تنظیمات در نوار کناری سایت برای نمایش و عدم نمایش این نوار اضافه شده است و کابرد اساسی دیگری ندارد.

ابزار‌ها و گزینه‌های بیشتر 

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

نمایش 

اولین قسمت مربوط به مجموعه گزینه‌های نمایش است.

۱- نوار ابزار بالا: همانند تصویر زیر تولبار و تنظیمات بلوک‌های شما به بالای صفحه انتقال پیدا می‌کند.

۲- حالت نور افکن: با کم رنگ کردن سایر بلوک‌ها امکان تمرکز بیشتر برای شما فراهم خواهد شد.

۳- حالت تمام صفحه: حالت تمام صفحه امکان حواس پرتی شما در مطلب را به حداقل می‌رساند.

ویرایشگر

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

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

ابزار‌ها

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

گزینه‌ها

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

نتیجه گیری

با ورود گوتنبرگ به وردپرس بسیاری از افراد عکس‌العمل‌های منفی را نسبت به این ویراشگر از خود نشان دادند؛ اما به مرور زمان و با آشکار شدن ویژگی‌های این ویرایشگر، مزایای گوتنبرگ نسبت به ویرایشگر کلاسیک وردپرس نمایان شد.

در پایان بد نیست نگاهی گذرا به مزایا گوتنبرگ نسبت به ویرایشگر کلاسیک وردپرس بیندازیم.

مزایای ویرایشگر گوتنبرگ

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

با توجه به اینکه از سال ۲۰۲۲ وردپرس به طور کلی ویرایشگر کلاسیک وردپرس را حذف خواهد کرد نظر شما در مورد این ویرایشگر چیست؟