WooCommerce + Elementor: Harika Şeyler İnşa Edelim

Bir geliştirici tutmadan WordPress web sitenizi değiştirmek ve tasarlamak ister misiniz? İyi haber: WordPress sayfa oluşturucu eklentileriyle bu tamamen mümkün.

Bir WordPress sayfa oluşturucu eklentisi, güzel özel sayfalar ve web siteleri oluşturmak için sezgisel bir sürükle ve bırak arayüzü ile birlikte gelir. Bu nedenle, beceri kümeniz veya teknik bilginiz ne olursa olsun, sayfa oluşturucu eklentileri, tek bir kod satırı yazmadan ideal web sitenizi tasarlamayı çok kolaylaştırır.

Şimdi, hangi WordPress sayfa oluşturucu eklentisini göz önünde bulundurmanız gerektiğini merak ediyorsanız doğru yerdesiniz. Bu yazıda en popüler seçeneklerden birini inceleyeceğiz: Altın standart olarak kabul edilen Elementor. Elementor, WordPress web sitelerinin yaklaşık %15,9'u tarafından kullanılan 2 milyon aktif kurulumla en çok yüklenen ikinci WordPress eklentisidir.

Elementor'a kısa bir genel bakışla başlayacağız ve siteniz için doğru seçim olup olmadığını belirlemenize yardımcı olmak için eklentinin arayüzünü, özelliklerini ve fiyatlandırmasını daha fazla inceleyeceğiz. Hadi gidelim!

Elementor Eklentisi: Kısa Bir Genel Bakış

Elementor, WooCommerce veya WordPress temalarınızla birlikte gelen standart sayfa şablonlarına kıyasla benzersiz web sayfaları ve gönderiler oluşturmanıza olanak tanıyan görsel bir sürükle ve bırak WordPress sayfa oluşturucu eklentisidir.

Kodlama gerektirmez ve ayarları kolayca yapılandırmanıza ve sayfanızın içeriğini ve öğelerini sürükle ve bırak araçlarıyla düzenlemenize olanak tanır.

Elementor arayüzünün nasıl çalıştığına bakarak eklenti incelemesiyle başlayalım.

Elementor Eklenti Arayüzünü Anlama

Diğer birçok sayfa oluşturucu eklentisi ile karşılaştırıldığında, Elementor en basit ve en kusursuz arayüzlerden birine sahiptir. Eklentiyi ilk başlattığınızda, aşağıdaki gibi bir sayfaya gideceksiniz:

Noktalı gri alan, içerik alanınızdır. Bu alanın dışında normal temanız görünürken, noktalı alanda widget ekleyebilir ve kendi tasarımınızı oluşturabilirsiniz.

Sol tarafta, sayfanızı tasarlamak için bir araya getirebileceğiniz yapı taşları görevi gören widget'lar göreceksiniz. Bu widget'ların altında, resimde gösterildiği gibi tasarımlarınızı önizlemek, değişiklikleri geri almak veya duyarlı modu açmak için genel ayarlar bulacaksınız.

Sayfada istenen öğeleri sürükleyip bırakmanın ne kadar basit olduğu aşağıda açıklanmıştır:

Sayfanıza bir öğe bıraktığınızda – Elementor, aşağıda gösterildiği gibi öğeleri iki farklı yapısal öğe vererek iki yerleşim yapısına böler.

Bu yapısal elemanlar şunları içerir:

• Bölüm: mavi renkle işaretlenmiştir.
• Sütun: siyahla işaretlenmiş bölümün içine oturur. Bölüme gerektiği kadar sütun ekleyebilirsiniz.

Öğeyi bıraktıktan sonra, genişliğini ayarlayarak ve sütun boşluğunu ve yüksekliğini değiştirerek düzenini kolayca özelleştirebilirsiniz.

Ayrıca, özel gereksinimlerinize göre uygun bir bölüm yapısı seçebilir ve sütunlara resim, video veya simge gibi başka öğeler ekleyebilirsiniz.

Örneğin, aşağıdaki resimde gösterildiği gibi bir resim ekledim ve varsayılan Elementor resim kitaplığından birini seçtim. Resmin boyutunu ve hizalamasını değiştirebilir, bir başlık ekleyebilir ve uygun bir URL bağlayabilirsiniz.

Öğelerin, yapıların veya sütunların daha fazla stilini oluşturmak için kenar çubuğundaki Stil ve Gelişmiş sekmelerini kullanabilirsiniz. Stil vermek istediğiniz içeriğe tıklayın ve değişiklikleri yapmak için kenar çubuğu sekmelerine tıklayın.

Kenar çubuğunun sağ köşesinde görüntülenen kare şeklindeki simgeye tıklayarak sekmelerden öğeler kenar çubuğuna da gidebilirsiniz.

Bu nedenle, Elementor'un kullanımı oldukça kolaydır ve basit sürükle-bırak ve kolay özelleştirme seçenekleri ile hayalinizdeki web sitesini hemen oluşturabilirsiniz.

Şimdi fazla vakit kaybetmeden, doğrudan Elementor sayfa oluşturucunun özelliklerine geçelim.

WooCommerce İçin Mükemmel Bir Sayfa Oluşturucu Yapan En İyi Elementor Özellikleri

İşte onu WordPress ve WooCommerce web siteleri arasında en popüler sayfa oluşturuculardan biri yapan bazı mükemmel Elementor avantajları.

1. Önceden hazırlanmış kapsamlı şablon kitaplığı

Elementor, geniş bir şablon yelpazesi sunar. Bir şablon eklemek için aşağıdaki Şablon ekle simgesine tıklayın.

Elementor şablon kitaplığından 300'den fazla şablon arasından seçim yapın ve bunları tek bir tıklamayla sayfanıza ekleyin.

Elementor 2.0'ın piyasaya sürülmesinden bu yana, bu şablonlar iki biçimde gelir:

• Bloklar: Tüm sayfa yerine belirli bölümler için tasarımlar sağlar. Örneğin, blokları kullanarak mevcut bir sayfa düzenine bir Şirket hakkında bölümü veya önceden oluşturulmuş bir iletişim bölümü ekleyebilirsiniz.

• Sayfalar – Tek bir tıklamayla içe aktarabileceğiniz ve gerektiğinde ince ayar yapabileceğiniz tam sayfa tasarımlar sunun.

Ayrıca tasarımlarınızın bazılarını daha sonra başka sayfalarda veya web sitelerinde yeniden kullanmak üzere bloklar ve şablonlar olarak kaydedebilirsiniz; bu, web sitenizde ortak bir şablon tasarımı sürdürmeyi çok uygun hale getirir.

Ayrıca her seferinde sıfırdan yeni bir sayfa tasarımı oluşturma zahmetini de ortadan kaldırır.

2. Duyarlı tasarım kontrolleri ve mobil önizlemeler

Mobil kullanım her ay istikrarlı bir şekilde artıyor ve web tasarımcılarının yaklaşık %73,1'i yanıt vermeyen bir sayfa tasarımının web sitesini terk etmenin en büyük nedenlerinden biri olduğuna inanıyor.

Elementor'da oluşturduğunuz tüm tasarımlar ve sayfalar otomatik olarak yanıt verir ve mobil cihazlarda harika görünür. Ayrıca, arayüzden çıkmadan web sitenizin diğer cihazlarda nasıl görüneceğini hızlı bir şekilde önizleyebilirsiniz.

Kenar çubuğunun altındaki Duyarlı mod düğmesini tıklayın ve aşağıdaki resimlerde vurgulanan düğmelere tıklayarak web sitenizin masaüstü, mobil ve tablet sürümlerini önizleyin.

Sayfa tasarımlarınızı cihaz türüne göre özelleştirmenize ve belirli cihazlarda belirli widget'ları göstermenize veya gizlemenize olanak tanır. Örneğin, web sitenizin masaüstü sürümünde büyük bir kahraman resmi varsa, bu resmi sitenizin mobil sürümünde görüntülemekten kaçınabilirsiniz. Tek bir geçiş tıklamasıyla Elementor'un duyarlı tasarım kontrollerini kullanarak o görüntüyü veya gizlemek istediğiniz herhangi bir bölümü seçebilir ve mobil cihazlarda gizleyebilirsiniz.

Bu nedenle, web sitenizin %100 duyarlı olmasını sağlar - bu nedenle masaüstü bilgisayarlar, tabletler ve mobil cihazlar dahil tüm cihazlarda harika görünür.

3. Sınırsız özelleştirme seçenekleri

Elementor ile kişiselleştirme sınırsızdır ve web sitenizi ve öğelerini nasıl tasarlayacağınız konusunda bir sınır yoktur.

Elementor düzenleyicisindeki Stil ve Gelişmiş menüleri, birçok stil özelleştirme seçeneği sunar. İçeriği, rengi, genişliği, boyutu, CSS filtreleri ve kenarlığı dahil olmak üzere çeşitli niteliklere göre biçimlendirebilirsiniz.

Aynı zamanda, Gelişmiş menüsü, aşağıda gösterildiği gibi düzeni, hareket efektlerini, arka planı, sınırı, nitelikleri ve diğer faktörleri yönetmenize olanak tanır.

4. Ayrıntılı düzen kontrolleri

Özelleştirme seçeneklerinin derinliklerine dalan Elementor, mizanpaj tasarımınız üzerinde size ayrıntılı kontrol sağlar, böylece özel kod yazamamanız nedeniyle tasarım esnekliğinizden ödün vermek zorunda kalmazsınız.

Elementor, birçok sezgisel kontrol seçeneğiyle bölümlerinizi, widget'larınızı ve sütunlarınızı tam olarak istediğiniz yere yerleştirmeyi kolaylaştırır.

Gelişmiş menüsündeki düzen kontrollerini kullanarak şunları yapabilirsiniz:

• Bölümler, widget'lar ve sütunlar için kenar boşluğunu ve dolguyu manuel olarak ayarlayın.
• Bölümün genişliğini seçin – varsayılan, tam genişlik, sıralı ve özel.
• Widget'ın sütun içindeki konumunu ayarlayın - varsayılan, sabit ve mutlak.
• Sütunlar arasındaki boşluğu ayarlayın ve temiz bir düzen için boş bir alan oluşturun.

Böylece, hiçbir kodlama becerisi olmadan, widget'larınızın yerleşimini kolayca ayarlayabilir ve sütunları ve bölümleri gerektiği gibi özelleştirebilirsiniz.

5. Değişiklikleri geri alma/yineleme ile ilerlemenin revizyon geçmişini tamamlayın

Elementor'un en iyi özelliklerinden biri, yaptığınız tüm değişikliklerin tüm geçmişini önizlemenize izin vermesi ve böylece geçmişteki her eylemi günlüğe kaydetmesidir.

Ayrıca, değişiklikleri kolayca geri alabilir ve gerektiğinde önceki sürüme dönebilirsiniz. Ayrıca, yeni bir tasarımı kaydettiğinizde, gerekirse tamamen yeni bir revizyona kolayca geri dönebilirsiniz.

6. Arkasında temiz bir kod bırakır

Elementor'u gelecekte herhangi bir nedenle devre dışı bırakmak isterseniz, Divi Builder gibi tonlarca kısa kodu geride bırakma konusunda endişelenmenize gerek yok.

Elementor, temiz kod bırakarak optimum performans ve sayfa hızı sağlar.

Daha Fazla Elementor Özelliği

Elementor sayfa oluşturucu eklentisinin diğer bazı özellikleri şunlardır:

• Üstbilgi ve altbilgi düzenleyici: Elementor ile sitenizin üstbilgilerini ve altbilgilerini herhangi bir kodlama becerisi olmadan kolayca düzenleyebilirsiniz.
• Satır içi metin düzenleme: Bu özellik, metni ekranda canlı olarak düzenlemenize olanak vererek, mevcut metin içeriğini düzenlemeyi veya blog gönderileri yazmayı kolaylaştırır.
• RTL ve çeviriye hazır: Elementor 23 çevrilmiş dilde gelir ve tam RTL dil desteği sayesinde onu başka dillere kolayca çevirebilirsiniz.
• WooCommerce widget'ları: E-Ticaret web siteleri oluşturmayı çok kolay hale getirmek için fiyatlandırma listeleri ve fiyatlandırma tabloları gibi önceden oluşturulmuş WooCommerce widget'ları sağlar.
• Üçüncü taraf entegrasyonları: Elementor, ActiveCampaign ve MailChimp dahil olmak üzere üçüncü taraf entegrasyonlarını destekler.
• Global renkler ve tipografi seçenekleri: Elementor, tüm sayfalarda kapsamlı tasarımlar oluşturmak için global tipografi ve renkler ayarlamanıza olanak tanır. Ayrıca, web sitenizin tasarımı için 800'den fazla Google yazı tipi arasından seçim yapabilirsiniz.
• Bakım modu: Web sitenizi bakım moduna ayarlamak için Elementor'un bakım modu şablonlarından yararlanabilirsiniz.

Elementor Pro İncelemesi

Temel Elementor sayfa oluşturucu açık kaynaklı ve ücretsiz olsa da, ek kullanışlı işlevler sağlayan Elementor Pro sürümüne yükseltebilirsiniz.

İşte yeni Elementor Pro eklentisinin bazı özelliklerine kısa bir bakış:

• Tüm bir WordPress teması oluşturmanıza izin verir.
• Kaydırıcılar, sosyal paylaşım düğmeleri, formlar, geri sayım sayaçları ve giriş formları dahil olmak üzere daha heyecan verici widget'lara sahiptir.
• Tonlarca yüksek kaliteli premium Elementor Pro şablonu sağlar.

Bu nedenle, daha fazla özellik, premium şablonlar ve global widget'lar istiyorsanız - 49 dolardan başlayan Elementor Pro eklentisine gidebilirsiniz.

Elementor Fiyatlandırma İncelemesi

Basit ve basit tarzda web siteleri oluşturmak istiyorsanız, eklentinin ücretsiz sürümü ihtiyaçlarınızı karşılamalıdır - en zengin özelliklere sahip ücretsiz ve ücretsiz sayfa oluşturucu olarak düşünülürse.

Ancak, daha profesyonel web siteleri oluşturmak için Elementor, VIP desteği ve Elementor Uzman Profili gibi premium özelliklere sahip dört premium plan sunar.

Elementor eklentisinin Essential, Expert, Studio ve Agency planı yıllık 49$, 199$, 499$ ve 999$'dır. Bu nedenle, Elementor herkes içindir ve ister web tasarımcısı, geliştiricisi veya ajans sahibi olun, Elementor her ihtiyaç ve talep için özellikler sağlar.

Sonuç: Nihai Karar

Bu kapsamlı incelemeden sonra, Elementor'un bir WordPress veya WooCommerce web sitesi oluşturmak için gereken tüm temel özellikleri sağladığını söylemek güvenlidir.

Kodlama deneyimi olmayan web sitesi tasarımcılarının güzel web siteleri oluşturmasına olanak tanıyan hafif, basit, anlaşılması kolay ve şişirilmemiş bir arayüzle gelir. Ve en iyi yanı, herkesin ihtiyaçları için fiyatlandırma planları ile birlikte gelmesidir. Ayrıca, Elementor geliştiricileri yeni özellikler ve iyileştirmeler yayınlamaya ve kullanıma sunmaya devam ediyor.

Eklentinin kullanım kolaylığını, genel özelliklerini, performansını, desteğini, arayüzünü ve fiyatlandırmasını inceledikten sonra, Elementor'u WordPress sayfa oluşturucu eklentilerinin en üstünde sıralıyoruz. Bu yüzden Elementor eklentisini kontrol edin ve kendi başınıza deneyin ve özel iş gereksinimlerinize uygun planı seçin.