📋 Tasarım Taslağı 25 Aralık 2025

Shop Ürün Kartı: "Stokta Var" Badge Ekleme

📝

Basit Anlatım (Herkes İçin)

Şu anda ürün kartlarında sadece fiyat, indirim ve kategori bilgisi görünüyor. Google'da rakip sitelerde (Makinaturkiye.com gibi) "Stokta var" yazısı var.

✅ Ne Yapacağız?

  • Ürün kartına "Stokta var" yazısı eklenecek (yıldız puanının yanında)
  • Tüm ürünler varsayılan olarak stokta var gösterilecek (gerçekte yoksa bile)
  • Ek bilgiler: Ücretsiz kargo, hızlı teslimat, 2 yıl garanti gibi badge'ler

💡 Neden Önemli? Google'da arama sonuçlarında "Stokta var" yazısı müşteri güvenini artırır ve tıklama oranını yükseltir. Rakipleriniz bunu kullanıyor, siz de kullanmalısınız!

🔧

Teknik Detaylar (Geliştiriciler İçin)

Değişiklik yapılacak dosya ve veritabanı field'leri.

📁 Etkilenen Dosyalar

  • resources/views/components/ixtif/product-card.blade.php
  • → Product card component (fiyat ve rating alanının yanına badge eklenecek)

🗄️ Database Field'leri

  • stock_tracking
    boolean - Stok takibi açık mı?
  • current_stock
    integer - Mevcut stok sayısı
  • allow_backorder
    boolean - Stok bitmişse sipariş alınabilir mi?
🎨

Tasarım Seçenekleri

"Stokta var" badge'i nereye eklenecek? 3 farklı seçenek.

ÖNERİLEN

1️⃣ Fiyatın Altında

₺9.999,00
⭐⭐⭐⭐⭐ (12)
Stokta var
Artılar: En görünür yer, kullanıcı hemen farkeder
Eksiler: Çok yer kaplar

2️⃣ Yıldızın Yanında

₺9.999,00
⭐⭐⭐⭐⭐ (12)
• Stokta var
Artılar: Kompakt, temiz görünüm
Eksiler: Az dikkat çeker

3️⃣ Fotoğraf Üstünde

Stokta var
₺9.999,00
Artılar: Fotoğraf üstünde vurgu
Eksiler: Fotoğrafı kapatır

💡 Öneri: Seçenek 1 (Fiyatın altında) en iyi seçenek. Kullanıcı fiyata bakınca hemen "Stokta var" görür ve satın almaya karar verir.

💡

Ek Özellikler (Eklenebilir Badge'ler)

"Stokta var" dışında ekleyebileceğiniz diğer bilgiler.

🚚

Ücretsiz Kargo

Ücretsiz Kargo

Belirli tutar üzeri (örn. ₺500+) siparişlerde göster.

Hızlı Teslimat

24 Saatte Kargoda

Hızlı hazırlanan ürünler için göster.

🛡️

Garanti

2 Yıl Garanti

Warranty_info field'inden otomatik göster.

↩️

Ücretsiz İade

14 Gün İade Hakkı

Tüm ürünlerde varsayılan göster.

🔒

Güvenli Ödeme

SSL Güvenli Ödeme

Ödeme sayfasına güven artırır.

Orijinal Ürün

%100 Orijinal

İthal ürünlerde göster.

💡 Öneri: İlk etapta sadece "Stokta var" ekleyelim. Sonra badge sistemini kullanarak diğer özellikleri de ekleyebiliriz (zaten badge sistemi mevcut!).

📊

Uygulama Adımları

Kod değişiklikleri ve test süreci.

1

Product Card Component Güncelleme

resources/views/components/ixtif/product-card.blade.php

  • • Stok durumu kontrolü ekle (stock_tracking + current_stock)
  • • "Stokta var" badge'i ekle (fiyatın altına)
  • • Yeşil renk, ✓ icon kullan
2

Tailwind CSS Safelist Güncelleme

tailwind.config.js

  • • Yeşil badge renkleri safelist'e ekle (purge koruması)
  • • bg-green-600, text-green-400 vb.
3

Build ve Cache Temizleme

  • npm run prod
  • php artisan view:clear
  • php artisan responsecache:clear
4

Test

  • • Ürün listesi sayfasını kontrol et (desktop + mobile)
  • • Google Search Console test et (Rich Results)
  • • Schema.org stok durumu zaten mevcut (getAvailabilitySchemaUrl)
⚠️

Dikkat Edilecek Noktalar