کار با گوتنبرگ وردپرس gutenberg
در این مقاله کنار شما کاربران عزیز وینزا هستیم با آموزش کار با گوتنبرگ وردپرس و معرفی بخش ها و بلوک های مختلفی که در این ویرایشگر وجود دارد و خواهیم گفت که این بلوک ها چه کار هایی را میتواند انجام دهد و شما چه استفاده هایی از آنها می توانید داشته باشید. خب ما در یک مقاله آموزشی به معرفی کامل گوتنبرگ پرداختیم و آنچه که نیاز بود از گوتنبرگ را و شما کاربران بازگو کردیم که گوتنبرگ چیست و چه خصوصیت و قابلیت هایی دارد اگر این مقاله را مطالعه نکرده اید پیشنهاد می کنیم از طریق لینک انتهای مطلب این مقاله را ببیند.
گوتنبرگ یک ویرایشگر یا ادیتور پیشرفته وردپرس نسخه ۵ که از سوی توسعه دهندگان وردپرس در اختیار مدیران وب سایت ها برای ایجاد صفحات پیشرفته با بلوک بندی های مجزا قرار و جایگزین ادیتور کلاسیک وردپرس شده است. شما می توانید گوتنبرگ را از مخزن وردپرس به صورت رایگان دانلود ، نصب و به عنوان ویرایشگر محتوا استفاده کنید همچنین شما اگر قصد استفاده از گوتنبرگ را نداشته باشید قادر هستید از ویرایشگر کلاسیک استفاده کنید. کافیست از طریق دو گزینه ( گوتنبرگ را امتحان کنید ) و( ویرایشگر کلاسیک را نصب کنید ) کنترل محتوای خود را در دست بگیرید.
اما کار با گوتنبرگ
اگر با افزونه های صفحه ساز گرافیکی مانند ویژوال کامپوزر کار کرده باشید این افزونه کاربردی وردپرس با استفاده از قابلیت و امکاناتی که دارد قادر است هر نوع صفحه با المانهای منحصر به فرد و ظاهری حرفه ای برای شما طراحی کند در این راستا وردپرس با ارائه گوتنبرگ قصد دارد تا خود را جایگزین این نوع صفحه سازها بکند. گوتنبرگ از تکنولوژی جدید با استفاده از جاوا اسکریپت های مانند فریم ورک react همچنین تعدادی افزونه مانند Advanced Custom Fields یا CMB2 که در جعبه‌های متا دارد می تواند صفحاتی همانند ویژوال کامپوزر بر شما طراحی کند که در نوع خود بی‌نظیر است . البته قرار است در نسخه های بعدی قابلیت های جدید و هم چنین از نظر ظاهری تغییرات اساسی داشته باشد.
تفاوت گوتنبرگ با ویرایشگر کلاسیک و کار با گوتنبرگ فارسی
اگر گوتنبرگ را نصب و ظاهر آن را مشاهده نکرده اید پیشنهاد میکنیم گوتنبرگ را نصب کنید و ظاهر آن را ببینید تا بهتر بتوانید گفته های ما را درک کنید البته ما تصاویری هم در کنار توضیحات ارائه کردیم که میتواند به یادگیری شما کاربران عزیز کمک زیادی بکند.
اولین تفاوت و یا تغییری که در گوتنبرگ وجود دارد حذف ادیتور یا ویرایشگر دیداری می باشد و در کنار آن ستونی در سمت راست اضافه شده که بلوک ها را می توانید از طریق این ستون تنظیم کنید.
برای استفاده از gutenberg کافیست با علامت + المانهای مورد نظر خود را انتخاب و از آنها برای نمایش محتوای خود استفاده کنید که در این بخش انواع بلوک وجود دارد که هر کدام قابلیت خاص خود را دارد. برای مثال شما می توانید بلوغ تصویری را به محتوا اضافه کنید یا در بلوک متن ، بلوک عنوان همچنین برای افزودن ویدیو می توانید از المان مربوطه استفاده کنید که هر کدام از اینها با یک کلیک قابل استفاده است.
اما در گوتنبرگ چه بلوکهای وجود دارد
- موجود بودن بلوک پاراگراف ها
- بلوک لیست‌ها
- بلوک نقل قول ، تیترها ، کدها
- بلوک تصاویر
- بکوک گالری تصاویر و ویدیو
- بلوک مربوظ به شورت‌کدها
- بلوک ستون‌ها ، دکمه‌ها
- بلوک ابزارک‌ها
- محیط قطعه کدها
- بوک بندی برای افزودن عنوان نوشته و تصویر و پاراگراف
برای درج عنوان نوشته کافیست روی بلوک مورد نظر عنوان کلیک کرده و متن را اضافه کنید با این کار عنوان محتوای شما مشخص می شود همچنین در کنار انتخاب عنوان در ستون سمت چپ گزینه‌هایی را خواهید داشت که می توانید برای تنظیم عنوان از آنها کمک بگیرید برای مثال شما می توانید اولین حرف عنوان نوشته خود را بزرگتر کنید و …
در نوبت بعدی برای اینکه شما بتوانید نوشته یا همان پاراگراف خود را اضافه کنید لیگ المان پاراگراف کلیک کرده و محتوای خود را درون آن وارد کنید. لازم به ذکر است چنانچه شما در بین هر پاراگراف از تصاویر استفاده می کنید باید بین پاراگراف از بلوک درج تصویر استفده کنید اما در ویرایشگر کلاسیک اینگونه نبود شما می توانستید مقاله خود را به صورت نوشتاری کامل توضیح دهید و در نهایت بین نوشته های خود در هر جایی که دوست داشتید تصویر را از گالری انتخاب و درج می گردید اما در گوتنبرگ باید برای هر یک المانی انتخاب کنید و محتوای تصویر خود را وارد کنید. دقیقاً همانند برگه ساز گرافیکی ویژوال کامپوزر
نکته: شما با درج تصویر در المان مربوط به تصاویر قادر هستید سایز تصاویر خود را مشخص و برای تصاویر خود متن جایگزین یا برچسب تعیین کنید.
توجه: در برخی موارد برخی از کاربران قصد دارند تا ستون کناری را غیرفعال کنند و یا در معرض دید نباشد برای این کار کافیست روی آیکون چرخ دنده که در بالای صفحه قرار دارد کلیک و در این صفحه روی i مخفف info می باشد را انتخاب کنید با این کار شما می توانید بخش های مختلف را به سلیقه خود سفارشی کنید برای مثال افزودن ستون ها ، دکمه ها ، بیشتر ، جدا کننده ها ، فاصله یا page break
قرار دادن ستون در محتوا
در برخی موارد شما نیاز به یک ستون کناری در محتوای خود هستید با استفاده از گوتنبرگ به راحتی می توانید این کار را انجام دهید یعنی داخل محتوای خود یک ستون کناری مشخص کرده و داخل این ستون محتوای مورد نظر خود را وارد کنید برای افزودن ستون کافی است المان beta را انتخاب کنید.
یا با استفاده از بلوک pagebreaker قادر هستید صفحه خود را به دو قسمت تبدیل کنید و همچنین برای افزودن دکمه کافیست روی المان مربوطه کلیک و دکمه را اضافه کنید. لازم به ذکر است که در اینجا استایل مربوط به دکمه ها همان استایلی هستند که در قالب شما تعریف شده است.
اگر شما قصد اضافه کردن ادامه مطلب را دارید از جدا کننده استفاده کنید که در ویرایشگر کلاسیک نیز این امکان وجود داشت و همچنین برای ایجاد فاصله بین بلوک ها باید از بلوک spacer استفاده کنید.
وارد کردن استایل سفارشی یا css
چنانچه اگر قصد دارید در کنار محتوای خود از استایل سفارشی استفاده کنید چهار سایز متفاوت متن و همچنین دیگر استایل های سفارشی وجود دارد که به شرح زیر است:
- .is-small-text : اولین کلاس: نوشته کوچک
- .is-regular-text : دومین کلاس: نوشته متوسط
- .is-large-text : سومین کلاس: نوشته بزرگ
- .is-larger-text :چهارمین کلاس: نوشته خیلی بزرگ
- .wp-block استایل کل بلاک های نوشته
- قابلیت wp-block-{namespace}-{block-name} استایل به شکلی است که می توانید آنرا شخصی سازی کنید
- .wp-block-table استایل بلاک جدول
- .wp-block-quote استایل نقل قول
- .wp-block-columns استایل کلاس ستون ها
- wp-block-verse استایل کلاس شعر
- wp-block-pullquote استایل بلاک نقل قول کشیده
- wp-block-code استایل بلاک کد ها
با استفاده از کدهای سفارشی بالا شما می توانید با استفاده از گوتنبرگ استایل های مورد نظر خود را بر روی محتوای خود پیاده سازی کنید و یک صفحات یا محوایی با ظاهری متفاوت و حرفه ای در سایت نمایش دهید.
چگونه در گوتنبرگ شبکه‌های اجتماعی اضافه کنیم
همان طور که می دانید وجود شبکه های اجتماعی برای اشتراک گذاری محتوا بسیار تاثیرگذار و از نظر سئو بسیار حائز اهمیت است با این کار کاربران می‌توانند محتوای وب سایت شما را در صفحات اجتماعی خود به اشتراک بگذارند و در نهایت منجر به ورودی و بهبود کسب کار می شود. در گوتنبرگ شما می توانید به راحتی با استفاده از ابزار شبکه های اجتماعی برای محتوای خود لینک اشتراک گذاری فیسبوک، توییتر ، گوگل پلاس ، لینکدین ، تامبلر و غیر را اضافه کنید که در نوع خود بسیار حرفه ای است.
سازگاری گوتنبرگ با افزونه یواست
ویرایشگر جدید وردپرس یا همان گوتنبرگ با افزونه سئو سایت سازگاری کامل را دارد از آنجایی که بیش از ۹۰ درصد سایت ها از افزونه یواست برای سئو محتوا و سئو کلی سایت استفاده می کنند گوتنبرگ سازگاری کامل با این افزونه را دارد و شما به راحتی می توانید همانند نسخه کلاسیک ویرایشگر وردپرس از افزونه یواست برای بهینه سازی محتوا سایت خود استفاده کنید.
در این رابطه بخوانید:
منبع: وینزا