نقشه های Yandex برای جوملا 3.6. JB Maps v1.2.5 - ماژول نقشه از گوگل برای جوملا. راه اندازی آسان

JB Maps یک ماژول ساده برای جاسازی نقشه در وب سایت خود در اختیار شما قرار می دهد. این یک ماژول رایگان است که توسط JoomlaBamboo ایجاد شده است، به شما امکان می دهد ارتفاع، عرض، موقعیت شروع و حداکثر 3 نشانگر را روی نقشه تنظیم کنید. همچنین به شما این امکان را می دهد که مسیرهایی بین نشانگرها ایجاد کنید.

کارکرد

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

وابستگی ها

افزونه JB Library - اگر سایت شما از jQuery استفاده نمی کند. برای همه الگوهای T3 ما، برای کارکردن آن نیازی به نصب JB Library ندارید.

دستورالعمل ها

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

حل مسئله

من یک ماژول نصب کردم اما نمی توانم آن را ببینم؟

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

آیا می توانم از گزینه auto برای تنظیمات عرض استفاده کنم؟

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

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

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

این همچنین می تواند برای صاحبان منابع اینترنتی غیرانتفاعی مفید باشد: مکان ملاقات، سینمای مورد علاقه یا مسیر دوچرخه سواری را نشان دهید.

افزونه نقشه گوگل را برای جوملا جاسازی کنید

برنامه های افزودنی برای ادغام در جوملا نقشه های گوگلکافی. مؤلفه هایی با عملکرد بسیار زیاد وجود دارد - به عنوان مثال، افزونه Googlemaps Plugin با میانگین امتیاز 4.85 از 5. این افزونه برای همه خوب است، اما فقط به طور کامل زبان انگلیسی. با توجه به اینکه تنظیمات بسیار بسیار بسیار زیادی وجود دارد، همه نمی توانند آنها را درک کنند. بنابراین، پیشنهاد می کنم از افزونه دیگری استفاده کنید - Embed Google Map. عملکرد آن، اگرچه چندان چشمگیر نیست، اغلب بیش از اندازه کافی است.

می توانید افزونه Embed Google Map را از joomla.org دانلود کنید. نیازی به باز کردن آرشیو حاصل نیست. مانند همه برنامه‌های افزودنی، افزونه Embed Google Map از طریق نصب می‌شود.

پس از نصب، به مدیر پلاگین بروید و "Content - Embed Google Map" را پیدا کنید. ما افزونه را با تغییر حالت آن به “enabled” فعال می کنیم و به تنظیمات می رویم.

بیایید به پارامترهای اساسی نگاه کنیم.

  • سطح زوم - مقیاس را تنظیم کنید.
  • زبان - زبان (روسی) را انتخاب کنید.
  • افزودن پیوند - یک پیوند به نسخه بزرگتر اضافه کنید. برچسب پیوند - متن این پیوند.
  • ارتفاع و عرض - ارتفاع و عرض پنجره.
  • حاشیه - ضخامت حاشیه بر حسب پیکسل.

برای نمایش در صفحات سایت از کد زیر استفاده کنید:

(google_map) آدرس (/ google_map)

به جای آدرس، آدرس مورد نیاز را وارد کنید. افزونه Embed Google Map زبان روسی را به طرز شگفت آوری به خوبی درک می کند. به عنوان مثال، آدرس زیر را درک می کند: کراسنودار، خیابان کراسنایا، ساختمان 68.

این کد را می توان یا در متن مطالب یا در ماژول استاندارد "HTML code" درج کرد. بر این اساس، در حالت اول نقشه در ناحیه محتوا و در حالت دوم در ناحیه ماژول ظاهر می شود. فقط از ویرایشگر HTML CodeMirror استفاده کنید. ویرایشگر بصری TineMCE با این نوع کدها سازگار نیست.

کد خروجی را می توان با ویژگی ها تکمیل کرد.

1. مقیاس را روی 7 تنظیم کنید.

3. اندازه پنجره و ضخامت حاشیه را تنظیم کنید.

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

مؤلفه Zh YandexMap

برای ایجاد نقشه Yandex در جوملا 2.5 تنها یک برنامه افزودنی رایگان وجود دارد - جزء Zh YandexMap. اما با کیفیت بسیار بالا - با بزرگ عملکردو کاملا به زبان روسی

همچنین می توانید Zh YandexMap را از joomla.org دانلود کنید. به صورت استاندارد نصب شده است - از طریق Extension Manager. از آنجایی که Zh YandexMap یک کامپوننت است و نه یک افزونه، آیتمی به همین نام برای خود در بخش "کامپوننت ها" منوی مدیریت اصلی جوملا ایجاد می کند.

برای اینکه کامپوننت کار کند، باید یک کلید برای Yandex.Maps API دریافت کنید. به فرم دریافت کلید API از Yandex بروید.

  • آدرس سایت را وارد کنید.
  • ما یک تیک زیر قرارداد کاربر (که به دلایلی برای من ظاهر نشد) قرار دادیم.
  • روی «دریافت کلید API» کلیک کنید.

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

اصل کار با Zh YandexMap چیست:

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

بیایید به نحوه ایجاد نگاه کنیم یاندکس سادهنقشه ای که بعداً می توان علائم، مسیرها و مسیرهای اضافی را روی آن اعمال کرد.

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

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


سلام به همه)

در این مقاله به نحوه قرار دادن آن می پردازیم نقشه از Yandexبه وب سایت جوملا.

ابتدا به اینجا http://api.yandex.ru/maps/tools/cms/ بروید و ماژول را برای جوملا دانلود کنید.

سپس آن را نصب کنید (Extension Manager - آپلود فایل بسته).

اکنون به مدیر ماژول بروید و ماژول نصب شده را جستجو کنید

روی آن کلیک کنید و وارد تنظیمات شوید. با تشکر از Yandex، تمام تنظیمات به زبان روسی هستند :)

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

همچنین می توانید به سادگی نشانگر را بگیرید و به مکان مورد نظر روی نقشه بکشید.

مقیاس نقشه را می توان در مثال نقشه (در بالای تنظیمات) مشاهده کرد. برای مشاهده مقیاس روی + یا - کلیک کنید.

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

عرض و ارتفاع را متناسب با سایت تنظیم می کنیم، در مورد من 500x400px است.

متن (نام) نماد، تگ های html- به علامت روی نقشه یک نام می دهیم.

نکته ابزار برچسب - هنگامی که ماوس را روی یک برچسب می‌برید، متنی ظاهر می‌شود.

بالون - وقتی روی برچسب کلیک می کنید، متن ارسال کنید.

مقیاس بندی، ابزارها، نوع نقشه، ترافیک - اضافه کنید گزینه های اضافیروی نقشه.

پارامترهای اضافی - بهتر است آنها را لمس نکنید :) (برای این، به API نقشه های Yandex مراجعه کنید)

پس از پیکربندی همه چیز، ماژول را ذخیره و منتشر کنید.

این همه، موفق باشید!)

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

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

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

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

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

برای نمایش نام در کنار برچسب، نوع را انتخاب کنید با امضا.

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

دکمه را فشار دهید دریافت کد کارتو کد تعبیه شده را در سایت کپی کنید.

این کد را می توان در مواد، ماژول یا به سادگی در کد منبع قالب درج کرد.

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

اگر سایت از ویرایشگر تست JCE استفاده می کند، با تنظیمات پیش فرض اجازه درج در آن را نمی دهد چیزهای جاوا اسکریپتکد این گزینه به اصلاح وضعیت کمک می کند اجازه جاوا اسکریپ V Components > JCE Editor > Editor Profiles > Default > Editor Options > Advanced.

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

برای نمایش یک نقشه در یک ماژول، ما به سادگی یک ماژول با نوع ایجاد می کنیم کد HTMLو به طور مشابه کد کارت را وارد کنید.

همه چیز بسیار ساده است و نیازی به نصب افزونه های شخص ثالث نیست.

نقشه سایت نقشه OSM.

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

این جزء جایگزین نقشه سایت محبوب جوملا شده است - " Xmap"، که دیگر پشتیبانی نمی شود و وب سایت رسمی Xmap بسته شده است.

مرحله 1. نصب نقشه سایت در جوملا

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

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

برنامه های افزودنی ==> مدیر برنامه افزودنی ==> بارگیری فایل از بسته

فایل دانلود شده را در رایانه خود انتخاب کرده و کلیک کنید دانلود و نصب

کل کارت نصب شده و بلافاصله کار می کند.

مرحله 2. - تنظیمات نقشه سایت

در پنل مدیریت سایت به کامپوننت ها => OSMap.

در اینجا نقشه سایت "Sitemap" است که به آن می رویم.

نقشه قبلاً ایجاد شده و بلافاصله پس از نصب منتشر شده است! لازم نیست کار دیگری انجام دهید، همه چیز کار می کند!

برای راحتی، می توانید نام آن را تغییر دهید، اما واقعاً مهم نیست.

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

روی زبانه گزینه هاتنظیمات زیر در دسترس هستند:

اگر ترجمه را تنظیم نکرده باشید، به صورت زیر نمایش داده می شود:

  • متن مقدمه- متن مقدماتی برای نقشه در قالب HTML
  • عنوان منو- نام منو در بالای هر منو
  • نام کلاس CSS- نام کلاس سبک شما برای نقشه
  • #کلاس- نشان دادن تعداد ستون هایی که از 2 شروع می شود
  • تصویر پیوندهای خارجی- انتخاب تصاویر برای پیوندهای خارجی
  • فشرده سازی XML- فشرده سازی نقشه
  • XML را زیبا کنید- مشاهده نقشه، گزینه نمایش نقشه مورد نظر خود را بررسی و انتخاب کنید
  • پیوند به نویسنده- لینک های توسعه دهندگان برنامه های افزودنی را غیرفعال کنید

مرحله 3. - نقشه را مشاهده کنید

از تنظیمات خارج می شویم و در خط با نام نقشه Map Links را می بینیم.

وقتی روی تصاویر، اطلاعات مربوط به تصاویر سایت ظاهر می شود.

مرحله 4: ایجاد یک منو

به MENU بروید و یک آیتم منو ایجاد کنید OSMap - نقشه سایت HTML. در خط "انتخاب نقشه سایت" نقشه سایت را نشان می دهیم.

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

آیتم منوی ایجاد شده را در سایت باز می کنیم، جایی که نقشه سایت در انتظار ما است.

مرحله 5. پلاگین ها

به سمت گسترش نقشه OSMهفت افزونه گنجانده شده است که سه مورد از آنها به صورت پیش فرض گنجانده شده است. بقیه بسته به وجود اجزای نصب شده در سایت مانند انجمن، فروشگاه و موارد دیگر استفاده می شود.

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

مثل نقشه نقشه OSMحذف صفحات وب سایت غیر ضروری

برای این کار باید با استفاده از لاگین ادمین وارد سایت شوید (نه در پنل مدیریت، بلکه در سایت!!). نقشه سایت XML را باز کنید - مرحله 3 قبلاً توضیح داده شد. در ستون سمت چپ، وقتی روی "پرنده" سبز کلیک می کنید، می توانید موارد مورد نیاز خود را روشن/خاموش کنید. برای راحتی، در بالای بلوک اطلاعات، "نمایش سرفصل ها" را فعال کنید

خب در پایان فراموش نکنید که آدرس نقشه سایت را در فایل بنویسید robots.txt

برای این کار خط زیر را به فایل robots.txt اضافه کنید.