WordPress ile Elementor Sayfa Oluşturucu Nasıl Kullanılır

Yayınlanan: 2021-07-29
elementor eklenti incelemesi
@Cloudways'i takip edin

WordPress sayfa oluşturucuları hakkında konuştuğumuzda, en popüler ve en fazla aktif kurulum ve en büyük topluluğa sahip olan kesinlikle Elementor'dur. Şimdiye kadar, Elementor ile oluşturulmuş yaklaşık 8 milyon+ site var. WordPress siteleri oluştururken kullanım kolaylığı, hızı ve muazzam olanakları nedeniyle birçok uzman tarafından önerilmektedir.

Elementor'un Pro sürümünü test ettim ve bir açılış sayfası oluşturdum. Sürükle ve bırak işleviyle birlikte gelir ve herhangi bir temayla çalışır ve tüm Ücretsiz, Pro ve WordPress widget'larını aynı anda kullanabilirsiniz. WordPress ile Elementor kurulumu ve yapılandırması hakkında daha fazla bilgi edinmek için bu makaleyi okuyalım.

  • Neden Elementor Sayfa Oluşturucu'yu Seçmelisiniz?
  • Elementor Sayfa Oluşturucu'nun Özellikleri
  • Elementor Sayfa Oluşturucu'nun Fiyatlandırması ve Planları
  • Elementor Sistem/Barındırma Gereksinimleri
  • Elementor Sayfa Oluşturucu'yu Kurun ve Yapılandırın
  • Cloudways'de Elementor Sayfa Oluşturucu Performansı
  • Elementor Sayfa Oluşturucu + Cloudways Kullanıcı İncelemeleri

Neden Elementor Sayfa Oluşturucu'yu Seçmelisiniz?

Elementor, şu anda piyasadaki ilk ve en gelişmiş WordPress Sayfa oluşturucularından biridir. Ayrıca çevresinde devasa bir ekosisteme sahiptir ve birçok küçük yazar, nihai sonuç için gereken süreyi azaltmak için kullanabileceğiniz faydalı eklentiler ve şablonlar oluşturur.

Elementor'un durumunda, sonuç, ihtiyacınız olan veya ihtiyaç duyabileceğiniz tüm işlevlerle iyi tasarlanmış, gerçekten harika bir site olabilir. Elementor kullanarak oluşturamayacağınız hiçbir WordPress sitesi türü bulamazsınız. Bazı ekstra işlevlere ihtiyacınız varsa, kısa kodlarla kolayca uygulanabilir.

Elementor Sayfa Oluşturucu'nun Özellikleri

Elementor'un ücretsiz sürümü sınırlı sayıda Element ile birlikte gelir, ancak Pro sürümü ile QI, Ultimate Add Ons vb. gibi eklentilere sahip olursunuz. Ayrıca sitenizi kolaylıkla oluşturmak için bir sürü faydalı öğeye ve şablona sahip olursunuz. .

Yerel Elementor'un işlevlerini genişlettiği için çoğu Elementor kullanıcısı için favori araçlardan biri olan Gutenberg ve Elementor için Crocoblock eklentisini dışarıda bırakmak adil olmaz.

Elementor, özelliklerini 4 kategoriye ayırdı.

1. Temel Widget'lar

Temel Widget'lar ücretsiz sürümle birlikte gelir ve bunlar, İçindekiler, Portföy veya Form gibi gelişmiş seçenekler gerektirmeyen çarpıcı bir web sitesi oluşturmak için oldukça yeterlidir. Ayrıca, ücretsiz sürümde bir Başlık/Gezinme Menüsü oluşturamazsınız ve beğendiğiniz Navigasyon Menüsü ile harika bir WordPress teması bulmanız gerekebilir.

Temel Widget'lar

2. Profesyonel Widget'lar

Elementor Pro'lu Pro Widget'lar, herhangi bir web sitesi oluşturmak için ihtiyaç duyabileceğiniz hemen hemen her yönü ve her widget'ı kapsar. Farklı kategorilerden, gönderi türlerinden gönderiler ekleyin ve seçin veya en son olanları listeleyin, Fiyat Tabloları, Galeri, Flip Box, Easy Social Media Networks embed, Çeşitli Medya Karuselleri, Lottie Widget ve HotSpot (bundan daha sonra bahsedeceğim).

Profesyonel Widget'lar

3. Tema Öğeleri

Tema Öğeleri ayrıca Elementor Pro ile birlikte gelir ve elbette tüm şablon sayfalarını ve tek gönderi şablonunu oluşturmak için önemlidir. Bildiğiniz gibi Kategori, Etiket, Yazar vb. içeriklerle dinamik olarak doldurulan sayfalar var.

Bu sayfalar için tema öğelerini kullanarak bir şablon oluşturmanız gerekir. Aynı şey, gönderileriniz için her seferinde oluşturmaya gerek kalmadan tüm gönderiler tarafından kullanılacak güzel bir şablon tasarlayabileceğiniz Tek Gönderi için de geçerlidir. İçeriği alıştığınız gibi ekleyin ve işiniz bitti.

Tema Öğeleri

4. WooCommerce Widget'ları

Ve son olarak, en az değil, WooCommerce Widget'ları. Bu widget'lar, WooCommerce öğelerini kullanarak Tema Oluşturucu, şablon sayfaları ve tek ürün şablonuna benzer şekilde yeniden oluşturmanıza olanak tanır.

WooCommerce Widget'ları

Elementor Sayfa Oluşturucu'nun Fiyatlandırması ve Planları

Elementor Pro 5 farklı planla birlikte gelir, hepsi aynı Elementor Pro sayfa oluşturucuyu ve aşağıdaki gibi özellikleri içerir:

  • Sürükle ve Bırak Canlı Düzenleyici
  • Sorumlu tasarım
  • 90+ Temel ve Pro Widget'ı
  • 300+ Temel ve Profesyonel Şablon
  • Tema Oluşturucu

En düşük plan, 49 $ fiyatla 1 site için Essential'dır. Bu planla Premium Destek alırsınız, bu da 24 saat içinde yanıt bekleyebileceğiniz anlamına gelir. Bir sonraki plan Gelişmiş'tir ve aynı tür destekle 99 $ fiyatla 3 site için bir lisansı kapsar.

Muhtemelen en popüler olanı 25 site için 199 dolardan Expert'tir. Ek olarak, Elementor'da tamamladığınız projelerinizi yayınlayabileceğiniz ve yeni müşteriler kazanabileceğiniz bir Elementor Uzman Profili alacaksınız.

En üstte 100 site için 499 $ fiyatla Studio var ve burada VIP Desteğinden ekstra bir avantajınız var, bu da önceliğiniz olduğu ve biletlerinizin 30 dakika içinde yanıtlanacağı anlamına geliyor. Aynı şey 1000 $ fiyatla 1000 site için en pahalı Ajans planıyla birlikte gelir.

Tüm planlar yıllıktır ve aboneliğiniz sona ererse sitelere ne olacağını merak ediyorsanız, yanıt siteler eskisi gibi görünecek ancak Elementro Pro öğelerini ve şablonlarını düzenleyemeyecek veya kullanamayacaksınız.

Elementor Fiyatlandırması

Elementor Sistem/Barındırma Gereksinimleri

Elementor'un sistem gereksinimleri sayfasına göre 128MB PHP, MySQL 5.6 veya üstü veya MariaDB 10.0 veya üstü ile bile çalışması gerekir. Ayrıca, herhangi bir PHP 7+ ile çalışmalıdır. Test amacıyla, 2GB PHP Bellekli VultrHF kullandım.

Elbette, en son WordPress sürümüne ve diğer tüm eklentilerin güncel olmasına ihtiyacınız olacaktır.

Elementor Sayfa Oluşturucu'yu Kurun ve Yapılandırın

Elementor'un ücretsiz sürümünü yüklemek, WordPress eklenti deposundaki diğer eklentilerle aynıdır, WordPress Kontrol Panelinize gidin → Eklentiler → Yeni Ekle, Elementor'a göz atın, Eklentiyi Yükleyin ve Etkinleştirin.

Pro sürümü için Elementor'da otomatik olarak bir hesap oluşturacak planı satın almanız gerekir. Orada oturum açtığınızda, en son Pro sürümünü indirmek için indirme düğmesini göreceksiniz.

Sitenizi Elementor'a Bağlayın

Hala Elementor panosunda oturumunuz açıkken, WordPress Kontrol Panelinizde → Eklentiler → Yeni Ekle'de oturum açın ve Yükle'yi seçin, Elementor Pro'nun indirilen dosyasına bilgisayarınızdan göz atın, Yükleyin ve Etkinleştirin.

WordPress Panonuzdaki sol kenar çubuğunda işiniz bittiğinde, Elementor'a gidin → Lisans'a tıklayın → Bağlan ve Etkinleştir düğmesine tıklayın.

Elementor Lisansını Etkinleştir

Tıklandığında, Etkinleştirmek için Elementor'daki kontrol panelinize otomatik olarak yönlendirilirsiniz. Yeşil Etkinleştir düğmesini tıklayın ve işiniz bitti. Elementor Pro'nuz bağlandı ve etkinleştirildi.

Elementor Lisansını Bağlayın ve Etkinleştirin

Aktivasyondan sonra, Elementor'unuzun Aktif olduğuna dair onay göreceksiniz. Ancak, siteyi bir hazırlık alanı üzerine kurduysanız ve canlı için başka bir lisans satın almak istemiyorsanız, hazırlama sırasında hesabın bağlantısını kolayca kesebilir ve canlı alan üzerinde etkinleştirebilirsiniz.

Elementor Lisans Ayarları

Elementor'u kullanmaya başlamanın ve web sitenizi oluşturmanın zamanı geldi. Benim önerim, Elementor için özel olarak oluşturulmuş Elementor'un Merhaba Temasını kullanmaktır.

Bunu yapmak için, bir “Ana Sayfa” sayfası oluşturarak başlayalım ve onu Elementor ile düzenleyelim. Sayfalar → Yeni Ekle'ye gidin, Ana Sayfa olarak adlandırın ve Yayınlayın, ardından Elementor ile Düzenle düğmesini tıklayın.

Elementor ile Düzenle

Düzenle sayfasında, Düzen varsayılan olarak ayarlandığından düzenleyemeyeceğiniz Öğeleri göreceksiniz. Elementor'u boş bir tuval üzerinde kullanmak için, sol alt köşedeki dişli simgesine tıklayarak Elementor Tam Genişlik veya Elementor Kanvas'ı seçin.

Elementor Sayfa Ayarları

Siteyi oluşturmaya başlamadan önce, sol üst köşedeki burger simgesine tıkladığınızdan ve işin geri kalanı için gereken tüm genel ayarları yaptığınızdan emin olun.

Elementor Site Ayarları

Site Ayarları, temayı kurmaya oldukça benzer. Burada, kullanacağınız genel renkleri, yazı tiplerini ve her HTML etiketi için tam site tipografisini seçebilirsiniz.

Bunun yanı sıra, genel düğme stilini, üstbilgiyi, altbilgiyi, gerekirse Özel CSS'yi ve bunları ayarlamak için ihtiyacınız olan her şeyi ayarlayabilir ve tutarlılığı sağlamak için tüm sitede bu şekilde tutabilirsiniz.

Elementor Genel Öğeleri

İkinci seçenek, belirli dinamik olarak oluşturulmuş sayfa, gönderi veya ürün tarafından otomatik olarak kullanılacak şablon sayfaları ve tek gönderi/ürün şablonları oluşturmanıza olanak tanıyan Tema Oluşturucu'dur. Her WordPress temasının, yukarıdakilerin tümünü görüntülemek için şablon dosyalarına sahip olması gerektiği gibi, Elementor, kodun tek bir satırını bile yazmadan yapmanıza izin verecektir.

Elementor Tema Oluşturucu

Son seçenek, çalışma ortamınızı Elementor'da ayarlayabileceğiniz kullanıcı tercihleridir, sitenin kendisini, yönetici olarak kullanıcı arayüzünüz dışında hiçbir şeyi etkilemez.

Elementor Tercihleri

Sitenizi başlatmak için, mevcut tüm widget'lar sol kenar çubuğuna yerleştirilir ve her şey görsel olarak ve sürükle ve bırak yöntemiyle düzenlenebilir. Bunu yapmanın daha kolay bir yolunu istiyorsanız, klasör simgesine tıklayarak önceden hazırlanmış bloklardan veya şablonlardan birini kullanarak başlayabilirsiniz.

Elementor Elemanları

Klasör simgesi, önceden kaydettiğiniz blokların yanı sıra önceden oluşturulmuş blokları ve şablonları görebileceğiniz bir açılır pencere açar. Ayrıca oluşturduğunuz bir bloğu veya tüm şablonu kaydedebilir ve başka bir dahili sayfada yeniden kullanabilirsiniz. Kayıtlı bloğunuzu referanslar için kullanmak oldukça yaygındır, her sayfada değil bazılarında görüntülenmesi gereken bazı özel harekete geçirici mesajlar.

Elementor Kitaplığı

Daha önce herhangi bir deneyiminiz olmadan bir web sitesi oluşturmaya başladığınızda bilmeniz gereken bir şey daha var, kullanımı kolay, oldukça sezgisel ve birkaç gün içinde daha önce herhangi bir deneyiminiz olmadan, kendinize güzel bir web sitesi inşa etmekten daha fazlasını yapacaksınız. , Hatta profesyonel görünümlü biri diyebilirim.

Ancak sitenizin tüm cihaz boyutlarında harika görünmesi gerekir ve masaüstü sürümünü düzenlediğiniz gibi diğer tüm boyutları da düzenleyebilirsiniz. Lütfen öğelerin ve widget'ların yalnızca masaüstü sürümüne eklenebileceğini ve ardından görünümü daha küçük boyutlarda kandırabileceğinizi unutmayın.

Elementor Duyarlı Tasarım

Ayrıca, widget'ı veya bölüm görünürlüğünü farklı cihazlarda kolayca ayarlayabilirsiniz, böylece bir bölümü masaüstünde görünür, ancak tablette ve mobilde gizli bırakarak benzer bir bölümde farklı içeriklere sahip olabilirsiniz. Benzer şekilde, bir masaüstünden gizlenen ancak tablet ve mobil cihazlarda görünen bir başkası.

Mobil ve tablet sürümlerini düzenlemek için sol kenar çubuğunun altındaki duyarlı mod simgesine tıklayın, sitenizi mobil cihazlarda gösterecektir. Ve üstte, farklı ekran boyutları arasında geçiş yapabilirsiniz.

Daha fazla netlik için, biri mobilde ve tablette, diğer bölümün masaüstünde gizlendiği iki bölüm ekledim. Lütfen aşağıdaki örneğe bakın.

Elementor Masaüstü Sonucu

Sonuç mobilde.

Elementor Mobil Sonucu

Ve masaüstündeki nihai sonucun yalnızca bir bölümü var, ancak farklı olanı.

Cloudways'de Elementor Sayfa Oluşturucu Performansı

Elementor oldukça iyi bir performans sergiliyor ve GTMetrix'te 100 puan alıyor ve diğer test araçları gerçekten harika bir performans gösteriyor. Yaptığımız tüm testler için hiçbir resmi tam olarak aynı sayfa boyutuna ve resimlere sahip olacak şekilde optimize etmediğimi lütfen unutmayın.

GTMetrix'te Elementor Sonuçları

– Elementor'un GTMetrix'teki Sonuçları

Elementor'un Pingdom Araçları Üzerindeki Sonuçları

– Elementor'un Pingdom Araçlarında Sonuçları

WebPageTest'te Elementor Sonuçları

– WebPageTest'te Elementor Sonuçları

Özet

Sezgisel ve kullanımı kolay bir sayfa oluşturucuya ihtiyacınız varsa, Elementor güzel bir web sitesi oluşturmak için gereken tüm yönleri kapsayabilir. Herhangi bir CSS bilginiz varsa, tasarımdan piksel mükemmelliğindeki siteler oluşturmak o kadar da zor değil.

Büyük topluluk ve temel Elementor işlevlerini genişleten yüzlerce eklenti ve harici eklenti ile Elementor kullanılarak oluşturulamayan herhangi bir web sitesi türü göremiyorum.

Elementor'un nasıl şişirildiğini sık sık görüyoruz, birçok gereksiz kod yükleniyor, optimize edilmesi zor ama testlerden de görebileceğiniz gibi Elementor Cloudways'de oldukça iyi performans gösteriyor. Açılış sayfasını, ana sayfa için ortalamanın üzerinde olan 25 resim ve 7 bölüm + Üstbilgi ve Altbilgi ile test ettim.

Elementor ile ilgili bir başka harika şey de, öğrenme eğrisinin dik değil, oldukça hafif olmasıdır ve önceden hazırlanmış bazı şablonları veya blokları kullanarak sadece birkaç dakika içinde gerçekten güzel tasarlanmış, modern görünümlü bir web sitesine sahip olabilirsiniz.

S. Elementor ile bir WooCommerce mağazası kurabilir miyim?

Evet yapabilirsin! Elementor ile, sayfaları ve tek bir ürün sayfasını hızlı ve kolay bir şekilde oluşturmanıza olanak tanıyan bir WooCommerce oluşturucunuz vardır.

S. Elementor'un önceden oluşturulmuş şablonları var mı?

Elementor, çeşitli şablonlar için birçok eklentinin yanı sıra şablon kitaplığına da sahiptir. Ayrıca Envato Elements'i bağlayabilir ve oradaki şablonlardan herhangi birini kullanabilirsiniz.

S. Elementor Sayfa Oluşturucu'yu kimler kullanmalı?

Elementor, tasarımcılar ve ön uç geliştiriciler düşünülerek oluşturulmuştur. Herhangi bir türde bir site oluşturmak oldukça kolaydır, ancak aynı zamanda bir web tasarımcısı veya ön uç geliştiriciyseniz, Elementor'dan çok daha fazlasını elde edersiniz.