Yapay Zeka ile Ticimax SEO Geliştirme

Yapay Zeka ile Ticimax SEO Geliştirme

Yıllar önce sektöre yazılımcı olarak başlamış olmanın en büyük avantajı, ChatGPT ile oluşturduğum kodu okuyup eksik parçaları bir araya getirebilmemdir.

Yakın zamanda woocemmerce kullanıcıları için yaptığım bir paylaşımda, kaynak dosyalarına erişimle İleri Düzey SEO geliştirmeleri yapılabileceğinden bahsetmiştim. Link : https://lnkd.in/grvThWCe

Rayzer Digital ekibi olarak, yalnızca WordPress altyapısını değil, SEO hizmeti verdiğimiz Ticimax altyapısına sahip aşağıdaki projemizde özel kod geliştirerek SEO çalışması sağladığımızı duyurmaktan mutluluk duyarım.

Kod’un işlevi;

📌 Belirlediğiniz kategoride, belirleyeceğiniz kategori, ürün v.b sayfalarınıza iç bağlantı sağlayabilirsiniz.

📌 İç bağlantı linkini arttırabilirsiniz.

CSS – Modüller -> Script Yönetimi – > Kategori Dosyası 

/* Ana slider konteyner */
.button-group {
    display: flex;
    justify-content: center; /* Masaüstünde ortalar */
    align-items: center;
    overflow-x: auto; /* Yatay kaydırmayı etkinleştir */
    scroll-snap-type: x mandatory; /* Scroll snapping özelliği */
    gap: 10px; /* Butonlar arasındaki boşluk */
    padding: 10px;
    background-color: #f9f9f9;
    border-bottom: 1px solid #ddd;
    scrollbar-width: none; /* Firefox için scrollbar gizle */
    touch-action: pan-x; /* Mobil cihazlarda yatay kaydırma */
}

.button-group::-webkit-scrollbar {
    display: none; /* Chrome, Safari için scrollbar gizle */
}

/* Slider butonları */
.button-group a {
    flex: 0 0 auto; /* Sabit genişlikte butonlar */
    padding: 10px 20px;
    font-size: 16px;
    text-decoration: none;
    color: #000;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #fff;
    scroll-snap-align: start; /* Scroll snapping noktası */
    transition: all 0.3s ease;
}

.button-group a:hover {
    background-color: #f0f0f0;
    border-color: #000;
}

/* Mobil uyumluluk */
@media screen and (max-width: 768px) {
    .button-group {
        justify-content: flex-start; /* Mobilde butonlar sola yaslanır */
    }

    .button-group a {
        font-size: 14px; /* Daha küçük yazı boyutu */
        padding: 8px 16px; /* Daha kompakt buton boyutu */
    }
}

JavaScript – Modüller -> Script Yönetimi – > Kategori Dosyası 

// Her sayfa için sabit 4 kategori eşlemesi
const categoryMapping = {
"erkek-spor-ayakkabi": [
{ name: "Erkek Ayakkabı", link: "/erkek-ayakkabi" },
{ name: "Erkek Bot", link: "/erkek-bot-ayakkabi-modelleri" },
{ name: "Erkek Sandalet & Terlik", link: "/erkek-sandalet-terlik-modelleri" },
{ name: "Sneaker Erkek Ayakkabı", link: "/sneaker-erkek-ayakkabi-modelleri" }
],
"erkek-ayakkabi": [
{ name: "Erkek Spor Ayakkabı", link: "/erkek-spor-ayakkabi" },
{ name: "Erkek Bot", link: "/erkek-bot-ayakkabi-modelleri" },
{ name: "Erkek Klasik Ayakkabı", link: "/erkek-klasik-ayakkabi" },
{ name: "Yazlık Erkek Ayakkabı", link: "/yazlik-erkek-ayakkabi" }
],
"erkek-bot-ayakkabi-modelleri": [
{ name: "Erkek Klasik Ayakkabı", link: "/erkek-klasik-ayakkabi" },
{ name: "Erkek Spor Ayakkabı", link: "/erkek-spor-ayakkabi" },
{ name: "Erkek Ayakkabı", link: "/erkek-ayakkabi" },
{ name: "Erkek Casual Ayakkabı", link: "/erkek-casual-ayakkabi" }
],
"sneaker-erkek-ayakkabi-modelleri": [
{ name: "Erkek Günlük Ayakkabı", link: "/erkek-gunluk-ayakkabi" },
{ name: "Yüksek Taban Erkek Ayakkabı", link: "/yuksek-taban-erkek-ayakkabi" },
{ name: "Erkek Spor Ayakkabı", link: "/erkek-spor-ayakkabi" },
{ name: "Erkek Ayakkabı", link: "/erkek-ayakkabi" }
]
};

// Bulunduğunuz sayfayı algılar
function getCurrentPage() {
    const path = window.location.pathname;
    return path.split("/").filter(Boolean).pop(); // URL'deki son parçayı alır
}

// İlgili kategorileri alır ve butonları oluşturur
function renderCategories() {
    const currentPage = getCurrentPage();
    const relatedCategories = categoryMapping[currentPage];

    if (!relatedCategories) return; // Sayfa eşleşmesi yoksa çık

    const container = document.getElementById("category-buttons");
    relatedCategories.forEach(category => {
        const link = document.createElement("a");
        link.href = category.link;
        link.textContent = category.name;
        container.appendChild(link);
    });
}

// Sayfa yüklendiğinde çalıştır
document.addEventListener("DOMContentLoaded", renderCategories);

HTML – Tasarım – Blok Yönetimi – Kategori – Yeni Blok Ekle 

<div class="button-group" id="category-buttons">
    <!-- Dinamik butonlar buraya eklenecek -->
</div>