Flatsome temalı özel bir WooCommerce ürün sayfası oluşturun

Flatesome Teması

Flatsome , e-Ticaret web siteleri için tasarlanmış güçlü bir WordPress temasıdır ve WooCommerce entegrasyonu ile birlikte gelir.

ThemeForest'taki en popüler WooCommerce temalarından biridir. Bu öğreticiyi yazarken, 174.500'ün üzerinde satış ve 6.600'den fazla incelemeden gelen harika bir 4.8 yıldızlı derecelendirme oldu.

Flatsome, öncelikle yeni başlayanlar ve teknoloji konusunda bilgili olmayan kullanıcılar düşünülerek tasarlanmıştır.

Bu, çevrimiçi bir işletmeye başlamak isteyen ancak kodlamayı bilmeyen veya profesyonel bir kodlayıcı kiralamak için bütçesi olmayan kişiler için harikadır. Flatsome ile basit ve sezgisel araçlar kullanarak profesyonel görünümlü bir web sitesi oluşturabileceksiniz.

Şimdi Flatsome, tonlarca harika özellik ve işlevle dolu olarak geliyor. Neyin mevcut olduğunu ve nasıl çalıştığını göstermek için, Flatsome kullanarak bir WooCommerce ürün sayfasını nasıl oluşturacağınızı gösteren hızlı bir eğitimimiz var.

Neyse lafı fazla uzatmadan başlayalım:

İçerik tablosu:

Flatsome, WooCommerce ve WordPress arasındaki fark

Yeni okuyucularımızı memnuniyetle karşıladığımızda, tüm okuyucularımızın aynı sayfada olmasını sağlamak için bazı gerekli bilgileri girmeliyiz. Burada, bu makale boyunca kullanacağımız üç terminolojideki farkı tartışacağız.

WordPress ile başlayalım. Web sitenizi oluşturmak için farklı temalar ve plugin kurduğunuz bir platformdur. Gereksinimlerinize göre diğer görevleri yerine getirmek için binlerce plugin ve tema mevcuttur.

WooCommerce, WordPress'e kurduğumuz ve web sitemize farklı özellikler eklemenizi sağlayan bir plugin . Bu plugin kurulumuyla, web sitemizi ve çevrimiçi mağazamızı alışveriş sepeti, ödeme işleme, ürün yönetimi vb. Gibi ek işlevlerle yapabiliriz.

Son olarak, ancak kesinlikle, en kritik unsurlardan biri web sitemizin görünümüdür. Flatsome, web sitemizin bakış açısını isteklerimize göre özelleştirmemizi sağlayan bir temadır. Örneğin, şirket logonuz turuncu ise, web sitenizin rengini yansıtmak istersiniz. Flatsome'nin size sağlayabileceği şey budur.

Flatsome temasını kullanarak bir WooCommerce ürün sayfası oluşturun

Tüm okuyucularımız WordPress, WoCommerce ve Flatsome hakkında bilgiye sahip olduğundan, Flatsome temasıyla birlikte gelen fantastik UX oluşturucu ile ürün sayfamızın özelleştirmesine geçme zamanı. Tasarımcının hayatını son derece kolaylaştıran bir sürükle ve bırak özelliğidir.

Muhtemelen son birkaç ayda karşılaştığımız zorlu zamanlardan dolayı neredeyse herkes çevrimiçi alışveriş yaptı. Evde kalmak hepimiz için en güvenli çözümdü. Tüm okuyucularımızın, bir çevrimiçi mağazanın standart bir web sitesine kıyasla çok daha karmaşık olduğu gerçeği konusunda hemfikir olmasının nedeni budur.

Bununla birlikte, WooCommerce ve Flatsome'un yardımıyla bu görev son derece kolay hale geldi. Oturup web sitenizin nasıl görüneceğini planlamanız gerekiyor, işte bu kadar. WooCommerce, oluşturucu seçenekleriyle size yardımcı olmak için orada olacak. Sürükle ve bırak yöntemiyle sadece birkaç dakika içinde eksiksiz çalışan bir çevrimiçi mağaza oluşturabilirsiniz.

WooCommerce ve Flatsome çevrimiçi bir mağazaya sahip olma fikirlerinize yepyeni bir hayat verebilirsiniz. Web sitenizin müşteri çekebilmesi için modern ve güzel bir görünüme sahip olması gerekir. Bu nedenle, Flatsome tüm sorunlarınız için en iyi çözümdür, bu yüzden buradan ve başlayalım.

Flatsome'ın bazı harika özellikleri var, ancak parçalardan biri, 300.000'den fazla kullanıcının en iyi seçimi haline gelmesi. Nihai bir araç, tek bir satırı kodlamak zorunda kalmadan bazı muazzam duyarlı web siteleri oluşturmaya yardımcı olur. Ayrıca, son derece yaratıcı ve benzersiz çevrimiçi mağazalar oluşturma yeteneği, onu daha da değerli kılıyor.

Bu yüzden daha fazla zaman kaybetmeden öğreticiye geçelim. Bu eğitim, sizi ürünler sayfasını tasarlama sürecinden geçirir. Resimler, görevin süreç boyunca nasıl ilerleyeceği konusunda daha iyi bir fikir edinmenize yardımcı olacaktır.

1. Adım: Ürün Sayfası için Düzen Seçin

İlk olarak, ürünler sayfasının bir düzenini seçerek başlayacağız. Bu seçim, daha sonra arzularımıza göre özelleştireceğimiz çevrimiçi mağazamız için temel bir sayfa oluşturacaktır. Bu adım adım kılavuz, sayfayı özelleştirme sürecinde size yol gösterecektir.

Bu ex için amp le, biz Klasik Dükkanı seçeneği ile devam edilecektir. Ancak sizin için herhangi bir kısıtlama yoktur. Özelleştirme süreci, seçtiğiniz her düzen için benzer olacaktır. Tek fark, sayfanın temel yapısının diğerinden farklı olmasıdır.

Ürün özelleştiriciye geçerken, ona Tam yükseklik sol kenar çubuğu adını verdik.

Ürünler sayfasını özelleştirmek için iki seçenek vardır. Birincisi UX oluşturucu ile yapılırken, diğeri sayfayı manuel olarak oluşturmaktır. İkinci seçeneği seçerseniz, resmi belgelere gitmeniz ve kısa kodları bulmanız gerekecektir. Yeni başlayan biriyseniz ve bu, bir çevrimiçi mağaza oluşturma ilk deneyiminizse, bu ilk seçeneğe gitmenizi öneririm.

(İsteğe bağlı) Adım 2: Ürün Sayfasını Manuel Olarak Oluşturun

İşte Flatsome'un resmi dokümantasyon sayfasının bir ekran görüntüsü. Kısa kodlar kelimesini yazabilir ve bunları arayabilirsiniz.

Aramaya bastığınızda, ekranda görüntülenen kısa kodların bir listesi olacaktır. Ürün sayfası için önemli olan kısa kodları seçebilirsiniz. Kısa kodları kullanmak daha az çaba gerektirir, ancak WordPress ve kısa kodları kullanma konusunda biraz uygulamalı deneyime sahip olmanız çok önemlidir.

Sayfa oluşturmak için web sitesinde kullanabileceğiniz kısa kodların listesi aşağıdadır.

Bu ex yılında amp le, tam boy kenar çubuğu düzenden ayrıldı özelleştirme olacak; bu nedenle, tasarımın kodunu kopyalayacağız. Aşağıda uygulanan bir resim var, ancak bunu yapıdan kolayca kopyalayabilirsiniz.

Başlıklı bir blok oluşturmaya başlayın. Kafa geliştirmek istiyorsanız, gösterge tablonuza yerleştirilen UX bloklarının altında bulunan “Yeni Ekle” ye tıklamanız gerekir.

Bloğu isteğinize göre adlandırabilirsiniz. İşte bu ex içinde amp le, biz birlik adında var 'Tam boy sol kenar çubuğu düzeni.' Ardından, blok düzenleyicinin içindeki kısa kodları görebilirsiniz. İstediğiniz kısa kodları kopyalamayı tamamladığınızda, yayınla düğmesine basabilirsiniz.

Sayfamızı isteklerimize göre özelleştirebileceğimiz bu küçük adımdan sonra eşit seviyede olacağız. Şimdi ürün sayfası teması seçeneğine gidin ve özel düzen simgesine tıklayın.

Tamamlandığında, artık Özel Ürün Düzeni açılır listesinden bloklar oluşturabileceksiniz.

Az önce oluşturduğumuz bloğu seçin. Bu bloğu oluşturmak için ana hedefimiz ondan bir ürün sayfası oluşturmaktı. Bu ex göre amp le, Tam boy adlandırılmış gibi senin sonunda, olacak ise kenar çubuğu düzeni, bloktur bıraktı.

Tamamlandığında Yayınla düğmesine basmanız yeterlidir; ayarları kaydedecektir.

3. Adım: Ürün Sayfasını Özelleştirin

Özelleştirmeye başlamamızın zamanı geldi. İlk olarak, daha önce adımlarda belirlediğimiz ön uçtan mevcut ürünler sayfasına gideceğiz.

Kurmamız gereken belirli bir ürünü seçmeniz önemlidir. Özelleştirmemiz gereken işin tüm detaylarına, görsellerine sahip olmalısınız. Bu şekilde süreç, oluşturacağınız sayfa bölümünü görselleştirmek için daha rahat hale gelir.

UX oluşturucu seçeneği görülebilir. Özelleştirmeye başlamak için sadece düğmeye basın.

UX oluşturucu açıldıktan sonra, ürün sayfası öğelerinin ürünler sayfanızın sol tarafındaki panelinde mevcut olduğunu görüntüden görebilirsiniz.

Sol yan panel, başlangıçta oluşturduğumuz bloktur. Dokümantasyondan alınan kısa kodlar yardımıyla oluşturduk.

Sol taraftaki panelden öğeleri yeniden sıralama ve öğe seçeneğinden ayarları değiştirme seçenekleriniz vardır. Bu ex yılında amp le, biz sol menüde Fiyat bilgisi yeniden düzenleyerek edilecektir.

Ayrıca, oluşturucunun önizlemesindeki öğeleri yeniden düzenlemenize ve oluşturucu ürün sayfasına ek bileşenler eklemenize de olanak tanır. Bu demoda, Ürünler Sekmeleri bölümü ve İlgili Ürün, yalnızca basit bir sürükle ve bırak yöntemiyle yeniden düzenlenmiştir.

Önemli sürükle ve bırak işlevi ile Flatsome, web sitenizde aradığınızı size sunmaya hazır. Son derece özelleştirilebilir modüllerle, kolaylıkla harika sayfalar oluşturabilirsiniz. Sürükle ve bırak özelliği hayatı daha da rahat hale getirir.

Paketleme

Bu modern çağda çevrimiçi bir işletmeye sahip olmak zorunludur çünkü insanlar güvende kalmak için evde kalmayı tercih ediyor. Bu nedenle, Flatsome ile işletmenizin ilk çevrimiçi mağazasını oluşturmaya başlayın ve benzersizliği ve yaratıcılığıyla müşterilerinizi büyüleyin. Dahası, içerik düzenleyicide kod karmaşası yoktur, sadece birkaç kısa kod satırı vardır. Flatsome şüphesiz karşılaştığım en iyi tema. Yani başka bir temaya bakmanıza gerek yok, sadece indirme düğmesine basın ve hemen özelleştirilmiş çevrimiçi mağazanızı oluşturmaya başlayın.

Yorum Yap

E-posta hesabınız yayımlanmayacak. Gerekli alanlar işaretlenmiştir *