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

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

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

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

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

• تصویر
• گالری
• رسانه و متن
• رویه
• تصویر درونی

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

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

قرار دادن عکس در وردپرس با بلوک تصویر

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

بلوک خالی تصویر به صورت زیر برای شما باز می شود.

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

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

• تصویر را از هر محتوایی که می خواهید کپی کنید، یا
• تصویر را با مکان نما موس بکشید

و سپس تصویر انتخاب شده را در مکان مورد نظر خود پیست یا رها کنید.

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

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

شما می توانید سه گزینه برای تغییر چینش بلوک تصویر خود انتخاب کنید:

• چپ چین
• میان چین
• راست چین

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

تغییر اندازه تصویر

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

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

نقطه های آبی در لبه تصویر به شما امکان تغییر اندازه تصویر را می دهد.

لینک دار کردن تصاویر در وردپرس

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

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

سئو کردن تصویر و اضافه کردن متن alt

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

خوشبختانه وردپرس افزونه هایی دارد که این فرآیند را آسان کرده و زحمت نویسندگان را کم می کند. افزونه SEO Optimized Images  به این منظور طراحی شده و به شما امکان می دهد ویژگی های alt و title را به صورت پویا به تصاویر خود اضافه کنید. توجه داشته باشید که بهتر است تصاویر سایت وردپرس خود را قبل از اینکه آنها را در سایت آپلود کنید، تغییر اندازه دهید؛ در غیر این صورت سایت بسیار کندی خواهید داشت.

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

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

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

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

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

 

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

قرار دادن دو عکس در کنار هم در ویرایشگر گوتنبرگ وردپرس

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

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

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

جمع بندی

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

امیدواریم این آموزش مورد توجه شما قرار گرفته باشد.