WooCommerce Ürün Listesi Görünümü Nasıl Oluşturulur?

ProductX, E-mağazanız üzerinde maksimum özelleştirilebilirlik sağlayan bir WooCommerce blok eklentisidir. Tasarım açısından bakıldığında, hafif ayak izi ve özellik seti nedeniyle WooCommerce için en iyi ürün ızgarası eklentilerinden biridir.

Yani ProductX ile bir WooCommerce Ürün Listesi Görünümü'nün nasıl oluşturulacağını bilmek ister misiniz?

Bir WooCommerce Ürün listesi oluşturmak için yapmanız gerekenler:

• ProductX eklentisini indirin ve etkinleştirin .
• ProductX Blok Kitaplığından bir tasarım ön ayarı seçin.
• Ürünleri tam istediğiniz gibi sergilemek için Bloğu Özelleştirmeye Başlayın!

Ve hepsi bu kadar. ProductX ile çalışmanın ne kadar kolay olduğunu göstermek için bu adımların her birinde sizinle konuşacağız.

Adım 1: ProductX'i İndirin ve Etkinleştirin

productX'i indirmek ve etkinleştirmek, diğer eklentilerle çalışmakla aynıdır. Tüm yapman gereken:

• WordPress kontrol panelinizde Eklentiler> Yeni Ekle'ye gidin.

• Arama Çubuğunu kullanarak ProductX'i arayın .
• ProductX göründüğünde, Kur'a basın.
• Son olarak, Etkinleştir'e tıklayın.

Etkinleştirildiğinde, bir ProductX Ayarları Menünüz olacak . Buradan, ProductX eklentilerini etkinleştirebilir, lisansınızı güncelleyebilir ve kayıtlı şablonlarınıza erişebilirsiniz. Bir Pro Plan'a yükseltmek isterseniz (ücretsiz sürümden çok daha fazla özellikle gelir), belgelere göz atabilirsiniz.

2. Adım: ProductX Blok Kitaplığından bir Tasarım Ön Ayarı ekleyin

ProductX, sağlıklı bir blok kitaplığı ve önceden hazırlanmış yerleşim tasarımları ile birlikte gelir. Bunların hepsi farklı tasarım özelleştirme özelliklerine sahiptir. Ve blok kitaplığından en sevdiğiniz tasarımı seçme seçeneğine sahipsiniz (ücretsiz sürümde tasarım sınırlamaları var, biliyorsunuz!).

Bunu yapmak için:

• Sol üstteki Blok Kitaplığına gidin.
• Burada ücretsiz ve ücretli ürün blokları ve düzenleri arasından seçim yapabilirsiniz. Size temel bilgileri vermek için ücretsiz bir liste düzeni (Ürün listesi #1) seçeceğiz.

• Seçmek istediğimiz tasarım için İçe Aktar'a basacağız. Sayfanıza/gönderinize eklenecektir.

Bu ortadan kalktığında, istediğimiz ürünleri sergilemek için bloğu özelleştirmeye başlayabiliriz.

Adım 3: WooCommerce Ürün Listesi Görünüm Bloğu'nu Özelleştirmeye Başlayın

Bunu tüm sürecin ana parçası olarak düşünebilirsiniz. Görüyorsunuz, herhangi bir özelleştirilebilir seçenek olmadan, size bunların hiçbirini göstermenin bir anlamı yok.

Ancak ProductX, çok kullanışlı bir dizi özellik özelleştirme aracına sahiptir. Ve tüm bu ayarlardan yararlanmaya çalışacağız. Hadi başlayalım!

Seçtiğiniz bloğu içe aktardığınızda (bizim durumumuzda bu, Ürün listesi #1 bloğudur), solda 3 farklı ayar sekmesi göreceksiniz.

Tasarım sekmesi ve Gelişmiş Sekmesi çoğunlukla temel tasarım amacına yöneliktir. Tasarımı değiştirmeyi, ek CSS özellikleri eklemeyi, ürün bloğu için evrensel tasarım özellikleriyle oynamayı seçebilirsiniz. Bu tasarım özelliklerini keşfedebilirsiniz.

Şimdilik, son kullanıcı için daha çekici hale getirmek için blokların tasarımını değiştirmeye odaklanacağız.

• Genel sekmesi altında, özellikleri Etkinleştirme/Devre Dışı Bırakma seçeneklerini bulacaksınız. Ayrıca, Satır ve Sütun özelliklerini değiştirebilirsiniz.

• Gelişmiş Sorgu , bahsetmek istediğimiz ilk kullanışlı özelliktir. Durumunuzu tam olarak karşılayan ürünleri göstermek için Hızlı Sorgu Açılır menüsünden bir koşul seçebilirsiniz. İndirimdeki Giysileri gösteriyoruz. Ayrıca, Sipariş Açılır menüsünden Yeniden En Eskiye doğru sırayı seçiyoruz.

• Ardından, göstermek istediğimiz ürünler için AJAX Filtrelemeyi ayarlamak istiyoruz. Gösterilecek Kategori olarak Giyim'i seçiyoruz. Ayrıca, kategoriye göre göstermeyi seçiyoruz. Ayrıca aşağıda görebileceğiniz vurgulu özelliklerini de değiştiriyoruz:

• Hem Fiyat hem de İnceleme , renk ve diğer ilgili tasarım özelliklerine sahiptir. Onları varsayılan olarak tutuyoruz.
• Ardından Sepet Ayarlarına gelir. Birçoğunuz WooCommerce Sepete Ekle Düğme Metnini nasıl değiştireceğinizi bilmek istiyorsunuz. Eh, ProductX yerleşik olarak bu seçeneğe sahiptir. "Sepete Ekle" yazısını sayfada görünen "SATIN AL " olarak değiştirdik. Önizlemede görünen vurgulu özelliğinde de bazı özelleştirmeler yaptık.

• Ürün Görsel Ayarlarında farklı değişiklikler yapabilirsiniz. Şimdilik, görüntü genişliğini değiştiriyoruz ve Hover Animation açılır menüsünden bir animasyon ayarlıyoruz. Ayrıca, bir WooCommerce Ürün Sayfası için süper kullanışlı bir özellik olan Görüntü Çevirme özelliği seçeneğini 'Açık' olarak tutuyoruz.

• Son olarak, Başlık ve Başlık Ayarları var. Bu ayarların her ikisi de hizalama, tipografi, renk, kenarlık vb. gibi benzer tasarım ayarlarına sahiptir.

Bu, liste görünümü düzeniyle özel bir WooCommerce Ürün Sayfasını nasıl tasarlayabileceğinize daha çok genel bir bakış niteliğindedir. Basit, sezgisel ve en önemlisi Roket Bilimcisi olmanızı gerektirmiyor!

Aralarından seçim yapabileceğiniz birçok tasarım seçeneği var. Nitekim her gün sürekli olarak yeni ürün tasarım blokları eklenmektedir. Kısacası, olasılıklar sonsuzdur!

ProductX'in ücretsiz sürümü tüm temel özelliklerle iyi bir donanıma sahip olsa da Wishlist eklentisi, Image Flip eklentisi, hızlı görüntüleme eklentisi, kayıtlı şablon eklentisi ve daha fazlası gibi özelliklerden yararlanmak için etkinleştirilmiş bir profesyonel lisansa ihtiyacınız olacak.

Tüm bu özellikler, kullanıcı için daha yaratıcı seçeneklerin kilidini açar. Bu özelliklerle daha profesyonel görünümlü E-ticaret ürün sayfalarını kolaylıkla oluşturabilirsiniz.

SSS

S: WooCommerce için manuel olarak bir Ürün Listesi Görünümü düzeni oluşturabilir miyim?

Cvp.: Evet, kesinlikle yapabilirsiniz. Ancak önceden kodlama bilginiz yoksa, mükemmel eklentilere ve özelleştirme özelliklerine sahip oldukça hafif bir eklenti olduğundan, ProductX'e bağlı kalmak muhtemelen daha iyidir. ProductX ile önceden herhangi bir kodlama bilgisine ihtiyacınız yoktur. Bu sadece birkaç tıklama meselesi.

S: Tek bir Gutenberg ürün bloğuna kaç Ürün ekleyebilirim?

Cvp.: Herhangi bir sınırlama yoktur. Dizginler sende. Liste görünümünde istediğiniz kadar ürün tutabilirsiniz. Ayrıca belirli bir sayfadaki her blok için tasarım parametrelerini ayrı ayrı ayarlayabilirsiniz.

S: Ürünlerimi sergilemek için dinamik kaydırıcılar eklemek istiyorum. Bunu yapabilir miyim?

Cvp.: Evet, ProductX bu özel amaç için önceden yapılmış Gutenberg bloklarına sahiptir. Bu tasarımları seçebilir ve Dinamik Kaydırıcı tasarım özelliklerini tercihinize göre ayarlayabilirsiniz.

S: ProductX, Kısa Kodlar için destekle birlikte gelir mi?

Cvp.: Daha yüksek kaliteli WooCommerce eklentilerinden bazıları gibi, ProductX de özel kısa kodları destekler. Tasarımlarınızı şablon olarak kaydedebilirsiniz. Diğer sayfalarda kullanmanız için özel kısa kodlar oluşturulacaktır.

S: Yeni Gutenberg Ürün Bloklarına ve Düzenlerine nasıl erişebilirim?

Cvp.: ProductX eklentisini güncel tutarsanız, en son Ücretli tasarımlara ve düzenlere kolayca erişebilirsiniz. ProductX sık sık güncellemeler yayınlar. Bu nedenle, eklentiyi güncel tutmak isteyebilirsiniz.

En sonunda,

ProductX'ten daha iyi WooCommerce Ürün Listesi Görünümü eklentileri olduğu iddia edilebilir. Bu bir dereceye kadar doğru olabilir.

Ancak bu özelleştirilebilir Gutenberg Ürün Blokları Eklentisi kendi başına benzersizdir. Özelleştirme üzerinde çok fazla kontrole sahip çok az eklenti var.

Neden bir deneyip doğruyu söyleyip söylemediğimize bakmıyorsunuz!