Google Maps হল একটি ওয়েব-ভিত্তিক ম্যাপিং সার্ভিস যা বিশ্বের যেকোনো জায়গার ভৌগোলিক অঞ্চল এবং রোড ম্যাপ প্রদান করে। যাইহোক, কিছু ওয়েবসাইট মালিক “This page can't load Google maps correctly” এরর দেখছেন Google Map লোড হওয়ার বদলে। এই এরর “This page didn't load Google Maps correctly. See the JavaScript console for technical details” আকারেও দেখায়।
নোট: এই সমাধান ওয়েবসাইট মালিকদের জন্য, সাধারণ ব্যবহারকারীদের জন্য নয়।
Google Maps সঠিকভাবে লোড না হওয়ার কারণ
Google Map প্লাগইনগুলো trướcেও ভালো কাজ করত কোনো এরর ছাড়া, কিন্তু গত কয়েক বছর থেকে Google এমবেডেড ম্যাপস সহ ওয়েবসাইটের জন্য নিয়মগুলো পরিবর্তন করেছে। ওয়েবসাইট মালিকরা আগে শুধু এমবেডেড কোড ব্যবহার করে এটাকে কাজ করাতে পারতেন, কিন্তু এখন Google Map সঠিকভাবে কাজ করার জন্য API Key আবশ্যক। আপনার যদি ইতিমধ্যে API Key থাকে, তবে Chrome-এ ‘Inspect Element -> Console’ ট্যাব দেখে Google আপনার সাইটে Maps অনুমতি দেয় না সেটির সঠিক কারণ জানতে পারেন। এর কারণ হতে পারে ভুল কী, কী রেস্ট্রিক্টেড থাকা ইত্যাদি।
আপনার সাইট সেটিংসে Google API Key যোগ করা
আপনার প্রজেক্ট বা ওয়েবসাইটের জন্য Google Map কাজ করার জন্য আপনাকে Google API Key তৈরি করে আপনার সাইটের সেটিংসে যোগ করতে হবে। Google Developers-এ সাইন-ইন করে কী তৈরি করুন এবং অন্যান্য এরর ট্রাবলশুট করুন।
আপনি যদি ম্যানুয়ালি ম্যাপসের জন্য স্ক্রিপ্ট ইনসার্ট করেছেন, তবে সেটি নিচের ফরম্যাটে হওয়া উচিত YOUR_API_KEY-এর জায়গায় আপনার API Key দিয়ে:
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" type="text/javascript"></script>
WordPress সবচেয়ে জনপ্রিয় CMS, ১৭২ মিলियनওয়েবসাইট এটিকে ব্যবহার করে; তাই আমরা শুধু WordPress-এর জন্য ধাপগুলো দেখাব।
- Google Maps-এর জন্য যে প্লাগইন ব্যবহার করছেন তার সেটিংসে যান, সেটিতে API Key যোগ করার অপশন থাকা উচিত। যদি না থাকে, তবে আপনি পুরনো ভার্সনের প্লাগইন বা আউটডেটেড প্লাগইন ব্যবহার করছেন
- WordPress সাইটে API Key-এর সেটিংস খোলা রাখুন
- Google-এর Cloud Resource Manager-এ যান
- Google-এ সাইন-ইন করুন (যদি ইতিমধ্যে লগইন না থাকেন)
- “Create Project” চাপুন, প্রজেক্টের নাম দিন এবং “Create” চাপুন
- Google-এর Enabling API ওয়েবপেজে যান
- উপরে “Select a Project” চাপুন, নতুন তৈরি করা প্রজেক্টটি সিলেক্ট করুন এবং Continue চাপুন
- “Enable APIs and Services” চাপুন
- “Maps JavaScript API” সার্চ করুন এবং খুলুন
- “Enable” বাটন চাপুন
- নেভিগেশন মেনু থেকে “APIs & Services” সিলেক্ট করুন এবং “Credentials”-এ যান
- Create credentials ড্রপ-ডাউন থেকে “API Key” সিলেক্ট করুন। নোট: অনঅথরাইজড ব্যবহার রোধ করার জন্য Restrict Key বানাতে পারেন
- “Close” চাপুন তারপর তৈরি করা Key-এ ক্লিক করুন
- Application restrictions-এ “HTTP referrers” সিলেক্ট করুন
- আপনার ওয়েবসাইটের URL যোগ করুন এবং “Save” চাপুন
- এখন কীটি কপি করুন এবং WordPress সাইটে ফিরে যান
- বাম প্যানেলে নিচে স্ক্রোল করে “Settings”-এ যান
- “Google API KEY” অপশন খুঁজে পাবেন, সেটি খুলুন এবং কীটি পেস্ট করুন
- সেটিংস সেভ করুন, আপনার পেজে যান এবং রিফ্রেশ করুন
নোট: নিশ্চিত করুন আপনার বিলিং সক্রিয় কারণ Google শুধু ৩০০ ডলারের ক্রেডিট বা ১২ মাস ফ্রি ব্যবহার (যেটি আগে খत्म হয়) দেয়। তারপর বিলিং সেটআপ এবং ইমপ্লিমেন্ট করতে হবে।
