آموزش افکت گذاری تصاویر در وردپرس

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

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

آموزش افکت گذاری تصاویر در وردپرس

افزونه افکت تصاویر در وردپرس که قصد معرفی اونو دارم با عنوان Amazing Hover Effects در مخزن وردپرس به ثبت رسیده و تاکنون تونسته بیش از ۴٫۰۰۰ نصب فعال و کسب امتیاز ۴٫۲ را ازآن خودش بکنه که با استفاده از این افزونه قادر به ایجاد هاور بر روی تصاویر و افکت عکس در وردپرس خواهید بود.

 

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

 

 

حالا همونطور که در تصویر میبینید ابتدا یک عنوان برای هاور خودتون انتخاب کنید و سپس از بخش Select Style یکی از استایل‌ها برای هاور تصاویر و افکت گذاری عکس در وردپرس را انتخاب کنید. بعد از این مرحله روی دکمه Add New Hover Item کلیک کنید تا پنجره زیر به شما نمایش داده شده و اطلاعات تصویر را در اون وارد کنید.

 

 

Hover Image: با کلیک روی دکمه اضافه کردن تصویر در این قسمت رسانه وردپرس به شما نشون داده میشه و میتونید تصویر مورد نظر را آپلود کرده و یا اینکه تصویری که از قبل قرار داره را انتخاب کنید.

Title: در این فیلد عنوان تصویر خودتونو وارد کنید.

Description: در این فیلد توضیحاتی که قصد دارید برای تصویر نمایش داده شود را وارد کنید.

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

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

 

 

Select Effect: ابتدا از طریق این گزینه افکت دلخواه خودتون را از بین ۲۰ افکت موجود در افزونه برای اعمال بر روی تصاویر انتخابی را انتخاب کنید.

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

Column Space: در این فیلد فاصله بین ستون با تصویر را بر حسب پیکسل وارد کنید.

Row Space: در این فیلد هم مشابه فیلد بالا اینبار فاصله بین ردیف و تصویر را بر حسب پیکسل وارد کنید.

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

 

 

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

 

 

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

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