Modern web siteleri, çok fazla dinamik içeriğe sahip web siteleri oluşturmak için JavaScript kullanır. Web sitelerinizde yapılandırılmış veriler oluşturmak için JavaScript kullanırken dikkat etmeniz gereken birkaç şey vardır ve bu kılavuz en iyi uygulamaları ve uygulama stratejilerini kapsar. Yapılandırılmış veriler konusunda yeniyseniz, yapılandırılmış verilerin nasıl çalıştığı hakkında daha fazla bilgi edinebilirsiniz.

 

JavaScript ile yapılandırılmış veri oluşturmanın farklı yolları vardır, ancak en yaygın olanları şunlardır:

Dinamik olarak JSON-LD oluşturmak için Google Tag Manager’i kullanın

Google Tag Manager, kodu düzenlemeden web sitenizdeki etiketleri yönetmenizi sağlayan bir platformdur. Google Tag Manager ile yapılandırılmış veriler oluşturmak için aşağıdaki adımları izleyin:

 

Sitenize Google Tag Manager‘i kurun ve yükleyin.

TAG-MANAGER-YUKLEME

Uygulamanızı test edin.

Google Tag Manager’da değişken kullanma

Google Tag Manager  (GTM), yapılandırılmış verilerinizin bir parçası olarak sayfadaki bilgileri kullanmak için değişkenleri destekler. GTM’deki bilgileri çoğaltmak yerine yapılandırılmış verileri sayfadan ayıklamak için değişkenler kullanmalısınız. GTM’de bilgilerin çoğaltılması, sayfa içeriği ile GTM aracılığıyla eklenen yapılandırılmış veriler arasında uyumsuzluk riskini artırır.

 

Örneğin, recipe_name: adlı aşağıdaki özel değişkeni oluşturarak, sayfa adını reçete adı olarak kullanan bir Recipe JSON-LD bloğu dinamik olarak oluşturabilirsiniz:

 

function() { return document.title; }

 

Ardından özel etiket HTML’nizde {{recipe_name}}kullanabilirsiniz.

 

Değişkenleri kullanarak sayfadan gerekli tüm bilgileri toplamak için değişkenler oluşturmanızı öneririz.

 

Özel HTML etiketi içeriği için bir örnek:

 

<script type=”application/ld+json”>
{
“@context”: “https://schema.org/”,
“@type”: “Recipe”,
“name”: “{{recipe_name}}”,
“image”: [ “{{recipe_image}}” ],
“author”: {
“@type”: “Person”,
“name”: “{{recipe_author}}”
}
}
</script>

 

Not: Önceki örnek, GTM’de recipe_name, recipe_image ve recipe_author değişkenlerini tanımladığınızı varsayar.

Özel JavaScript ile yapılandırılmış veriler oluşturma

Yapısal veri oluşturmanın başka bir yolu, tüm yapılandırılmış verilerinizi oluşturmak veya sunucu tarafında oluşturulan yapılandırılmış verilere daha fazla bilgi eklemek için JavaScript kullanmaktır. Her iki durumda da, Google Arama, sayfayı oluştururken DOM’da bulunan yapılandırılmış verileri anlayabilir ve işleyebilir. Google Search’un JavaScript’i nasıl işlediği hakkında daha fazla bilgi için JavaScript temel kılavuzu’na göz atın.

 

JavaScript tarafından oluşturulan yapılandırılmış verilere bir örnek:

 

İlgilendiğiniz yapısal verilerin türünü bulun.

Web sitenizin HTML’sini aşağıdaki örnek gibi bir JavaScript snippet’i içerecek şekilde düzenleyin (CMS veya barındırma sağlayıcınızın belgelerine bakın veya geliştiricilerinize sorun).

fetch(‘https://api.example.com/recipes/123’)
.then(response => response.text())
.then(structuredDataText => {
const script = document.createElement(‘script’);
script.setAttribute(‘type’, ‘application/ld+json’);
script.textContent = structuredDataText;
document.head.appendChild(script);
});

 

Uygulamanızı Yapısal Veri Testi ile test edin.

Sunucu kullanma ve İşeleme

Sunucu tarafında kullanıyorsanız, oluşturulan çıktıya istenen yapılandırılmış verileri de ekleyebilirsiniz. İlgilendiğiniz yapısal veri türü için JSON-LD’nin nasıl oluşturulacağını öğrenmek için framework belgelerine bakın.

Uygulamanızı test edin

Google Search’un yapılandırılmış verilerinizi tarayabildiğinden ve dizine eklediğinden emin olmak için uygulamanızı test edin:

 

Yapısal Veri Testini açın

Not: Yapısal Veri Test Aracı’nda JavaScript desteği sınırlıdır.

Test etmek istediğiniz URL’yi girin.

Not: Kod girişini kullanırken JavaScript sınırlamaları (örneğin, CORS kısıtlamaları) olduğu için kod girişi yerine URL girişini kullanmanızı öneririz.

URL’yi test et’i tıklayın.

Başarılı: Her şeyi doğru bir şekilde yaptıysanız ve yapılandırılmış veri türünüz araçta destekleniyorsa, “Sayfa zengin sonuçlar için uygun” mesajını görürsünüz.

Zengin Sonuçlar testi tarafından desteklenmeyen yapılandırılmış bir veri türünü test ediyorsanız, oluşturulan HTML’yi kontrol edin. Oluşturulan HTML yapılandırılmış verileri içeriyorsa, Google Search bu verileri işleyebilir.

 

Tekrar deneyin: Hatalar veya uyarılar görürseniz, büyük olasılıkla bir sözdizimi hatası veya eksik bir özelliktir. Yapısal veri türünüzle ilgili dokümanları okuyun ve tüm özellikleri eklediğinizden emin olun. Sorununuz devam ederse, arama ile ilgili JavaScript sorunlarını giderme hakkındaki kılavuzu da kontrol ettiğinizden emin olun.