استفاده از گوتنبرگ – ویرایشگر بلوک وردپرس ایجاد یک پست یا صفحه وبلاگ جدید نحوه اضافه کردن بلوک در گوتنبرگ کار با بلوک ها در…
آنچه در این مطلب خواهید خواند
هنگامی که وردپرس ۵.۰ در سال ۲۰۱۹ منتشر شد، ویرایشگر قدیمی کلاسیک را با یک ویرایشگر بلوک جدید با نام مستعار “گوتنبرگ” جایگزین کرد. ویرایشگر بلوک روشی متفاوت برای ایجاد محتوا در وردپرس معرفی کرد.
در این آموزش، ما به شما نشان خواهیم داد که برای ایجاد پست ها و صفحات وبلاگ چگونه از ویرایشگر بلوک وردپرس استفاده کنید.
قبل از اینکه وارد ویرایشگر بلوک شویم، ابتدا تفاوت های بین ویرایشگر گوتنبرگ و ویرایشگر کلاسیک قدیمی را مقایسه می کنیم.
در اینجا محیط ویرایشگر کلاسیک در وردپرس را مشاهده می کنید:
و محیط ویرایشگر بلوک جدید وردپرس :
همانطور که می بینید، دو ویرایشگر کاملا متفاوت برای ایجاد محتوا در وردپرس هستند.
ویرایشگر کلاسیک قدیمی یک ویرایشگر متن با دکمه های قالب بندی بسیار شبیه به Microsoft Word بود.
در ویرایشگر جدید از روند متفاوتی استفاده شده که «Blocks» نامیده می شود (و Block Editor نام دیگرش می باشد).
هر موردی که به پست یا صفحه اضافه شود یک بلوک بوده، که جزء عناصر محتوایی هستند. برای ایجاد طرح بندی محتوا به صفحه ویرایش اضافه می شوند.
می توان بلوک ها را برای هر پاراگراف، تصاویر، ویدیوها، گالریها، صداها، فهرست ها و موارد دیگر و افزونه های وردپرس بیشتری میتوان اضافه کرد.
ویرایشگر بلوک وردپرس یک راه ساده برای افزودن انواع مختلف محتوا به پست ها و صفحات را ارائه می دهد. به عنوان مثال، قبلاً اگر قصد اضافه کردن یک جدول به محتوای خود را داشتید باید از افزونه جداول جداگانه استفاده می کردید.
با ویرایشگر بلوک، می توان به سادگی یک بلوک جدول اضافه، ستون ها و ردیف ها را انتخاب و شروع به اضافه کردن محتوا کرد.
مهمتر از همه، استفاده و یادگیری از ویرایشگر بلوک وردپرس بسیار آسان است.
به همه مبتدیان وردپرس که به تازگی اولین وبلاگ خود را راه اندازی یا سایت کسب و کار DIY می سازند، مزیت بسیار زیادی می دهد.
آنچه در آموزش گوتنبرگ پوشش خواهیم داد:
آماده باشید.
طراحی ویرایشگر بلوک به گونه ای بوده که هم بصری و انعطاف پذیر، هم تمام کارهایی که در ویرایشگر کلاسیک می توانستید انجام دهید را در خودش جای داده با اینکه متفاوت از ویرایشگر قدیمی وردپرس به نظر می رسد.
حال با پوشش دادن کارهای اساسی که در ویرایشگر کلاسیک انجام دادید و نحوه انجام آنها در ویرایشگر بلوک شروع کنیم.
شما مانند همیشه یک پست وبلاگ یا صفحه جدید ایجاد کنید، به راحتی روی منوی Posts » افزودن نوشته در مدیر وردپرس خود یا اگر در حال ایجاد یک صفحه هستید، روی منوی Pages » افزودن نوشته کلیک کنید.
با این کار ویرایشگر بلوک راه اندازی می شود.
اولین بلوک هر پست یا صفحه، عنوان آن است.
می توان از ماوس برای حرکت به زیرعنوان یا کلید tab روی صفحه کلید استفاده کرد تا مکان نما پایین آمده و شروع به نوشتن کنید.
به طور پیش فرض، بلوک بعدی یک بلوک پاراگراف است که کاربران می توانند شروع به نوشتن کنند.
با این حال، اگر می خواهید چیزی متفاوت اضافه کنید، می توانید روی دکمه اضافه کردن بلوک جدید (+) در گوشه بالا سمت چپ ویرایشگر، زیر بلوک موجود، یا در سمت راست یک بلوک کلیک کنید.
با کلیک بر روی دکمه، منوی بلوک افزودن با نوار جستجو در بالا و بلوک های رایج در زیر نمایش داده می شود.
می توان روی برگه ها کلیک کرد تا دسته های بلوک را مرور یا یک کلمه کلیدی برای جستجوی سریع بلوک تایپ کنید.
اگر نمی خواهید از ماوس برای کلیک روی دکمه استفاده کنید، می توانید از میان بر صفحه کلید با تایپ / برای جستجو و اضافه کردن یک بلوک استفاده کنید.
هنگام نوشتن یک بلوک را انتخاب و اضافه کنید.
هر بلوک دارای نوار ابزار مخصوص به خود که در بالای آن ظاهر میشود و دکمه های موجود در نوار ابزار، بسته به بلوکی که در حال ویرایش هستید، تغییر می کنند.
به عنوان مثال، در این اسکرین شات، ما در یک بلوک پاراگراف کار می کنیم که دکمه های قالب بندی اولیه مانند تراز متن، پررنگ، ایتالیک، درج پیوند و موارد دیگر را نشان می دهد.
علاوه بر نوار ابزار، هر بلوک می تواند تنظیمات بلوک مخصوص به خود را نیز داشته باشد که در ستون سمت راست صفحه ویرایش شما ظاهر خواهد شد.
می توان بلوک ها را به راحتی با کشیدن آن ها یا با کلیک روی دکمه های بالا و پایین در کنار هر بلوک به بالا و پایین حرکت داد.
ویرایشگر بلوک ابزارهای مفیدی برای مدیریت و سازماندهی طرح بندی محتوا دارد.
می توانید با کلیک روی آن ها و فشردن کلید SHIFT روی کیبورد، چندین بلوک را انتخاب کنید.
پس از آن، روی دکمه نوع بلوک در نوار ابزار کلیک کرده تا بلوک های انتخاب شده به Groups یا Columns تبدیل شوند.
سپس می توانید برای کل بلوک گروه استایل هایی مانند تغییر هم ترازی یا فاصله آن ها را اعمال کنید.
ویرایشگر بلوک این امکان را فراهم کرده تا یک بلوک خالی Group یا Columns اضافه و پس از آن می توانید آن ها را با بلوک های دیگر پر کنید.
سپس می توان هر ستون را با هر نوع بلوکی پر کرد که تا چیدمان زیبایی ایجاد کنید.
یکی از بهترین نکات در مورد بلوک ها این است که می توان آن ها را ذخیره و دوباره مورد استفاده قرار داد. این امر به ویژه برای صاحبان سایت ها و وبلاگ نویسانی مفید است که اغلب نیاز به افزودن محتوای خاص به مقالات یا صفحات خود دارند.
به راحتی روی دکمه منو واقع در گوشه سمت راست نوار ابزار هر بلوک کلیک کرده و از منو، گزینه «افزودن به بلوک های قابل استفاده مجدد» را انتخاب کنید.
نامی برای بلوک قابل استفاده مجدد خود انتخاب کرده تا بعدا بتوانید آن را شناسایی و مجددا استفاده کنید.
ویرایشگر، بلوک را به عنوان یک بلوک قابل استفاده مجدد ذخیره می کند.
حالا که بلوک ذخیره شده، ببینید که چگونه بلوک قابل استفاده مجدد را به سایر پست ها و صفحات وردپرس در سایت خود اضافه کنید.
پست یا صفحه ای را که قصد اضافه کردن بلوک قابل استفاده مجدد را دارید، ویرایش کرده و از صفحه ویرایش پست، روی دکمه افزودن بلوک کلیک کنید.
بلوک ذخیره شده خود را در زیر تب (Reusable) خواهید یافت و همچنین می توان با تایپ نام آن در نوار جستجو، آن را پیدا کنید.
برای مشاهده پیش نمایش سریع بلوک، می توان ماوس را روی آن برد و به راحتی روی بلوک کلیک کرد تا آن را در پست یا صفحه خود درج کنید.
همه بلوک های قابل استفاده مجدد در پایگاه داده وردپرس ذخیره شده و با کلیک بر روی پیوند(manage all reusable blocks) آنها را مدیریت کرد.
این کار شما را به صفحه مدیر بلوک رسانده که می توان هر یک از بلوک های قابل استفاده مجدد خود را ویرایش، حذف، بلوک دیگری صادر و در هر وب سایت وردپرسی دیگری استفاده کنید.
توجه: می توان از کل گروه ها و ستون ها نیز به عنوان بلوک های قابل استفاده مجدد استفاده وکل بخش ها را ذخیره که در صورت نیاز از آنها استفاده کنید.
هر پست وردپرس، حاوی متا دیتاهای زیادی بوده که شامل اطلاعاتی مانند تاریخ انتشار، دسته ها و برچسب ها، تصاویر برجسته و موارد دیگر می شود که همه این گزینه ها درستون سمت راست در صفحه ویرایشگر قرار می دارند.
پلاگین های وردپرس می توانند از API ویرایشگرهای بلوکی برای یکپارچه سازی تنظیمات خود در صفحه ویرایش بهره ببرند.
برخی از پلاگین های محبوب، بلوک های مخصوص به خود را دارند؛ به عنوان مثال، WPForms، بهترین پلاگین سازنده قالب وردپرس که اجازه می دهد تا با استفاده از یک بلوک، فرم ها را به محتوای خود اضافه کنید.
به این ترتیب All in One SEO برای وردپرس به شما اجازه می دهد تا تنظیمات SEO خود را در ویرایشگر بلوک ویرایش کنید:
همچنین WooCommerce دارای بلوک هایی است که می توانید به راحتی به هر یک از پست ها و صفحات وردپرس خود اضافه کنید.
در واقع ویرایشگر بلوک توانایی انجام تمام کارهای ویرایشگر کلاسیک را دارد اما کارها را سریع تر و زیباتر از قبل انجام خواهید داد.
یک بلوک تصویر آماده برای استفاده در ویرایشگر بلوک وردپرس وجود دارد که به راحتی بلوک را اضافه و یک فایل تصویری را آپلود یا از کتابخانه رسانه انتخاب کنید.
همچنین می توانید تصاویر را در سیستم خود بکشید و رها کنید تا ویرایشگر به طور خودکار یک بلوک تصویر برای آن ایجاد کند. زمانی که یک تصویر را اضافه کردید، می توان تنظیمات بلوک را مشاهده که در آن متا دیتا را برای تصویرمانند متن جایگزین، اندازه، و پیوندی اضافه کنید.
دارای چندین بلوک که می توان متن را اضافه کرد و رایج ترین مورد استفاده، بلوک پاراگراف که با دکمه درج پیوند در نوار ابزار همراه است.
دیگر بلوک های متنی رایج نیز شامل یک دکمه لینک در نوار ابزار هستند.
با استفاده از میانبر صفحه کلید که Command + K برای مک و CTRL + K در سیستم های ویندوز پیوندی را وارد کنید.
بلوک گالری مانند بلوک تصویر عمل می کند؛ آن را اضافه و سپس فایل های تصویری را آپلود یا انتخاب می کنید.
همه کدهای کوتاه درست مانند ویرایشگر کلاسیک عمل میکند که به راحتی آنها را به یک بلوک پاراگراف اضافه یا از بلوک کد کوتاه استفاده کنید.
ویرایشگر گوتنبرگ قول داده با معرفی چند بلوک جدید، برخی از مشکلات استفاده طولانی مدت در وردپرس را حل کند.
در زیر برخی از موارد آورده شده برای کاربران بسیار مفید خواهند بود.
با استفاده از ویرایشگر قدیمی، بسیاری از کاربران قادر به قرار دادن یک تصویر در کنار متن نبودند اکنون این کار را با بلوک Media & Text انجام دهید.
این بلوک ساده دارای دو بلوک که در کنار هم قرار گرفته اند واین امکان را می دهد که به راحتی یک تصویر با چند متن در کنار آن اضافه کنید.
اضافه کردن یک دکمه به پست ها یا صفحات وبلاگ یکی دیگرازمشکلات ویرایشگر قدیمی بود. برای ایجاد یک کد کوتاه دکمه یا باید ازیک پلاگین استفاده می شد، یا باید به حالت HTML تغییر و کد می نوشتید. گوتنبرگ یک بلوک دکمه ای دارد که اجازه می دهد به سرعت یک دکمه را به هر پست یا صفحه اضافه کنید.
می توان پیوندی برای دکمه خود اضافه که رنگ ها و موارد دیگررا تغییردهید. برای جزئیات بیشتر، مقاله ما را در مورد نحوه اضافه کردن آسان دکمه ها در وردپرس ببینید.
ویژگی جالب بعدی بلوک (Cover) است که می توان تصاویر کاور یا پوشش پس زمینه رنگی را به پست ها و صفحات خود اضافه کنید.
یک تصویر جلد تصویر گسترده تری است که اغلب به عنوان یک پوشش برای یک بخش جدید در یک صفحه یا ابتدای یک داستان استفاده می شود. آن ها زیبا به نظر می رسند واجازه ایجاد چیدمان محتوای جذاب را می دهند.
به سادگی یک بلوک پوششی اضافه انتخابی خود را آپلود کنید. می توانید یک رنگ پوشش را انتخاب یا آن را به یک تصویر پس زمینه ثابت تبدیل کنید تا وقتی کاربران به پایین صفحه می روند، اثر پارالاکس ایجاد شود.
برای جزئیات بیشتر، مقاله ما را در مورد تفاوت بین تصاویر جلد و ویژگی های تصویر در وردپرس ببینید.
ویرایشگر کلاسیک دکمه ای برای اضافه کردن جداول به پست های وردپرس نداشت. باید از یک افزونه یا یک جدول برای نوشتن CSS و HTML سفارشی ایجاد میشد.
ویرایشگر گوتنبرگ دارای یک بلوک جدول پیش فرض است که اضافه کردن جداول به پست ها و صفحات را بسیار آسان می کند که به راحتی یک بلوک را اضافه وتعداد ستون ها و ردیف هایی را که می خواهید انتخاب کنید.
حالا می توان شروع به اضافه کردن داده ها به ردیف های جدول ودرصورت نیازردیف ها و ستون های بیشتری کنید. همچنین دو گزینه سبک پایه در دسترس می باشد.
ایجاد محتوای چند ستونی مسئله دیگری که ویرایشگر کلاسیک اصلا از پس آن برنیامد. ویرایشگر بلوک این امکان را می دهد زمانی که یک بلوک ستون اضافه کنید دو ستون از بلوک های پاراگراف را اضافه می کند.
این بلوک ستونی کاملاً انعطاف پذیری بوده طوری که می توان تا ۶ ستون در یک ردیف اضافه وحتی از بلوک های دیگر در داخل هر ستون استفاده کرد.
با نگاهی به ویرایشگر بلوک، ممکن است از خود بپرسید که آیا زمان بیشتری را صرف افزودن و تنظیم بلوک ها نسبت به ایجاد محتوای واقعی خواهید کرد یا خیر؟
خوب، ویرایشگر بلوک فوق العاده سریع و حتی استفاده بسیار ابتدایی برای چند دقیقه این امکان را می دهد که فورا بلوک ها را بدون حتی فکر کردن اضافه کنید. که با این رویکرد سرعت کارچقدر سریعتر می شود.
برای استفاده کنندگان از این افزونه نکاتی وجود دارد که حتی سریع تر با ویرایشگر بلوک وردپرس کار کنید.
به اسکرین شات های بالا دقت کنید که نوار ابزاری در بالای هر بلوک ظاهر می شود که می توان آن را به بالای ویرایشگر منتقل کنید.
به راحتی روی دکمه سه نقطه در گوشه سمت راست بالای صفحه کلیک و گزینه Top Toolbar را انتخاب کنید.
گوتنبرگ چندین میان برمفید دارد که روند کاررا بهبود می بخشد. اولین موردی که باید بلافاصله شروع به استفاده از آن کنید، / را وارد وشروع به تایپ کرده که بلوک های مطابق را به شما نشان می دهد که می توانید فوراً اضافه کنید.
برای میانبرهای بیشتر، روی منوی سه نقطه در گوشه سمت راست بالای صفحه کلیک و سپس «میانبرهای صفحه کلید» را انتخاب کنید.
با این کار لیستی از تمام میانبرهای صفحه کلید که می توان از آن ها استفاده کنید، ظاهر خواهد شد. این لیست میانبرهای مختلفی برای کاربران ویندوز و مک خواهد داشت.
گوتنبرگ این قابلیت را گذاشته زمانی که فقط فایل ها را در هر نقطه از صفحه بکشید، رها کنید به طور خودکار یک بلوک ایجاد می کند.
وقتی یک تصویر یا یک فایل ویدئویی را رها کنید، آن بلوک را ایجاد می کند. حتی می توان چندین فایل تصویری را برای ایجاد یک بلوک گالری رها کنید.
ویرایشگر بلوکی تعبیه محتوای سوم شخص در محتوای وردپرس را آسان تر می کند و بلوک هایی برای همه سرویس های محبوب شخص ثالث وجود دارد.
با این حال، در هر نقطه فقط URL تعبیه شده را کپی و پیست کرده که به طور خودکار یک بلوک ایجاد شود.
به عنوان مثال، اگر URL ویدیوی YouTube را اضافه کنید، به طور خودکار یک بلوک جاسازی ایجاد و ویدیو را نمایش می دهد.
برای استوری های فیسبوک و اینستاگرام به مقاله ما در مورد نحوه نصب پست های فیسبوک و اینستاگرام در وردپرس مراجعه کنید.
ویرایشگر بلوک در وردپرس به توسعه دهندگان اجازه ایجاد بلوک های خود را می دهد.
پلاگین های وردپرس فوق العاده ای وجود دارند که بسته های بلوکی را برای ویرایشگر جدید ارائه می دهند.در اینجا به چند مورد اشاره می کنیم:
Ultimate Addons for Gutenberg یک کتابخانه بلوک است که دارای بلوک های پیشرفته بسیاری برای کمک به اضافه کردن عناصر طراحی بیشتری به محتوای خود می باشد.
Ultimate Addons که توسط افراد پشت تم محبوب وردپرس Astra ایجاد شده می توان طرح های زیبایی را بدون نوشتن کد ایجاد کنید.
PublishPress Blocks یکی دیگر از کتابخانه های قدرتمند بلوک، که با بلوک های اضافی برای گسترش ویرایشگر گوتنبرگ همراه بوده و شامل گزینه های طرح بندی زیبا، لغزنده، دکمه ها، نمادها، گالری تصاویر، نقشه ها، برگه ها، توصیفات، آکاردئون ها و موارد دیگر است.
Stackable – بلوک های گوتنبرگ مجموعه ای از بلوک های گوتنبرگ با طراحی زیبا که می توان در وب سایت خود از آنها استفاده کنید. این شامل بلوکهایی برای کانتینر، پستها، شبکه ویژگیها، آکاردئون، جعبه تصویر، فهرست آیکونها، فراخوان برای اقدام و موارد دیگر است.
از زمانی که گوتنبرگ ویرایشگر پیشفرض وردپرس شد، سوالات زیادی برای ما مطرح که در اینجا پاسخ برخی از آن ها را آورده ایم.
پست ها و صفحات قدیمی شما کاملاً ایمن وتحت تأثیر ویرایشگر بلوک قرار نگرفته وقابل ویرایش بوده، ویرایشگر بهطور خودکار آنها را در بلوکی حاوی ویرایشگر کلاسیک باز میکند.
آن ها را درون ویرایشگر قدیمی می توان ویرایش یا مقالات قدیمی تر را به بلوک تبدیل کرده و از ویرایشگر بلوک استفاده کنید.
بله، ویرایشگر قدیمی قابل استفاده می باشد و به سادگی افزونه Classic Editor را نصب و فعال کنید.
پس از فعالسازی، ویرایشگر بلوک را غیرفعال وازویرایشگر کلاسیک استفاده کنید.
لطفا توجه داشته باشید که ویرایشگر کلاسیک تا سال ۲۰۲۲ پشتیبانی می شود. بهتر است از ویرایشگر بلوک استفاده کنید.
پروژه گوتنبرگ برای مدت طولانی در دست توسعه بوده که موقعیت خوبی را به نویسندگان افزونه و تم داد تا کدهای خود را برای سازگاری آزمایش کنند.
با این حال، هنوز این احتمال وجود دارد که برخی از افزونه ها و تم ها با ویرایشگر بلوک به خوبی کار نکنند. در این صورت، میتوان افزونه ویرایشگر کلاسیک را نصب و از توسعهدهنده در خواست پشتیبانی کنید، یا یک افزونه یا موضوع جایگزین پیدا کنید.
بهترین پلتفرم برای یادگیری ویرایشگر بلوک وردپرس است. ما parsavesta.com بزرگترین سایت منبع وردپرس در اینترنت هستیم.
ما مقالات جدیدی را منتشرو منابع قدیمی خود را به روز می کنیم تا به شما در تسلط بر ویرایشگر بلوک کمک کنیم.
در ضمن، در صورت داشتن هر گونه سوال، با ارسال نظر یا با استفاده از فرم تماس در وب سایت، با ما در میان بگذارید.
امیدواریم این آموزش گوتنبرگ به شما کمک کند تا نحوه استفاده از ویرایشگر بلوک وردپرس را یاد بگیرید. همچنین راهنمای عملکرد کامل وردپرس ما برای بهبود سرعت وب سایت خود را ببینید، یا مقایسه ما از بهترین خدمات ایمیل مارکتینگ برای مشاغل کوچک را بررسی کنید.
اگر سوالی داشتید یا نیاز به راهنمایی بیشتر میتوانید با واحد پشتیبان ما درمیان بگذارید.