Web sitesine Google Haritalar kodu nasıl eklenir?

Bu blog yazısında, web sitenize Google Haritalar kodunu nasıl ekleyeceğinizi adım adım öğreneceksiniz. Google Haritalar’ın güçlü özelliklerinden yararlanmak ve ziyaretçilerinize etkileşimli bir harita sunmak için bu adımları takip edin.

Web sitenize Google Haritalar kodunu eklemek, kullanıcıların işletmenizin konumunu kolayca bulmasını sağlamanın yanı sıra, profesyonel bir görünüm de sağlar. Bu yazıda, adım adım nasıl yapacağınızı öğreneceksiniz.

1. Google Haritalar API'si oluşturma:

   • İlk adım olarak, Google Cloud Platform'da bir hesap oluşturmanız gerekiyor.
   • Projenizi oluşturun ve Google Haritalar API'sini etkinleştirin.
   • API anahtarınızı alın.

2. Google Haritalar kodunu web sitenize ekleyin:

   • Web sitenizin koduna giriş yapın ve haritayı eklemek istediğiniz sayfayı açın.
   • HTML dosyasının head bölümüne gidin ve Google Haritalar API'sini yüklemek için gerekli script etiketini ekleyin.
   • Haritayı göstermek istediğiniz yere div etiketi ekleyin ve benzersiz bir kimlik (ID) atayın.
   • JavaScript koduyla, haritayı oluşturun ve API anahtarınızı kullanarak özelleştirmeler yapın.
   • Kodunuzu kaydedin ve web sitenizi kontrol edin. Google Haritalar'ın başarıyla eklendiğini görmelisiniz.

3. Haritayı özelleştirin:

   • Google Haritalar API'si, haritayı özelleştirmenize olanak tanır.
   • İşletmenizin adını, konumunu ve diğer ayrıntıları göstermek için işaretleyiciler ekleyebilirsiniz.
   • Haritayı boyutlandırabilir, yakınlaştırma düzeyini ayarlayabilir ve diğer görsel ayarları uygulayabilirsiniz.

Genellikle şirket web sitelerinin iletişim sayfalarında yer alan ve şirket adresini ziyaretçiye detaylı bir şekilde göstermeye yarayan haritayı sizde kolay bir şekilde web sitenize ekleyebilirsiniz. Bunun için hazırlanmış bir web sitesinden faydalanacağız. Google Haritalar üzerinden de bu işlemi yapabilirsiniz. Ancak bu yöntemde, harita üzerine şirket bilgilerini, detayları ve tam yerinizi gösteren mesaj balonu gösterebilirsiniz. Google haritalarda ise paylaş diyerek sadece adresin bulunduğu yeri ve çevresini gösteren iframe kodunu olarak alıp sitenize eklersiniz.

Google harita kodunu almak için öncelikle buraya tıklayıp siteye gidelim. Kısıtlı bir Türkçe desteği bulunana bu siteyi İngilizce olarak kullanabilirsiniz.

Google Haritalar’ı web sitenize yerleştirmek, hazır kod hizmeti sayesinde artık çok kolay! Aşağıdaki aşamaları uygulayarak şirketinizin web sitesine lokasyonunuzu nasıl ekleyebileceğiniz konusunda gerekli bilgiyi alabilirsiniz:

1. Başlık kısmına şirketin veya ilgili adresin ismini girebilirsiniz.
2. İlgili adresi seçin. İhtiyacınıza en uygun düşen harita türünü seçin. Bu seçenekler uydu, hibrit harita veya arazi haritasıdır.
3. Yakınlaştırma 50 veya 100 m seçmek daha mantıklı olabilir.
4. Haritanın web sitenizde kaplayacağı yeri göz önüne alarak uygun en ve boyu belirleyin.

Bu işlemleri yaptıktan sonra “Generate My Code” butonuna tıklayın. Oluşan kodu butona tıklayıp seçin ve "Ctrl+C” ile kopyalayın. En son olarak, oluşturulan bu HTML kodunu web sitenizde haritayı göstereceğiniz alanın kaynak kodu içine yapıştırın. Google Haritası’nı web sitenizin farklı bölümlerine yerleştirebilirsiniz, örneğin bir makalenin, bilgi veya iletişim sayfasına veya widgetların üzerinde kullanabilirsiniz.

Ancak bu kodları siteye eklemeniz her şey bitti anlamına gelmiyor. Google api kodu olmadan, kodu eklediğiniz sitedeki harita hata bildirimi yapacaktır. Api kodunu sayfanıza eklemezseniz haritanın görüneceği yerde hata uyarısı görürsünüz.

Bunu aşmak için Google'dan api key kodu alıp sayfamıza ekleyeceğiz. Bunun için Google Haritalar Platformu sayfasına giderek Google hesabınızdan giriş yaptıktan sonra Console’da belirtilen yönergeleri takip ederek gerekli olan “maps api key alma” işlemini tamamlamış olursunuz.

Sonuç: Bu blog yazısında, web sitenize Google Haritalar kodunu eklemenin adımlarını detaylı olarak inceledik. İşletmenizin konumunu vurgulamak ve kullanıcıların kolayca size ulaşmasını sağlamak için bu adımları izleyebilirsiniz. Haritanızı özelleştirmek için zaman ayırarak, web sitenize profesyonel bir görünüm kazandırabilirsiniz.

Unutmayın, ziyaretçilerinize kolaylık sağlamak için haritanızın doğru bir şekilde çalıştığından emin olun.