نقد و بررسی افزونه MapSVG: نقشه های تعاملی را در وردپرس ایجاد کنید

نقد و بررسی افزونه MapSVG: نقشه های تعاملی را در وردپرس ایجاد کنید

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


در این بررسی ، ما به ویژگی هایی که MapSVG را به یکی از بهترین افزونه های نقشه برداری برای وردپرس در وب تبدیل می کند ، نگاه می کنیم. ما همچنین افزونه درایو را تست می کنیم ، بنابراین بچرخید و تمام راه را تا انتها بخوانید. مطمئناً این یک معامله خوب است ، بنابراین خودتان یک لیوان قهوه تهیه کنید و بگذارید سرخ شود.

نقشه های تعاملی MapSVG برای وردپرس

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

100+ نقشه های آماده

برای کمک به شما در زمین در حال اجرا ، MapSVG با بیش از 100 نقشه جغرافیایی کالیبره شده همراه است. نقشه جهانی وجود دارد ، و از قبل به مناطق قابل کلیک (کشورها) تقسیم شده است. سپس نقشه های کشور را با ایالت ها و استان های مربوطه در اختیار دارید. شما همچنین می توانید چند نقشه ویژه دریافت کنید.

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

تمام کاری که شما باید انجام دهید اینست که با استفاده از هر نرم افزار ویرایش برداری مانند Inkscape یا Adobe Illustrator ، یک تصویر SVG ایجاد کنید ، چیز لعنتی را بارگذاری کنید و سفارشی سازی کنید.

آیا می دانید این به چه معناست؟ این بدان معناست که شما می توانید نمودارهای تعاملی را طراحی کرده و آمار را تجسم کنید (و به طور کلی تجربه کاربر را بهبود بخشید) بدون خم شدن به عقب.

اشیاء پایگاه داده

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

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

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

دایرکتوری قابل فیلتر و جستجو

به نظر می رسد که اضافه کردن اشیاء پایگاه داده کافی نیست ، MapSVG به شما امکان می دهد دایرکتوری ایجاد کرده و در کنار نقشه خود نمایش دهید. با قیاس در املاک و مستغلات ما ، شما ممکن است بخواهید کلیه املاک (یا نمایندگان) موجود در یک کشور خاص را نشان دهید. MapSVG این کار را بسیار ممکن می کند.

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

Google Maps را تقویت کنید

آیا ذکر کردم شما می توانید MapSVG را با Google Maps ادغام کنید؟ بله ، شما می توانید و فقط به یک کلید API Google نیاز دارید. به طور معمول ، شما نمی توانید Google Maps را به صورت گسترده سفارشی کنید ، که در برخی از حالات محدودیت هایی دارد یا می تواند محدود کننده باشد. MapSVG شما را قادر می سازد تا بر این چالش غلبه کنید.

چطور؟ می توانید نقشه های برداری را در بالای هر نوع نقشه Google (زمین ، ماهواره ، جاده یا ترکیبی) لایه بندی کنید. و از آنجا که تصاویر برداری تعاملی هستند ، می توانید نقشه Google خود را تا زمان رها کردن اصلاح کنید. نتیجه نهایی بدیهی است که شما قادر به استفاده بیشتر از آن هستید.

به یاد داشته باشید که نقشه های Google با مجموعه ای از کنترل ها همراه است. این کنترل ها را با ویژگی های MapSVG همراه کنید و ادبیات خود را با هیجان دیوانه خواهید کرد. آنها مانند آنها خواهند بود ، “چگونه این کار را انجام داده اند؟” این ویژگی به شما امکان می دهد با برجسته کردن نقاط برجسته و هر چیز قابل کلیک ، نقشه Google خود را ارتقا دهید.

ویرایشگرهای CSS ، JavaScript و Templates

استفاده از نقشه ای که نمی توانید سفارشی یا تمدید کنید ، چیست؟ به نظر می رسد رومن این مسئله را با ویرایشگرهای CSS و جاوا اسکریپت مبتدی داشته است. تا زمانی که راه خود را در مورد کد می دانید ، می توانید تصاویر تعاملی خود را به حد مجاز برسانید.

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

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

کنترل پنل بصری با پیش نمایش زنده

کار با MapSVG به لطف یک داشبورد مدیر بصری که باعث می شود ایجاد نقشه ها ، نسیم بسیار ساده ای باشد ، بسیار ساده است. ایجاد نقشه ها و سایر تصاویر تعاملی با MapSVG با سهولت از ابتدا تا انتها همراه است.

علاوه بر این ، این افزونه دارای یک ویژگی پیش نمایش زنده است که به شما امکان می دهد تغییرات خود را در زمان واقعی مشاهده کنید. اکنون لازم نیست که تعجب کنید که نقشه های شما پس از اتمام چگونه به نظر می رسند. علاوه بر این ، لازم نیست که به صفحه (یا یک صفحه تازه کردن) بروید تا ببینید نقشه های شما چگونه به نظر می رسد. چقدر شیرین?

نقشه های تصویر

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

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

با تشکر از این ویژگی ها و شگفت انگیز پشتیبانی, هیچ چیز نباید شما را از ایجاد نقشه ها و تصاویر تعاملی خارج از این کهکشان باز دارد. آسمان از اینجا محدودیتی دارد زیرا MapSVG یک افزونه نقشه بدون مزخرف (و احتمالاً بهترین) برای WordPress است.

نحوه تنظیم MapSVG و ایجاد نقشه

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

MapSVG را دریافت کنید

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

mapsvg بررسی افزونه وردپرس

بعد ، ضربه بزنید بارگذاری دکمه (1)پرونده را انتخاب کنید (2), و به اکنون نصب کنید (3) دکمه مطابق شکل زیر.

بررسی mapsvg

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

بررسی mapsvg

و این افزونه پس از فعال سازی آماده استفاده است. کلیک کنید روی MapSVG برای راه اندازی کنترل پنل ، در مدیر وردپرس قرار دارد.

mapsvg

تا کنون بسیار خوب ، من فکر می کنم شما موافقت خواهید کرد که روند ساده است. در صفحه کنترل ، می توانید یکی از نقشه های از پیش ساخته را انتخاب کنید ، یک نقشه Google ایجاد کنید (ابتدا به یکپارچه سازی نیاز دارد. به راحتی با کپی کردن یک کلید API آسان است) ، یک نقشه تصویری بسازید ، یک فایل SVG آپلود کنید یا بارگیری کنید. پرونده SVG با نقشه گوگل.

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

N / B: توسعه دهنده استفاده از آن را توصیه می کند جغرافیایی کالیبره شده نقشه به جای کالیبره نشده نقشه ها چون …

… نقشه های جغرافیایی کالیبره شده جدیدتر هستند ، دارای عناوین منطقه هستند و می توانید نشانگرها را با استفاده از مختصات جغرافیایی (طول و عرض جغرافیایی) یا فقط با وارد کردن یک آدرس که به طور خودکار به مختصات تبدیل می شود اضافه کنید. – آموزشهای MapSVG

از چین (یا هر نقشه دیگری که دوست دارید) انتخاب کنید نقشه SVG جدید منوی کشویی. اگر از نوار پیمایش متنفر هستید ، از کادر جستجو احساس راحتی کنید.

ایجاد نقشه جدید در mapsvg

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

همچنین توجه خواهید کرد که نقشه در حال حاضر به مناطقی تقسیم شده است (استانهای چین در مورد ما) و در حال حاضر قابل کلیک هستند! همچنین ، با سایر کنترل ها از جمله منو منوی کشویی.

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

ویرایش رنگ نقشه در افزونه mapsvg wordpress

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

رنگ های خود را انتخاب کنید و فراموش نکنید که روی آن ضربه بزنید Ctrl + S را ذخیره کنید دکمه همانطور که در زیر نشان می دهیم.

دیدن؟ من به شما گفتم MapSVG آسان برای استفاده است. با چند کلیک ، من نقشه های خود را تغییر دادم و احساس خوبی می کند – دقیقاً مثل آن زمان ، سالها پیش ، وقتی که در گوگل رتبه اول را کسب کردم. ویرایش هر قسمت دیگر از نقشه به همان اندازه آسان است و برای اثبات نظر من ، نکاتی را اضافه خواهم کرد زیرا این سرگرم کننده خواهد بود.

افزودن نکات راهنمای ابزار در MapSVG

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

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

گذشته از این ، اضافه کردن نکات ابزار شامل اضافه کردن یک الگوی (به یاد داشته باشید ویرایشگر قالبهایی که قبلاً به آنها اشاره کردیم؟). برای آن حرکت کنید منو> الگوهای و سپس انتخاب کنید راهنمای منطقه. 

افزودن نکات ابزار در افزونه وردپرس mapsvg

بعد ، کد زیر را در ویرایشگر قالب اضافه کنید و به آن ضربه بزنید Ctrl + S را ذخیره کنید دکمه همانطور که در بالا نشان داده شده است.

استان: {{عنوان}}

کد بالا با HTML ساده همراه است برچسب های دستی. اگر می خواهید فقط عنوان منطقه خود را نشان دهید ، از برچسب {{عنوان} use استفاده می کنید. شما می توانید زمینه های سفارشی خود را نیز تعریف کنید همانطور که در یک لحظه یاد خواهید گرفت. اما ابتدا بگذارید ویژگی نکات ابزار را روشن کنیم.

هدایت به منو> تنظیمات و روشن کنید نکات راهنمایی همانطور که در زیر نشان داده شده است.

بررسی mapsvg

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

اضافه کردن زمینه های سفارشی از طریق اشیاء پایگاه داده

MapSVG به شما امکان می دهد زمینه های دلخواه را به نقشه های خود اضافه کنید. ما قبلاً فیلد {{عنوان have have را داریم ، اما می بینیم که چگونه می توانیم زمینه های سفارشی بیشتری را اضافه کنیم. شما یک انتخاب از زمینه های سفارشی از جمله دارید متن ، textarea ، کادر انتخاب ، تصاویر, و غیره بگذارید چند تصویر را به استان Nei Mongol اضافه کنیم.

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

اضافه کردن زمینه های سفارشی در MapSVG

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

با کلیک روی گزینه تغییرات خود را ذخیره کنید Ctrl + S را ذخیره کنید دکمه. همیشه بخاطر داشته باشید که تغییرات خود را ذخیره کنید.

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

نقشه خود را تغییر دهید مناطق را ویرایش کنید و روی یک منطقه کلیک کنید (ما Nei Mongol را انتخاب کردیم). باید زمینه دلخواه جدید خود را ببینید (تصاویر) به سمت راست. بزن به مرور کردن دکمه. تصویر زیر را مشاهده کنید.

در صفحه بعدی ، تصاویر خود را اضافه کرده و روی آن ضربه بزنید تصاویر را انتخاب کنید دکمه.

به شما هدایت می شوید مناطق را ویرایش کنید روی صفحه نمایش کلیک کنید خوب (1) دکمه. بعد ، روی کلیک کنید ذخیره Ctrl + S (2) را فشار دهید و سپس به عقب برگردید پیش نمایش (3) حالت مطابق شکل زیر.

اگر در این مرحله سعی کنید روی Nei Mongol را موشواره کنید ، تصاویر در قسمت ابزار ظاهر نمی شوند. چرا؟ خوب ، ما الگویی برای تصاویر ایجاد نکرده ایم. بیایید درست این دقیقه را انجام دهیم.

هدایت به منو> الگوهای> راهنمای منطقه و کد را به این تغییر دهید:

استان: {{عنوان}}
تصویر اول:


همه تصاویر:
{{# تصاویر هر}} {{/هر یک}}

در اینجا تصویری برای تصویر بیشتر است. به یاد داشته باشید که ضربه بزنید صرفه جویی دکمه.

اکنون ، سعی کنید در منطقه انتخابی خود گول بزنید (در مورد ما Nei Mongol). به من بگو چی میبینی. این همان چیزی است که روی صفحه نمایش من است.

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

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

بعد ، ضربه بزنید MapSVG مطابق شکل بالا دکمه را انتخاب کرده و نقشه خود را انتخاب کنید. این کد کوتاه را اضافه می کند [mapsvg id = ”17 ″ عنوان =” چین ”] به صفحه وردپرس خود بروید. به هر وسیله ، احساس راحتی کنید که نقشه را در هر کجای سایت خود با استفاده از کد کوتاه اضافه کنید. نگران نباشید ، نقشه هایی که با MapSVG ایجاد می کنید 100٪ پاسخگو هستند به این معنی که در چندین دستگاه عالی به نظر می رسند.

در مرحله بعد ، انتشار را مشاهده کنید و نتایج را در جبهه ببینید.

نتیجه

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

سوالی دارید یا پیشنهادی دارید؟ لطفا دریغ نکنید تا از طریق بخش نظرات زیر به نتیجه برسید. به سلامتی!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map