Google ürün şeması JavaScript ile eklenir mi?

Google ürün şeması JavaScript ile eklenir; ancak fiyat, stok ve varyant bilgilerini yalnızca JavaScript’e bırakmak güvenilir değildir. Google, JavaScript ile oluşturulan yapılandırılmış verileri işleyebilir fakat tarama, oluşturma ve yeniden işleme zaman alabilir.

Bu nedenle ürün sayfasındaki temel Product, Offer, fiyat ve stok alanları mümkünse ilk HTML yanıtında veya sunucu tarafında üretilmelidir. JavaScript, eksik kalan etkileşimleri ve değişken arayüz bilgilerini tamamlamak için kullanılabilir.

Özellikle kampanya fiyatı, stok durumu ve ürün varyantları sık değişen e-ticaret sitelerinde uygulama yöntemi önem kazanır. Yapılandırılmış veri, sayfada görünen ürün bilgisiyle aynı olmalıdır.

Google ürün şeması JavaScript ile nasıl eklenir?

Google ürün şeması JavaScript ile eklenir; bunun için sayfaya JSON-LD biçiminde bir script etiketi yerleştirilir. Bu etiket, ürün bilgilerini Google’ın okuyabileceği yapılandırılmış formatta sunar.

En yaygın yöntem, ürün sayfasının HTML çıktısına şu yapıya benzer bir JSON-LD eklemektir:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Örnek Ürün",
  "image": ["https://www.ornekalanadi.com/urun.jpg"],
  "offers": {
    "@type": "Offer",
    "priceCurrency": "TRY",
    "price": "1299.90",
    "availability": "https://schema.org/InStock",
    "url": "https://www.ornekalanadi.com/ornek-urun"
  }
}
</script>

JavaScript bu kodu sayfa yüklenirken dinamik olarak da oluşturabilir. Ancak Google’ın JavaScript’i çalıştırması, ilk HTML yanıtının alınmasından sonra gerçekleşebilir.

React, Vue, Angular veya Next.js gibi sistemlerde JSON-LD üretmek mümkündür. Kritik nokta, şemanın tarayıcıda görünmesi değil, Google’ın işlediği son DOM içinde doğru ve tutarlı biçimde yer almasıdır.

JavaScript ile eklenen şema, kullanıcı tarayıcısında çalışmayan kod nedeniyle hiç oluşmayabilir. İçerik güvenlik politikası, hata veren bileşen veya gecikmeli API isteği bu sonucu doğurabilir.

Bu nedenle uygulamayı yalnızca kaynak kodda değil, oluşturulmuş DOM’da da kontrol etmek gerekir. Ürün şemasının teknik testi için Google SEO'da ürün şeması nasıl test edilir? rehberindeki yöntemler kullanılabilir.

Google JavaScript ile oluşturulan ürün şemasını nasıl işler?

Google, JavaScript ile oluşturulan ürün şemasını genellikle tarama ve oluşturma aşamalarından sonra işler. Bu işlem, HTML içindeki sabit veriyi okumaktan daha karmaşık bir süreçtir.

Googlebot önce sayfanın HTML yanıtını alır. Ardından uygun gördüğü sayfaları JavaScript oluşturma kuyruğuna alabilir. Bu iki aşama arasında geçen süre sabit değildir.

İlk HTML yanıtında ürün adı ve açıklaması bulunabilir. Fakat fiyat, stok veya offers alanı yalnızca API isteği sonrasında ekleniyorsa, Google bu bilgiyi daha sonra görebilir.

Tarama sıklığı; sitenin genel teknik durumu, sayfa güncelliği, iç bağlantıları ve sunucu yanıtları gibi faktörlerle değişir. Bu nedenle “JavaScript kesinlikle okunmaz” demek de “anında okunur” demek de doğru değildir.

Google’ın işlediği son içerik, kullanıcının gördüğü ilk ekranla her zaman aynı zamanda oluşmaz. Özellikle istemci tarafında çalışan uygulamalarda API yanıtı gelmeden ürün şeması eksik kalabilir.

JavaScript SEO konusunda temel ayrım şudur: Sayfa içeriği kullanıcıya görünse bile arama motorunun aynı veriyi aynı adımlarla alacağı garanti edilmez. Google SEO'da JavaScript içerik nasıl indekslenir? konusundaki tarama ve oluşturma ayrımı bu yüzden önemlidir.

JavaScript ile oluşturulan veri, Google tarafından okunabilir olsa bile gecikmeli işlenebilir. Fiyat veya stok bilgisi birkaç saat içinde değişiyorsa bu gecikme, arama sonuçlarında eski bilginin kalmasına neden olabilir.

Bu risk, ürün şemasının hatalı olduğu anlamına gelmez. Sorun çoğu zaman verinin Google’a hangi aşamada ve ne kadar güncel sunulduğuyla ilgilidir.

Statik ve JavaScript ürün şeması arasındaki fark nedir?

Statik ürün şeması HTML yanıtında doğrudan bulunur; JavaScript ürün şeması ise sayfa çalıştıktan sonra oluşturulur. Bu fark, tarama zamanını ve hata ihtimalini etkiler.

Statik yöntem, özellikle ürünün temel bilgileri için daha öngörülebilir sonuç verir. Ürün adı, ana görsel, marka, fiyat para birimi ve teklif durumu genellikle sunucu yanıtında bulunmalıdır.

JavaScript yöntemi, tek bir ürün sayfasında kullanıcı seçimine göre değişen bilgileri yönetmek için işlevsel olabilir. Örneğin seçilen bedenin stok durumu istemci tarafında değişebilir.

Fakat bu değişkenlik, Google’ın aynı seçimi yapacağı anlamına gelmez. Arama motoru çoğu zaman varsayılan ürün görünümünü işler ve kullanıcıya özel seçimleri değerlendirmeyebilir.

Yanlış: Ürün şemasını yalnızca sepete ekleme sonrasında çalışan JavaScript’e bağlamak. Doğru: Varsayılan ürün, fiyat ve stok bilgilerini ilk HTML veya sunucu taraflı JSON-LD içinde sunmak.

İki yöntemin birlikte kullanılması çoğu modern e-ticaret sitesi için daha uygundur. Sunucu tarafı temel bilgileri verir, JavaScript ise arayüzdeki değişimleri yönetir.

Fiyat ve stok değişikliklerinde JavaScript şeması neden risklidir?

JavaScript ürün şeması, fiyat ve stok sık değiştiğinde eski bilginin daha uzun süre görünmesi nedeniyle risklidir. Google yeni değeri ancak sayfayı yeniden tarayıp JavaScript’i çalıştırdığında görebilir.

Bir ürünün fiyatı pazartesi günü 1.000 TL, salı günü 900 TL olabilir. Sayfa JavaScript ile güncelleniyor fakat Google sayfayı salı günü yeniden işlemiyorsa eski değer bir süre kalabilir.

Aynı durum availability alanı için de geçerlidir. Stok tükendiğinde şema hâlâ InStock gösteriyorsa, yapılandırılmış veri sayfadaki gerçek durumla çelişir.

Google ürün şemasında görünen fiyatın, kullanıcıya sunulan geçerli fiyatla uyumlu olması gerekir. Sadece indirimli fiyatı göstermek, ancak bu fiyat sayfada ve satın alma akışında gerçekten geçerliyse uygundur.

Stok bilgisi için InStock, OutOfStock veya uygun başka bir Schema.org değeri kullanılabilir. Ancak değer, ürün sayfasındaki görünür bilgiyle ve satın alma imkânıyla çelişmemelidir.

JavaScript API isteği başarısız olduğunda iki farklı sonuç görülebilir. Ürün şeması hiç oluşmayabilir veya kod içinde varsayılan, artık geçerli olmayan bir fiyat kalabilir.

Bu durum özellikle üçüncü taraf fiyat servisleri, bölgesel stok sistemleri ve önbellek katmanlarında ortaya çıkar. CDN önbelleği eski HTML’i sunarken istemci tarafı yeni fiyatı gösterebilir.

Bu nedenle kritik ticari alanlar için şu yaklaşım daha güvenlidir: Fiyat ve stok sunucu tarafında üretilir, JavaScript ise yalnızca kullanıcı etkileşimini günceller.

Ürün şeması JavaScript ile uygulanırken hangi alanlar sabit kalmalıdır?

Ürün şemasında ürün adı, ana URL, görseller, fiyat para birimi ve temel teklif bilgileri mümkün olduğunca sabit ve doğrulanabilir kalmalıdır.

Product nesnesi ürünün kendisini tanımlar. name alanı sayfadaki ürün adıyla aynı olmalıdır. Ürün görseli, erişilebilir ve gerçek ürünü göstermelidir.

offers nesnesi satış koşullarını açıklar. Bu alanda fiyat, para birimi, ürün URL’si ve stok durumu gibi bilgiler yer alabilir.

Ürün birden fazla varyanta sahipse her varyantın fiyatı ve stok durumu ayrı ele alınmalıdır. Ancak kullanıcıya seçili olmayan tüm varyantları tek bir fiyat gibi sunmak yanıltıcı olabilir.

Örneğin bir tişörtte küçük beden 300 TL, büyük beden 350 TL ise şemada tek fiyat göstermek doğru olmayabilir. Sayfanın varsayılan seçimi ve Google’ın desteklediği ürün gösterimi ayrıca değerlendirilmelidir.

brand, sku ve uygun olduğunda gtin gibi alanlar ürünün ayrıştırılmasına yardımcı olabilir. Bu alanlar yalnızca gerçek ve doğrulanabilir bilgiler varsa eklenmelidir.

Bilgi mevcut değilse uydurma bir SKU veya GTIN yazmak yerine alanı boş bırakmak daha doğrudur. Geçersiz tanımlayıcılar, veri kalitesini artırmaz ve hata oluşturabilir.

Ürünün sayfada görünmeyen bir fiyatını şemaya eklemek de uygun değildir. Yapılandırılmış veri, arama motorunu farklı bir ticari koşula yönlendiren reklam alanı olarak kullanılmamalıdır.

JavaScript ürün şeması nasıl doğru uygulanır?

JavaScript ürün şemasını doğru uygulamak için veriyi tek bir güvenilir kaynaktan üretmek ve oluşturulan çıktıyı düzenli test etmek gerekir.

1. Ürün adı, URL, fiyat, para birimi ve stok kaynağını belirleyin.
2. Bu bilgileri ürün veritabanından veya güvenilir bir sunucu API’sinden alın.
3. JSON-LD nesnesini sunucu tarafında veya sayfa oluşturulurken üretin.
4. JavaScript ile sonradan değişen alanları, temel şemayla çelişmeyecek şekilde yönetin.
5. Kaynak HTML’yi, oluşturulmuş DOM’u ve zengin sonuç testini ayrı ayrı kontrol edin.
6. Fiyat ve stok değişikliğinden sonra yeniden tarama sürecini ölçün.

Bu adımların ilk amacı, ürün şemasının hangi kaynaktan beslendiğini netleştirmektir. Aynı fiyatın CMS, ERP, stok servisi ve frontend içinde farklı tutulması hata riskini yükseltir.

Sunucu taraflı üretim kullanılıyorsa ürün sayfası oluşturulurken güncel verinin alınması gerekir. Önbellek kullanılıyorsa fiyat ve stok alanları için önbellek süresi ayrıca değerlendirilmelidir.

JavaScript ile üretim zorunluysa hata durumunda boş şema bırakılmamalıdır. API yanıtı gelmediğinde sayfa, gerçeği yansıtmayan varsayılan bir fiyat üretmemelidir.

Uygulamada JSON biçimi de kontrol edilmelidir. Eksik virgül, hatalı kaçış karakteri veya HTML içine yanlış yerleştirilmiş tırnaklar script’in çalışmamasına neden olabilir.

Birden fazla ürün bileşeni aynı sayfaya farklı JSON-LD blokları ekliyorsa çakışan Product tanımları oluşabilir. Tek bir ana ürün tanımı kullanmak, denetimi kolaylaştırır.

Yapılandırılmış veri, sayfada görünen ürün bilgisinin yerine geçmez. Ürün adı, fiyat ve stok kullanıcı tarafından da erişilebilir olmalıdır.

JavaScript ile eklenen ürün şeması nasıl test edilir?

JavaScript ile eklenen ürün şeması, kaynak HTML, oluşturulmuş sayfa ve Google’ın zengin sonuç testi birlikte kullanılarak test edilir.

İlk kontrolde sayfanın kaynak kodunu açın. JSON-LD burada görünüyorsa veri Google’ın ilk HTML yanıtına dahil edilmiş olabilir. Görünmüyorsa şemanın yalnızca JavaScript sonrasında oluştuğunu anlarsınız.

İkinci kontrolde tarayıcı geliştirici araçlarını açın. Elements bölümünde application/ld+json arayın. Ardından Network bölümünden fiyat ve stok API’lerinin başarılı yanıt verip vermediğini inceleyin.

Üçüncü kontrolde test aracını kullanın. Test sonucu yalnızca sözdizimi hatasını değil, desteklenen alanları ve uyarıları da gösterebilir.

Bir testin başarılı olması, verinin her zaman güncel taranacağı anlamına gelmez. Test aracı belirli bir anda oluşan çıktıyı inceler; tarama sıklığını garanti etmez.

Testi farklı durumlarda tekrarlayın. Ürün stoktayken, stok dışındayken, indirimliyken ve varyant seçiliyken oluşan JSON-LD çıktısını karşılaştırın.

Ayrıca mobil ve masaüstü sayfalarında farklı şema oluşup oluşmadığını kontrol edin. Dinamik tasarım sistemlerinde cihaz türüne göre farklı API veya şablon kullanılabilir.

Search Console’daki ürün zengin sonuç raporları, zaman içinde görülen uyarıları takip etmek için kullanılabilir. Aynı ürünün hataları tekrar ediyorsa şablon seviyesinde düzeltme yapılmalıdır.

Ürün şemasının test sürecini ayrıntılı adımlarla incelemek için Google SEO'da ürün şeması nasıl test edilir? sayfasına bakabilirsiniz.

JavaScript ürün şemasında hangi hatalar sık görülür?

JavaScript ürün şemasında en sık görülen hatalar, görünmeyen veri kullanımı, eski fiyat, hatalı URL ve sayfayla uyuşmayan stok bilgisidir.

İlk hata, yalnızca kullanıcı belirli bir butona bastığında şema üretmektir. Googlebot’un bu etkileşimi gerçekleştireceği varsayılamaz. Temel ürün şeması sayfa açıldığında hazır olmalıdır.

İkinci hata, fiyatın ekranda güncellenmesine rağmen JSON-LD’nin eski kalmasıdır. Frontend bileşeni değişirken yapılandırılmış veri bileşeni güncellenmiyorsa iki farklı fiyat oluşur.

Üçüncü hata, satışta olmayan ürün için InStock kullanmaktır. Ürün sayfası “tükendi” diyorsa şema da aynı durumu göstermelidir.

Dördüncü hata, varyant URL’si yerine ana ürün URL’sini her durumda yazmaktır. Canonical yapı, varyantların indekslenme stratejisi ve ürün şeması birlikte planlanmalıdır.

Beşinci hata, fiyatı binlik ayraçla hatalı biçimde göndermektir. Yapılandırılmış veride fiyat değeri, kullanılan para birimine uygun sayısal formatta olmalıdır.

Altıncı hata, aynı sayfaya farklı eklentiler tarafından birden fazla ve çelişkili ürün şeması eklenmesidir. CMS eklentisi, tema ve etiket yönetim sistemi birlikte kontrol edilmelidir.

Yedinci hata, JavaScript dosyasını engelleyen güvenlik veya robots kurallarıdır. Web sitesindeki teknik güvenlik ayarlarını incelerken web sitesinde güvenlik başlıkları nasıl eklenir? rehberindeki temel kontroller de değerlendirilebilir.

Bu hatalar her zaman manuel olarak fark edilmez. Otomatik test, fiyat değişikliği senaryosu ve düzenli Search Console kontrolü birlikte uygulanmalıdır.

JavaScript ürün şeması ne zaman kullanılmalı?

JavaScript ürün şeması, ürün bilgileri sunucu tarafında da güvenilir biçimde üretilebildiğinde tamamlayıcı yöntem olarak kullanılmalıdır.

Tek sayfalı uygulamalarda tüm içerik istemci tarafında oluşturuluyorsa JavaScript kaçınılmaz olabilir. Bu durumda uygulamanın sunucu taraflı oluşturma veya önceden oluşturma seçenekleri değerlendirilmelidir.

Next.js gibi sistemlerde sunucu taraflı oluşturma, ürün sayfasının ilk HTML yanıtını zenginleştirebilir. Kullanılan framework, barındırma modeli ve veri kaynağı birlikte incelenmeden tek bir çözüm önerilemez.

Ürün fiyatı saatler içinde değişmiyorsa JavaScript şeması daha düşük risk taşır. Buna rağmen doğru uygulama, ilk HTML yanıtında veri sunmayı tercih eder.

Stok sürekli değişiyorsa daha dikkatli olunmalıdır. Market, elektronik, bilet ve sınırlı stoklu ürün sitelerinde gecikmiş stok bilgisi kullanıcı beklentisini ve arama görünümünü etkileyebilir.

Bir e-ticaret sitesi karar verirken şu kontrol listesini kullanabilir:

• Ürün adı ve fiyatı ilk HTML yanıtında bulunuyor mu?
• JSON-LD fiyatı, sayfada görünen fiyatla aynı mı?
• Stok değişince şema da güncelleniyor mu?
• JavaScript API isteği başarısız olduğunda hatalı varsayılan veri oluşuyor mu?
• Ürün varyantlarının URL ve fiyat ilişkisi net mi?
• Kaynak HTML ve oluşturulmuş DOM ayrı ayrı test edildi mi?
• Search Console raporlarında tekrarlanan ürün hataları izleniyor mu?

Kontrol listesindeki ilk üç madde karşılanmıyorsa şemayı yalnızca JavaScript’e bırakmak doğru değildir. Önce veri üretim mimarisi düzeltilmelidir.

JavaScript, kullanıcı deneyimi için gerekli olabilir. Fakat Google’a sunulan temel ürün verisi, istemci tarafı etkileşiminden bağımsız çalışabilmelidir.

Bu yaklaşım, arama motoruna özel gizli bir içerik üretmek anlamına gelmez. Aynı ürün bilgisi hem kullanıcıya hem de arama motoruna erişilebilir biçimde sunulur.

Google ürün şeması JavaScript ile eklenir mi sorusunun net cevabı nedir?

Google ürün şeması JavaScript ile eklenir; fakat kritik ürün verilerini yalnızca JavaScript’e bağlamak özellikle fiyat ve stok değişimlerinde risklidir.

En güvenli yapı, ürünün temel bilgilerini sunucu tarafında veya ilk HTML yanıtında sunmaktır. JavaScript bu yapıyı tamamlayabilir, fakat tek veri kaynağı olmamalıdır.

Bir ürün sayfasında şu dört noktayı birlikte değerlendirin: verinin kaynağı, HTML’ye giriş zamanı, JavaScript oluşturma süreci ve fiyat-stok güncelleme sıklığı.

Fiyat ve stok sık değişiyorsa sunucu taraflı JSON-LD, önbellek ayarları ve güncelleme süreci ayrıca incelenmelidir. Her sistem için aynı uygulama modeli uygun değildir.

JavaScript tabanlı e-ticaret sitelerinde hedef, Google’ın kodu çalıştırmasını beklemek değil, gerekli bilgiyi mümkün olduğunca erken ve tutarlı sunmaktır.

Uygulama sonrasında test sonucu alınmalı, gerçek fiyat değişikliği senaryoları denenmeli ve Search Console verileri belirli aralıklarla izlenmelidir.

Web sitesinin mimarisi, ürün veri kaynağı ve kullanılan framework birlikte değerlendirilmelidir. Böylece şema, sayfa içeriğinden kopuk ayrı bir kod parçası olarak kalmaz.