خانه / آموزش وردپرس / آموزش پیشرفته ویرایشگر گوتنبرگ وردپرس با معرفی 16 قابلیت کاربردی

آموزش پیشرفته ویرایشگر گوتنبرگ وردپرس با معرفی 16 قابلیت کاربردی

آموزش پیشرفته ویرایشگر گوتنبرگ

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

آموزش 16 قابلیت پیشرفته ویرایشگر گوتنبرگ

تسلط بر بلوک های اولیه

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

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

آموزش پیشرفته ویرایشگر گوتنبرگ

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

استفاده از میانبرهای صفحه کلید

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

آموزش پیشرفته ویرایشگر گوتنبرگ

استفاده از میانبرهای صفحه کلید باعث صرفه جویی در وقت و نوشتن سریعتر متن می شود. شما می توانید با با کلیک کردن بر روی Alt+Shift+h لیستی از میانبرهای صفحه کلید را در یک پنجره پاپ آپ مشاهده کنید.

آموزش قابلیت پیشرفته فاصله انداختن سطرها در ویرایشگر گوتنبرگ

در ویرایشگر گوتنبرگ هنگامی که برای رفتن به خط بعد روی کلید “Enter” کلیک می کنید، ویرایشگر گوتنبرگ آن را به صورت یک بلوک پاراگراف جدید در نظر می گیرد بنابراین به صورت خودکار دو خط فاصله بین خطوط قرار می دهد (با فرض اینکه قالب شما استایل دهی برای آن را داشته باشد که اکثر قالب های خوب وردپرس این استایل دهی را دارند).

اما در حالتی که بخواهید متنی مانند آدرس را وارد کنید و مایل هستید تنها یک خط فاصله بین سطرها ایجاد شود باید کلیدهای SHIFT+ENTER را کلیک کنید. فشردن این کلیدها به وردپرس می گوید که شما می خواهید درون پاراگراف بین خط ها فاصله بیندازید و نمی خواهید یک پاراگراف جدید ایجاد کنید.

آموزش پیشرفته ویرایشگر گوتنبرگ

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

CSS مانند ویژگی فرمت بندی نرم افزار Microsoft Word است. اما به جای کلیک کردن دکمه ها باید کدهای CSS را وارد کنید. انجام دادن این کار اصلاً سخت و آزار دهنده نیست و تنها کاری که باید انجام دهید این است که دستورالعمل هایی که در ادامه آموزش پیشرفته ویرایشگر گوتنبرگ آورده می شود را دنبال کنید.

برای اضافه کردن کدهای CSS سفارشی به قالب خود باید در پیشخوان وردپرس به مسیر نمایش » سفارشی سازی بروید. سفارشی ساز قالب وردپرس به صورت زیر برای شما باز خواهد شد.

آموزش پیشرفته ویرایشگر گوتنبرگ

در این صفحه باید از تب های نشان داده شده در ستون سمت راست روی تب “CSS اضافی” کلیک کنید.

در باکس CSS سفارشی باید کد CSS زیر را وارد کنید.

.post p{line-height: 1.5em;} 

کدهای CSS بالا فاصله گذاری سطرهای پاراگراف محتوا را به 1.5em تغییر می دهند. Em واحد عرض تایپوگرافی است. در کد بالا از کلاس post. استفاده شده که باعث می شود وردپرس به صورت خودکار فاصله گذاری ها را برای محتوای نوشته ها اعمال کند و پاراگراف های بقیه مناطق تحت تأثیر آن قرار نگیرد.

کد بالا تنها فاصله گذاری یک خط را تغییر می دهد. اگر می خواهید فاصله گذاری بین پاراگراف ها را تغییر دهید (یعنی فاصله گذاری دو خط) باید padding اضافه کنید. کد زیر این کار را برای شما انجام می دهد.

.post p { 
line-height: 1.5em;
padding-bottom: 15px;
} 

آموزش قابلیت پیشرفته مرتب سازی مجدد صفحه ویرایش در ویرایشگر گوتنبرگ

ویرایشگر گوتنبرگ وردپرس یک رابط کاربری ساده و راحت است که ایجاد محتوا را بسیار آسان می کند. این ویرایشگر یک نوار ابزار در بالای بلوکی که در حال ویرایش آن هستید، نشان می دهد.

آموزش پیشرفته ویرایشگر گوتنبرگ
  1. شما می توانید این نوار ابزار را با کلیک کردن روی منو سه نقطه در گوشه سمت چپ بالای صفحه و سپس کلیک کردن روی تب “نوار ابزار بالا” پنهان کنید.
  2. هنگامی که روی یک بلوک قرار دارید بقیه بلوک ها به صورت کم رنگ نشان داده می شوند. این ویژگی برای این است که تمرکز شما روی بلوکی باشد که در حال ویرایش آن هستید. شما می توانید این ویژگی را با کلیک بر روی تب “حالت نورافکن” خاموش کنید.
  3. اگر به فضای خالی بیشتری در صفحه نیاز دارید می توانید به “حالت تمام صفحه” سوئیچ کنید. در این حالت فقط نوار ابزار را در بالای صفحه مشاهده می کنید.
  4. شما می توانید با کلیک بر روی آیکون تنظیمات در گوشه سمت چپ بالای صفحه ستون تنظیمات را آشکار یا پنهان کنید.

تغییر دادن اندازه فونت در ویرایشگر بصری وردپرس

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

آموزش پیشرفته ویرایشگر گوتنبرگ

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

اضافه کردن تیتر به مقالات

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

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

آموزش پیشرفته ویرایشگر گوتنبرگ

همچنین می توانید به تیتر خود لینک اضافه کنید یا آن را بولد یا ایتالیک کنید.

اضافه کردن ستون به نوشته ها

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

کافی است یک بلوک ستون انتخاب کرده و آن را به ویرایشگر خود اضافه کنید. شما می توانید از قسمت تنظیمات ستون تعداد ستون ها را انتخاب کنید.

آموزش پیشرفته ویرایشگر گوتنبرگ

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

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

قرار دادن تصویر در کنار متن

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

این بلوک به شما اجازه می دهد یک تصویر در کنار بلوک متن اضافه کنید. این بلوک به صورت خودکار عرض و فاصله گذاری بین دو بلوک را تنظیم می کند.

آموزش پیشرفته ویرایشگر گوتنبرگ

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

آموزش قابلیت پیشرفته اضافه کردن ویدئوها به ویرایشگر گوتنبرگ وردپرس

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

بهترین کار برای اضافه کردن ویدئو به سایت وردپرسی خود آپلود کردن آنها در یوتیوب و دیگر سایت های مشابه و جاسازی کردن ویدئوها در نوشته ها و برگه ها است.

آموزش پیشرفته ویرایشگر گوتنبرگ

شما می توانید از بلوک YouTube برای پیست کردن URL ویدئوی مورد نظرتان استفاده کنید. وردپرس آن را به صورت خودکار برای شما جاسازی می کند. همچنین می توانید URL ویدئو را مستقیماً در پاراگراف یا هر بلوک متنی دیگری پیست کنید و وردپرس به صورت خودکار آن را به بلوک YouTube تبدیل می کند.

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

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

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

آموزش پیشرفته ویرایشگر گوتنبرگ

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

بلوک جدول وردپرس برای ساخت جدول های ساده و غیر حرفه ای مناسب است اما ویژگی های پیشرفته ساخت جدول را ندارد. به عنوان مثال نمی توانید ردیف تیتر درست کنید، ستون ها را مرتب کنید، ردیف ها را هایلایت کنید و بسیاری موارد دیگر.

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

اضافه کردن دکمه به نوشته ها و برگه ها

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

ویرایشگر محتوا دارای یک بلوک دکمه است که به شما کمک می کند یک دکمه به محتوای خود اضافه کنید. سه استایل برای دکمه می توان در نظر گرفت: مربعی، گرد (پیش فرض) و خارج خط.

آموزش پیشرفته ویرایشگر گوتنبرگ

همچنین می توانید پس زمینه، رنگ متن و جهت گیری دکمه در مرکز، راست و چپ صفحه را تنظیم کنید.

اضافه کردن تصویر رویه به نوشته های وردپرس

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

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

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

آموزش قابلیت پیشرفته تغییر رنگ های پاراگراف در ویرایشگر گوتنبرگ

یکی دیگر از ویژگی های جذاب ویرایشگر گوتنبرگ امکان تغییر دادن رنگ بلوک ها است. با تغییر دادن رنگ بلوک ها می توانید توجه خوانندگان را جلب کرده و قسمت های مهم متن را هایلایت کنید.

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

آموزش پیشرفته ویرایشگر گوتنبرگ

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

اضافه کردن ابزارک ها به نوشته ها

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

آموزش پیشرفته ویرایشگر گوتنبرگ

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

آموزش قابلیت پیشرفته اضافه کردن HTML سفارشی به نوشته ها در ویرایشگر گوتنبرگ

ویرایشگر محتوای وردپرس یک ویرایشگر WYSIWYG بصری کامل است. اما می توانید کدهای HTML را در صورت نیاز در آن استفاده کنید.

آموزش پیشرفته ویرایشگر گوتنبرگ

ساده ترین راه برای انجام این کار اضافه کردن بلوک HTML سفارشی به نوشته شما است. پس از آن می توانید کد HTML مورد نظر خود را در آن پیست کنید.

پیدا کردن تعداد کلمات و دیگر آمارهای نوشته

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

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

آموزش پیشرفته ویرایشگر گوتنبرگ

و در کنار آن دکمه ناوبری بلوک قرار دارد که تمام بلوک هایی که در متن استفاده کرده اید را به شما نشان می دهد. می توانید روی هر بلوک کلیک کنید تا مستقیماً به آن بلوک هدایت شوید.

آموزش پیشرفته ویرایشگر گوتنبرگ

امیدواریم آموزش 16 قابلیت پیشرفته ویرایشگر گوتنبرگ در سایت مدیر وردپرس توجه شما را جلب کرده و به شما کمک کرده باشد تا راحت تر و حرفه ای تر با این ویرایشگر زیبا و جذاب کار کنید.

امتیاز دادن به این نوشته:
  • میزان رضایت کاربران
  • تصاویر مرتبط
  • میزان خوانایی متن

درباره ی مینا قدسی

مطلب پیشنهادی

افزونه های انتقال سایت وردپرس

بهترین افزونه های انتقال سایت وردپرس به هاست جدید یا لوکال هاست

در این مقاله افزونه هایی را به شما معرفی می کنیم که کار انتقال سایت …

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *