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

 

 

 svg چییست ؟؟؟

واژه SVG مخفف Scalable Vector Graphics به معنای «تصاویر برداری مقایس‌پذیر» است.

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

توضیح svg به زبان ساده تر

تصاویر SVG چون بر مبنای عدد و نسبت هستند، به پیکسل‌ها وابستگی‌ای ندارند و در هر مقیاسی بدون افت کیفیت نمایش داده می‌شوند. تصاویر توسط کنسرسیوم جهانی وب (W3C) به صورت یک استاندارد پذیرفته شده‌اند و هم اکنون حدود ۸۵٪ از مرورگرهای موجود از آن‌ها پشتیبانی می‌کنند.

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

این تصاویر همچنین امکان استفاده از انیمیشن را در ساختار خود دارند. با توجه به اینکه تصاویر با ساختار XML تولید می‌شوند، توسط جاواسکریپت و دیگر زبان‌های برنامه‌نویسی که امکان پردازش XML و DOM را دارند، می‌شود آن‌ها را به سادگی تغییر داد. یکی دیگر از مزیت‌های استفاده از این تصاویر اینست که با توجه به اینکه این تصاویر بر اساس خطوط و cهندسی رسم می‌شوند، نتیجه حاصل ازین تصاویر فاقد مشکل تاری نیم پیکسلی است.

خب توضیحاتی زیادی رو در موردش دادیم حالا ما می خواهیم این امکان رو فراهم کنیم که در وردپرس شما از این تصاویر استفاده کنید با استفاده از افزونه  این قابلیت رو افزونه (Scalable Vector Graphics (SVG به وردپرس شما می افزاید

کار کردن با افزونه (Scalable Vector Graphics (SVG

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

فیلم آموزشی افزونه (Scalable Vector Graphics (SVG

چرا در این مقاله تصمیم گرفتیم افزونه Woo Product Carousel and Zoom رو انتخاب کنیم !!!

 

 

 

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

خلاصه یه افزونه یافتم به اسم افزونه Woo Product Carousel and Zoom من خودم مجذوبش شدم این افزونه هنوز طرفداری زیادی نداره ولی واسه چنین کاری مناسبه افزونه انگلیسی می باشد و فارسی سازی نشده در صورتی که مشکلی داشتیدید دیتا وردپرس همیشه دوست و همراه شما می باشد در بخش پشتیبانی از ما کمک بگیرید

 

توضیحات کلی در مورد افزونه

بعد از اینکه در قسمت افزودن افزونه را اضافه کردید آن را فعال کنید سپس به روی گزینه ووکامرس برید یک پنجره برای شما نمایان می شود که داخل این یک گزینه اسم Woo Product Carousel and Zoom وجود دارد به روی آن کلیک کنید

زبانه های افزونه

• carousel options
• zoom options

در زبانه ی carousel options فعال کردن یا غیر فعال کردن , رنگ و اندازه زوم و …. مشخص میکنیم این قسمت خیلی مهم و کاربردی است به درستی تنظیم کنید

در زبانه zoom options در این قسمت ما مشخص می کنیم زمانی که به روی عکس زوم میکنم زوم به روی خودش نمایش داده شود یا در قسمت راست صفحه نمایان شود