آموزش ایجاد تصاویر تعاملی در وردپرس

ضعیفمتوسطخوببسیار خوبعالی
( 0 رای , میانگین : 0٫00 از 5)
بارگذاری...

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

تصاویر تعاملی در وردپرس

تصویر تعاملی چیست؟

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

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

 

ایجاد تصاویر تعاملی در وردپرس

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

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

در ادامه بخوانید:  محدود کردن دسترسی کاربران برای مشاهده دیگر فایل های رسانه

بعد از نصب و فعالسازی افزونه، از منوی سمت راست پیشخوان وردپرس، بخش جدیدی را تحت عنوان Draw Attention مشاهده خواهید کرد. کافی است از قسمت مذکور، بر روی Edit Image کلیک کنید تا بتوانید یک تصویر تعاملی ایجاد کنید.

در نسخه رایگان این افزونه که از مخزن وردپرس دریافت کرده اید، تنها قادر به ایجاد یک تصویر تعاملی هستید، از این رو تنها گزینه موجود، Edit Image است.

 

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

 

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

بعد از انتشار تصویر مذکور، افزونه به شما اجازه میدهد تا تصویر را ویرایش کرده و مناطق خاص را برجسته کرده، رنگ هایی را به آن اضافه کنید و مناطق کانونی خود را بر روی تصویر ترسیم کنید. شما می توانید به قسمت پایین صفحه تحت عنوان Hotspot Areas مراجعه کرده و در clickable area پیش نمایش تصویر مذکور را مشاهده کنید.

تنها کافی است موس خود را روی تصویر مذکور برده و مناطق قابل کلیک بر روی تصویر را ترسیم کنید. شما می توانید به اسانی مناطق کانونی مورد نظر خود را انتخاب کنید.

در ادامه بخوانید:  برای اولین بار،معرفی جامع پیشخوان وردپرس(بخش سوم)

بعد از ترسیم مناطق کانونی، شما میبایست به بخش Action در پایین صفحه رفته و اکشن دلخواه خود برای قسمت انتخاب شده تصویر را انتخاب کنید. اگر گزینه Show More Info را انتخاب کنید، به راحتی می توانید توضیحات دلخواه خود برای منطقه مورد نظر روی تصویر را وارد کنید. شما همچنین میتوانید به منطقه انتخاب شده مذکور، لینک دلخواه خود را بدهید برای این کار کافی است گزینه Go to URL را انتخاب کنید.

شما همچنین می توانید تنظیمات کلی مربوط به تصویر را مدیریت کرده و استایل مربوط به لینک، متن و مواردی از این دست را ویرایش کنید. این تنظیمات به شما در تعاملی تر کردن تصویرتان کمک می کند.

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

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

 

درون ریزی و برون ریزی تصاویر تعاملی

این قابلیت در نسخه رایگان افزونه قابل استفاده نبوده و برای استفاده از آن تنها باید نسخه پولی افزونه را تهیه کنید.

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

در سایت مبدا، شما میبایست از قسمت Draw Attention بر روی Import / Export کلیک کنید و در صفحه مذکور تصاویری که میخواهید از آنها خروجی تهیه کنید را تیک زنید. سپس بر روی دکمه Generate Export Code کلیک کرده و کد ایجاد شده را کپی کنید.

در ادامه بخوانید:  پنالتی شدن سایت (دلایل و راه های پیشگیری از آن)

بعد از آن میبایست به سایت مقصد مراجعه کرده و مطمئن شوید که افزونه نصب و فعال شده است. بعد از آن از قسمت Draw Attention روی Import / Export کلیک کرده و در صفحه مذکور کدی را که پیشتر کپی کرده بودید، در باکس Import وارد کنید.

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

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

 

دانلود افزونه Draw Attention

اطلاعات بیشتر



درباره نویسنده



جواد
( عضو از 2 سال قبل )
  • 220 نوشته
  • 33 دیدگاه
  • 0 محصول
  • 0 دوره آموزشی
جواد - عضو تیم تحریریه مجموعه نوین وردپرس...

نظرات کاربران

ثبت دیدگاه

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

دیدگاهتان را بنویسید

مطالب مرتبط



دسته بندی مطالب

آخرین آپدیت محصولات

اخیرا محصولی بروزرسانی نشده است!

همکار ما شوید

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

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