HTML Harita Ekleme Kodu: Kapsamlı Bir Kılavuz
Bir web sitesine harita eklemek, kullanıcıların konumunuzu bulmalarına, yol tarifi almalarına ve işletmenizle ilgili diğer önemli bilgileri görmelerine yardımcı olan değerli bir özelliktir. HTML’de harita eklemek, Google Haritalar’ın sağladığı basit bir kod parçası ile kolayca yapılabilir.
Google Haritalar API Anahtarı Alma
Harita eklemeden önce, Google Haritalar API anahtarı almanız gerekir. Bu anahtar, Google Haritalar hizmetlerini kullanmanıza olanak tanır.
- Google Cloud Platform’a gidin: https://console.cloud.google.com/
- “API’ler ve Hizmetler”e tıklayın.
- “Kimlik Bilgileri” sekmesine gidin.
- “API Anahtarları Oluştur” düğmesine tıklayın.
- Anahtar adına bir isim verin ve “Haritalar API”yi seçin.
- “Oluştur” düğmesine tıklayın.
HTML Harita Ekleme Kodu
Google Haritalar API anahtarınızı aldıktan sonra, HTML’nize harita eklemek için aşağıdaki kodu kullanabilirsiniz:
“`html
“`
Bu kod, web sitenize varsayılan olarak Sidney, Avustralya’ya yakınlaştırılmış bir harita ekler.
Harita Özelliklerini Özelleştirme
Varsayılan harita ayarlarını özelleştirmek için aşağıdaki özellikleri kullanabilirsiniz:
- center: Haritanın merkez konumunu ayarlar.
- zoom: Haritanın yakınlaştırma seviyesini ayarlar.
- mapTypeId: Haritanın türünü ayarlar (ör. yol haritası, uydu görüntüsü).
- disableDefaultUI: Haritadaki varsayılan kullanıcı arayüzü öğelerini devre dışı bırakır.
- markers: Haritaya işaretleyiciler ekler.
Örnek: İşaretleyici Ekleme
Haritaya bir işaretleyici eklemek için aşağıdaki kodu kullanabilirsiniz:
javascript
var marker = new google.maps.Marker({
position: { lat: -34.397, lng: 150.644 },
map: map,
title: 'Sidney'
});
Faydalı Kaynaklar
Sonuç
HTML’de harita eklemek, kullanıcı deneyimini geliştirmek ve işletmenizin konumunu daha erişilebilir hale getirmek için güçlü bir araçtır. Google Haritalar API’sini kullanarak, web sitenize kolayca özelleştirilebilir ve bilgilendirici haritalar ekleyebilirsiniz.