WooCommerce Kategori sayfasını nasıl ayarlar (eklenti ve kodlama)
Kategori sayfanızı düzenlemek ister misiniz? Bu kılavuzda, WooCommerce kategorisi sayfalarını eklentilere ve eklentilere göre ayarlamak için size çeşitli yöntemler göstereceğiz. Kategori sayfaları genellikle en çok göz ardı edilen sayfalardan biridir ve en azından e -ticaret mağazasında ayarlanmıştır. Bunun nedeni, genellikle ürün ve mağaza sayfası arasındaki hiyerarşiye bir köprü görevi görmesidir. Bununla birlikte, kullanıcıların ürüne göz atmak için kategori sayfalarına güvendiği bazı pratik senaryolar vardır, bu nedenle onu düzenlemek ve mümkün olduğunca kullanmak mantıklıdır. WooCommerce’deki kategori sayfalarını ayarlamak için çeşitli yöntemlere bakmadan önce, bunu yapmanın faydalarını daha iyi anlayalım.
Neden Woocommerce Kategori sayfasını düzenliyorsunuz? Kategori sayfası, bu kategoride yer alan tüm WooCommerce Shop ürünlerinizi görüntüler. Kullanıcılar genellikle diğer sayfaları kullanan ürünleri arsa da, bazen müşteriler kategori sayfasından öğeler bulmayı daha kolay bulurlar. Örneğin, ürünün adından emin değilseniz, ancak kategoriyi biliyorsanız, kategori sayfasını kullanarak ürünleri arayabilirsiniz. Ayrıca, kategori sayfasından olumlu etkilenirse müşterileriniz web sitenizde daha uzun süre kalabilir. Bu sayfa genellikle göz ardı edildiğinden, ayarlarsanız, müşterinizin deneyimini öne çıkaracak ve geliştireceksiniz.
İyi haber şu ki, WooCommerce kategori sayfasını kolayca ayarlamanıza izin veriyor. Kötü haber, WooCommerce tarafından sağlanan varsayılan seçenek oldukça sınırlıdır. Yalnızca adınızı, salyangozunuzu, üst kategorinizi, açıklama metninizi, ekran türünü ve mini görüntüsünüzü düzenleyebilirsiniz.
Divi ile
Özel bir eklenti kullanma
Programlanmış (Kodlama)
Bu bölümde, her adım adım tartışacağız, böylece ihtiyaçlarınıza en uygun olanı seçebilirsiniz. Not: Başlamadan önce, WooCommerce’ı doğru ayarladığınızdan ve gerekli tüm sayfaları oluşturduğunuzdan emin olun. 1. Divi ile Woocommerce Kategori sayfasını ayarlayın
Divi, en popüler WordPress temalarından biridir ve iyi nedenlerle. Birçok özellik ile görünür ve WooCommerce ile tamamen uyumludur, bu da kategori sayfalarınızı ayarlamayı ideal hale getirir. Bu tema, özel bir kategori sayfası şablonu yapmanızı sağlayan bir sürükleme ve varsayılan üreticiyle birlikte gelir. Bu şekilde, kategori sayfası için bir şablon oluşturabilir ve Woocommerce mağazanızdaki her şey için kullanabilirsiniz. Divi’yi bu kadar kolaylaştıran şey, doğrudan önizleme ile gerçek zamanlı olarak üreticiyle yaptığınız tüm değişiklikleri görebilmenizdir. Divi ayrıca, sayfanıza birçok öğe eklemek için çeşitli modüller sağlar ve kategori sayfanızı oluştururken veya düzenlerken çok zaman kaydetmenize yardımcı olur. 1.1. Divi’yi kurun ve etkinleştirin Divi’yi kullanmaya başlamak için, önce yüklemeli ve etkinleştirmelisiniz. Zip Divi dosyasını resmi web sitelerinden indirebilirsiniz. Ardından, WordPress kontrol panelinizi açın ve görünüm> temalar> yeni ekleyin.
Temayı yükleyin ve sitenize yüklemek için indirilmiş .zip divi dosyasını seçin. Yüklendikten sonra, temayı yüklemek ve kurulum tamamlandıktan sonra etkinleştirmek için şimdi yükleyin.
Divi temalarını etkinleştirmek, kategori sayfalarını ayarlamak için kullanacağımız varsayılan sayfa yapıcılar olan Divi üreticilerini otomatik olarak yükleyecektir. 1.2. Özel bir kategori sayfası şablonu oluşturun Özel bir kategori sayfası şablonu oluşturmaya başlamak için Divi> Tema Oluşturucu’ya gitmeniz ve yeni şablonlar eklemeniz gerekir. Ardından, Arşiv sayfasının altındaki tüm ürün kategorisi sayfaları için kutuyu işaretleyin ve bir şablon oluşturun. Bundan sonra, yeni eklediğiniz yeni şablona özel gövde ekleyin. Divi ile tamamen yeni bir şablon yaptığımız için özel gövde oluşturma seçeneğini de seçin. Orada 3 farklı seçenek göreceksiniz: Divi kütüphanesinden şablonlardan birinin başlangıcından şablonunuzu oluşturun ve Woocommerce Kategori sayfanızı ayarlamak için daha fazla kullanın. Mevcut sayfaları klon ve ürün kategorinizin tüm sayfaları için bir şablon olarak kullanın
Sizin için en uygun seçeneklerden birini seçebilirsiniz. Bu öğretici için yapıdan sıfırdan seçeceğiz, böylece BİR BİR BAŞLAT düğmesine basarız.
Şablonunuzu oluşturmak için Divi Builder’ı kullanacağınız kategori sayfasının düzenine yönlendirileceksiniz. Şablonunuzu oluşturmaya başlamak için yapıyı seçmelisiniz. Yeni satır altında, kategori sayfanız için istediğiniz satır türünü seçin. Birkaç satır ve sütun ekleyebilirsiniz. Başlık için en az 2 satıra ihtiyacınız var ve kategori sayfasını dolduruyorsunuz, ancak kategori sayfanıza yan çubuğu eklemek istiyorsanız daha fazla sütun da olabilir.
Satır ve sütun sayısını seçtikten sonra, daha fazla kategorinin kategorisinin düzenini ayarlamak için bir divi modülü eklemeniz gerekir.
1.3. Kategori Sayfası Başlığı Kategori sayfaları kategorisi için, kategori sayfanız için bir sayfa başlığı ve ekmek kırıntıları eklemeniz gerekir. Gönderi başlığını eklemek için satırdaki ‘ +’ simgesini tıklayın, arama çubuğundaki yayın başlığını bulun ve seçin. Farklı bir yazı başlığı seçeneği göreceksiniz. Üstün meta ve görüntüler ekleyebilirsiniz, ancak bu eğitim için kullanmayacağız, bu nedenle eleman bölümünün altındaki meta görüntüleme ve üstün görüntüleri görüntüleme seçeneğini devre dışı bırakacağız. Web sitesi önizlemesini gördüğünüzde otomatik olarak dinamik yazı başlığını görüntüleyeceğinden, burada herhangi bir başlık eklemeniz gerekmediğine dikkat edilmelidir. Buna ek olarak, Tasarım sekmesinden, arka plan renklerini ve yazı tipi başlıklarını düzenleyebilirsiniz. CSS kimlikleri, sınıflar, özel CSS, kaydırma efektleri ve daha fazlasını eklemek için bazı gelişmiş seçenekler de vardır. Gerekli tüm değişiklikleri yaptıktan sonra, değişiklikleri kaydetmek için “Kontrol” simgesini tıklayın.
1.3.1 – Ekmek kırıntısı modülünüzü ekleyin Kategori sayfasında ek gezinme için bir ekmek grumbs modülüne de ihtiyacınız var, bu nedenle yeni bir modül eklemek ve “woo breadcrumb” için arama yapmak için ‘ +’ simgesini tekrar tıklayın. Ardından, İçerik sekmesinin altındaki ürün bölümünde bu ürün seçeneğini seçin. Bu, müşterilerinizin görmek istediği ürün kategorisine dinamik bir başlık ekleyecektir. Bir kez daha, tasarım sekmesini kullanarak gereken değişiklikleri yapın ve devam edin ve son olarak değişiklikleri kaydetmek için “Kontrol” simgesini tıklayın. 1.4. Kategori sayfasını doldurun Başlığı düzenlemeyi bitirdikten sonra, kategori sayfası gövdesine geçebilirsiniz. Satıra girmediyseniz, ” +” Yeşil simgeyi tıklayın ve eklemek istediğiniz satır türünü seçin. Bundan sonra, mağazanız için tüm ürünleri içerdiğinden buraya bir mağaza modülü eklemeniz gerekir. Sıradaki ” +” simgesine basın ve mağaza modülünü arayın. Tıkladıktan sonra, ürününüzün seçeneklerini kategori sayfasında yapılandırabilirsiniz. İçerik sekmesinde, kategori sayfanız için tüm öğeleri düzenleyebilirsiniz. Çevrimiçi mağazanızdaki müşteriler tarafından seçilen belirli ürün kategorilerinden ürünleri görüntülemek için geçerli sayfayı kullanarak etkinleştirdiğinizden emin olun. Şimdi tek yapmanız gereken diğer sayfa ekran öğelerini düzenlemek. Örneğin, sayfa başına görüntülenecek sütun veya ürün sayısını ve buradan sayfalandırmayı ekleyebilirsiniz. Ayrıca, Tasarım sekmesinden ve gelişmiş ürün yazı tiplerini ve fiyat metnini ve daha fazlasını düzenleyebilirsiniz. Gerekli tüm değişiklikleri yaptıktan sonra, değişiklikleri depolamak için “Kontrol” simgesine basın. Divi Builder ile daha fazla çizgi ekleyebilir veya altbilgi alanını ayarlayabilirsiniz, her şeyi bitirdikten sonra gövde şablon gövdesini ekranın sağ alt kısmında saklamayı unutmayın. Değişikliklerinizi kaydettikten sonra Divi Builder’ı kapatın ve gösterge panosuna yönlendirileceksiniz Tema oluşturucu. Şablonunuzdaki değişiklikleri kaydetmek için değişiklikleri de buraya tıklayın. Artık her ürün kategorisinin kategori sayfasını gördüğünüzde, tüm değişikliklerinizi görebileceksiniz.
2. Divi kullanmıyorsanız ve mevcut temanızı değiştirmek istemiyorsanız, WooCommerce Kategori sayfasını ayarlayın, WooCommerce kategorisi sayfasını düzenlemek için en iyi seçenek özel bir WordPress eklentisi kullanmaktır. Bu öğretici için, ücretsiz, kullanımı kolay olduğu ve kategori sayfasını birkaç tıklamada ayarlamanıza izin verdiği için kategori eklentisi kategorisini kullanacağız. Bu araç esas olarak kategori sayfası açıklaması alanına odaklanır ve size bunun için bir editör verir. Bu şekilde, kategori sayfasında görüntülenecek ürün kategorisi açıklamasını düzenleyebilirsiniz. Bu eklentiyi kullanmaya başlamak için WordPress kontrol panelinizde, eklentileri açın> Yeni ekleyin. Ardından, kategori düzenleyicisini arayın, şimdi yükleyin, ardından eklentiyi etkinleştirin. Eklentiyi doğrudan WordPress deposundan indirerek manuel olarak da yükleyebilirsiniz. Bu işlem hakkında daha fazla bilgi edinmek istiyorsanız, eklentileri manuel olarak nasıl yükleyeceğiniz konusundaki kılavuzumuzu görebilirsiniz. Kategori düzenleyicisini etkinleştirdikten sonra, ürün> kategorisini açın ve açıklamayı ayarlamak istediğiniz kategoride düzenleme basın. Burada, metin yazı tipini, başlığı değiştirebileceğiniz açıklama alanına eklendiğini göreceksiniz. Liste ve tesviye. Ayrıca, kategori görüntüleri ekleyebilir ve kategori açıklamasını küçük bir kodla ayarlamak için Metin sekmesini kullanabilirsiniz. Gerekli tüm değişiklikleri yaptıktan sonra, kategori sayfanızdaki güncelleme ve önizleme değişikliklerine basın. Woocommerce kategorisi sayfanızı bir eklenti ile bu şekilde ayarlarsınız. Ancak, daha fazla ayarlama seçeneği istiyorsanız ve kodlama becerileriniz varsa, kendi çözümünüzü kodlayabilirsiniz. Nasıl yapılacağını görelim. 3. Divi kullanmıyorsanız ve herhangi bir üçüncü taraf aracı yüklemek istemiyorsanız, WooCommerce Kategori sayfasını ayarlayın, kendi çözümünüzü kodlamak çok iyi bir seçimdir. Kategori sayfalarını düzenlemenin ana avantajı, programlanmış bir şekilde size daha fazla esneklik sağlamaktır. Deneyimli bir geliştirici olmasanız bile, WooCommerce size bu süreçte size yardımcı olacak bazı kısa kodlar ve kısa kod öznitelikleri sunar. Kısa kodlara alışık değilseniz, nasıl kullanılacağını daha iyi anlamak için bu kılavuza bakın. Bu kısa kodla, ürün kategorisini herhangi bir sayfada görüntüleyebilirsiniz: [Product_category] – Belirli ürün kategorilerini görüntüleme [Product_categories] – Mağazanızdaki tüm ürün kategorilerini görüntüler Ürün kategorisini görüntüleme şeklini değiştirmek için ürün kategorisi özellikleriyle birlikte kullanabilirsiniz. Örneğin, üst düzey ürün kategorisini görüntülemek ve alt kategoriyi gizlemek istiyorsanız, aşağıdaki kısa kodu kullanabilirsiniz: [ürün_categorileri numarası = “0” parent = “0”] Üst düzey kategoriyi görebileceksiniz Sayfalarınızı gördükten sonra. Ayrıca, Woocommerce’deki kategori sayfalarınızı düzenlemek için çeşitli kod görüntülerini de kullanabilirsiniz. En yaygın örneklerden biri özel bir kategori oluşturmaktır. Size nasıl yapılacağınızı göstermeden önce, WordPress sitenizi rezerve ettiğinizden ve bir çocuk teması kullandığınızdan emin olun. Bazı temel tema dosyalarını değiştireceğiz, böylece bir hata oluşursa, sitenize zarar verebilirsiniz. Bu nedenle, herhangi bir sorundan kaçınmak için geri yükleyebileceğiniz bir yedekleme sürümüne sahip olmanız önerilir. Bir Kod Görüntüleri kullanarak özel bir kategori sayfası başlığı oluşturmak için özel bir kategori sayfası başlığı oluşturun, görünüm> tema düzenleyicisini açmanız ve çocuğunuzun temasından function.php dosyasına aşağıdaki kod görüntülerini eklemeniz gerekir. add_filter (‘wooocommerce_page_title’, ‘ql_customize_wooocommerce_page_title’, 10, 1);
İşlev ql_customize_wooocommerce_page_title ($ page_title) {
// Ürün kategorisi için özel başlık ‘T-Shirts’ if (is_product_category (‘t-shirts’))) {$ page_title = ‘bir şey’;}
// Ürün kategorisi için özel başlık ‘hoodies’
elseif (is_product_category (‘hoodies’)) { $ page_title = ‘başka bir şey’;} dönüş $ page_title;
} Snippet’ler hakkında daha fazla bilgi için bu siteye bakın.Bu şekilde kategori sayfasındaki varsayılan kategori yerine özel bir başlık görüntüleyebilirsiniz.Ürün kategorisi sayfasının arka planını değiştirin.Funts.php dosyasına aşağıdaki kod parçacıklarını bir kez daha yapıştırmanız yeterlidir.if (is_product_category ()) {add_action (‘wp_head’, function () {?> .wooocommerce.post-type-desKive-ürün ürünleri /stil> Doğrudan Ödeme> Arşivleri WordPress Gösterge Tablonuzda Açın. Açılır listeden Evet’i seçerek Hızlı Görünüm Ekle düğmesi seçeneğini etkinleştirin ve ardından değişiklikleri kaydedin.
Sitenizi önden kontrol ederseniz, “Şimdi Satın Al/Sepete Ekle” düğmesinin hemen yanında görünen yeni bir düğme olduğunu göreceksiniz.Örneğin, mağaza temasını kullananlar için düğme ekranı böyledir. Hızlı Görünüm düğmesine tıkladığınızda, açılır başlık, fiyat, açıklama ve ürünler hakkında en önemli bilgilerle açılır. yakında.Bu şekilde, müşteriler ürün sayfasını açmak zorunda kalmadan hemen sepetlerine ürün ekleyebilirler.
Ardından Hızlı ve Açılır Ekran düğmesini ayarlayabilirsiniz. Bunun nasıl yapılacağı hakkında daha fazla bilgi için WooCommerce’a hızlı bir ekran ekleyeceğiniz konusundaki kılavuzumuza bakın. Kategori Sayfalarınızı Değiştirme Önerileri Daha önce belirtildiği gibi, kategori sayfanızın tüm tasarımı ve arayüzü çevrimiçi mağazanızı geliştirmek için çok önemlidir. Bu, satın almadan önce aynı kategorideki çeşitli ürünleri karşılaştırabileceğiniz çok kullanışlı bir sayfadır. İyi tasarlanmış kategori sayfası, çevrimiçi mağazanızda müşterileri daha uzun süre korumanıza yardımcı olabilir. Mağazanızdaki deneyim ne kadar iyi olursa, sadık müşteriler satın alma ve olma olasılıkları o kadar artar. Kategori sayfanızı mümkün olduğunca en iyi şekilde kullandığınızdan ve rakiplerinizden öne çıktığınızdan emin olmak için, bunları bir sonraki seviyeye getirmek için bazı önerilerdir. 1. Binlerce kelimeye değer bir resim olan çevrimiçi alışveriş hakkında konuşurken büyük bir ürün resmi ekleyin. Alıcılar, ürün sayfasını açmadan önce ilgilendikleri ürünlerin büyük ve net görüntülerini görmek istiyorlar. Ancak bu, kategori sayfası için çok büyük bir ürün görüntüsü kullanmanız gerektiği anlamına gelmez. Çok büyük görüntüler daha ağır olma ve sitenizi yavaşlatma eğilimindedir, bu nedenle büyük görüntüler ve site hızı arasında iyi bir denge bulun. Örneğin, 300-400 piksel görüntü boyutuyla 3 sütun kategorisi sayfasını kullanabilirsiniz. Bu, ortalama monitör veya mobil cihazda gereken ürün ayrıntılarını görüntülemek için yeterli olmalıdır.
En ünlü spor giyim markalarından biri olan Nike kategorisinde iyi bir örnek görebilirsiniz. Nike, ürün küçük resim görüntüsü için yeterli olan net ve büyük bir görüntü kullanır. Ayrıca, çevrimiçi alışverişin çoğunlukla bugün mobil cihazlarda yapıldığını unutmayın. Boyut ve tasarımın her ekran boyutu için uygun olması için masaüstünde ve hücresel kategori sayfalarını test ettiğinizden emin olun. 2. İlginç bir başlık görüntüsü kullanın Hepimiz ilk izlenimin çevrimiçi alışveriş açısından önemli ve daha fazla olduğunu biliyoruz. Müşteriler kategori sayfasını açtıklarında, dikkat ettikleri ilk şey sayfa başlığıdır. Bu nedenle, her kategori için ilginç bir başlık kullandığınızdan emin olmanız gerekir. İlginç bir başlık yapmanın en iyi yollarından biri başlık görüntüleri eklemektir. Sitenizin genel tasarımını hatırlayın ve başlık görüntüsünü çevrimiçi mağazanızın genel renk şemasıyla eşleştirin. Örneğin, başlık görüntülerini Mac Cosmetics gibi birçok moda odaklı çevrimiçi mağazada bulabilirsiniz.
Gördüğünüz gibi, Mac başlık görüntülerini görüntülemek için çok yaratıcı bir yol kullanır.Kategori başlık görüntüsü resimden oluşur ve ayrıca koyu renk şemasını bir başlık menüsü ile eşleştirir.3. Her zaman ekmek kırıntılarının ekmek kırıntısı göründüğünü koruyun, site ziyaretçilerinizin doğru yerde olduğundan emin olmak için en kullanışlı unsurlardan biridir.Breadyrumb ayrıca kullanıcıların sitenizde gezinmelerine yardımcı olan ve aradıklarını daha hızlı bulmalarına ve alışveriş deneyimlerini geliştirmelerine yardımcı olur.Ürünü izlerken, bazen müşteriler farklı şeyleri tıklar ve mağazanızda kaybolabilir.Ekmek kırıntılarını her zaman görünür hale getirerek, kullanıcılar hemen nerede olduklarını görebilir ve istenen kategoriye kolayca geri dönebilirler.
Bazı siteler kategoriyi yan çubukta görüntülemeyi tercih eder, ancak çoğu çevrimiçi mağaza navigasyon yolları kullanır, çünkü müşterilerin bir önceki yere dönmesi daha kolaydır. Yukarıdaki öğreticiyi Divi ile takip ettiyseniz, ekmek kırıntıları sergilemek sorun olmayacaktır. Farklı bir tema kullanıyorsanız, her sayfaya ekmek kırıntıları ekleyip göstermeyi öğrenmek için bu kılavuza bakın. 4. Ürünün doğru kategoride olup olmadığını kontrol edin, bu açıkça görülebilir olsa da, ürünü manuel olarak eklerken hatalar oluşabilir. Yani bu nokta bir öneriden daha fazla bir hatırlatmadır. Tüm ürünlerin doğru kategoriye göre belirlendiğinden ve karıştırılmamasını sağlamak için rutin kontroller yapın. Her gün kontrol etmenize gerek yok, ancak zaman zaman yapmak önemlidir. Ayrıca ürünler, kategoriler ve açıklamalardaki yazım hatalarını da kontrol edebilirsiniz. Ürün veya kategorideki herhangi bir hata, web sitenize gelen ziyaretçilerin izlenimini etkileyebilir. Bir çevrimiçi mağazayı izliyor ve dizüstü bilgisayar kategorisinde kot pantolon buluyorsanız ne düşünüyorsunuz?
Bazen bir sınav yapmak çok fazla zaman almaz ve her şeyi düzenlemenize yardımcı olacaktır. E -ticaret mağazanızı geliştirmek istiyorsanız, çevrimiçi mağazanızı optimize etmek için Woocommerce ipuçlarımıza bakın. Sonuç Genel olarak, kategori sayfanız mağazanızda önemli bir rol oynar. Rakiplerinizden öne çıkmak için WooCommerce Kategori sayfanızı ayarlamanız ve ellerinden gelenin en iyisini kullanmanız gerekir. Benzer şekilde, mağazalarınızı, ürünleri, hesaplarımı ve ödeme sayfalarını, kullandığınızda tüm mağazanızı değiştirmek için düzenleyebilirsiniz. Kapanışta, kategori sayfalarınızı düzenlemek için çeşitli yöntemleri tartıştık: Divi ile
Özel bir eklenti kullanma
Programlanmış Bu kılavuzun yararlı olduğunu ve kategori sayfalarınızı kolayca düzenleyebileceğinizi umuyoruz. Ayrıca, kategori sayfanızda ürünün hızlı bir şekilde ekranını eklemek için size bir bonus ipucu verdik. Son olarak, kategori sayfalarınızı iyileştirmek ve daha iyi bir görüntü kullanarak dönüşüm oranınızı artırmak ve ekmek kırıntılarını her zaman görünür hale getirmek için bazı öneriler görüyoruz. Bu öğretici faydalısa, aşağıdaki öğreticiyi de görmenizi öneririz: WOOOCOMMERCE’deki sepete ekle düğmesi nasıl gizlenir ve silinir Woocommerce Sepet sayfasını ayarlayın Wooocommerce ödemelerine ücret nasıl eklenir