Elementor Review 3.0: Bilmeniz gereken her şey
Ağustos 2020, Elementor ekibi Elementor: Elementor 3.0’ın en son sürümünü yayınladı. Kesin çıkış tarihi 25 Ağustos civarındadır ve resmi blog yayınındaki duyuruya atıfta bulunur. En son sürümün ilk sürümü beklendiği gibi çalışmadı çünkü bazı kullanıcılar güncellemeden sonra sitelerinde bazı sorunlar yaşadı. Birkaç saat içinde, Elementor ekibi sorunu çözdü ve daha yeni bir versiyon yayınladı (çok hızlı bir yanıt için Elementor ekibinin şapkasını kaldırın). Yazma sırasında (30 Ağustos 2020), mevcut en son sürüm Elementor Free için 3.0.3 ve Elementor Pro için sürüm 3.0.1’dir.
Elementor 3.0, birkaç yeni özellik ile birlikte geldiğini düşünerek tartışmasız büyük bir güncellemedir. Elementor tarafından bu sürümde tanıtılan ana özellikler:
Tasarım sistemi
Tema Stili
Site ayarları
Yeni Tema Yapıcısı
Bu makalede, Elementor 3.0 tarafından sunulan yeni özellikleri ve bu özelliklerin bir web sitesini tamamlamada çok zaman kazanmanıza nasıl yardımcı olabileceğini iyice tartışacağız. Elementor 3.0’da yeni özellikler? Elementor 3.0 bir ana görevle yayınlandı: profesyonel web tasarımcılarına (ve geliştiricilere) projelerini profesyonel ve verimli bir şekilde daha hızlı tamamlamalarına yardımcı olmak. Bu görev, Elementor 3.0’da tanıtılan özelliklerden biri olan bir tasarım sistemi sunarak tamamlandı. Bu özellik (tasarım sistemi) birkaç bileşenden oluşur. Bu, Global Ayar Paneli adı verilen bir yerden tipografi, renk, site kimliği, düzen ve ışık kutusunu kontrol etmenizi sağlar.
Bu arada, yeni tema üreticisi özellikleri, web sitenizin her bir bölümünü kontrol etmenizi sağlar – üstbilgiler, altbilgi, tek yazı düzeni, arşiv, sayfa 404, WooCommerce sayfası – tek bir ekranda. Elementor 3.0 tarafından sunulan yeni özellikler. Bu makalede, görünür alanları örtmeye odaklanacağımızı lütfen unutmayın. Performans iyileştirmenin yönlerini tartışmayacağız (sürüm 3.0’da da vaat edilir) çünkü bunu kanıtlamak için karmaşık test gerektirecektir. Bu tasarım sistemi muhtemelen sizin için garip bir terimdir, özellikle de sadece kendiniz için bir web sitesi oluşturursanız. Tasarım sistemi nedir? Terimi anlamayı kolaylaştırmak için size kısa bir hikaye anlatalım. Profesyonel dünyada – bazı durumlarda – web tasarımcıları yalnızca eskizler, Figma, Adobe XD veya benzeri uygulamalar gibi tasarım uygulamalarını kullanarak tasarım konseptleri yaparlar. Tasarım konsepti (genellikle stil kılavuzu olarak adlandırılır) tipografi, renk şemaları, düğme şekilleri ve diğer tasarım öğelerinin kullanımını düzenler. Tasarım konseptinin uygulanması geliştirme ekibinin sorumluluğundadır. Şimdi web sitesinin düzinelerce sayfadan oluşup oluşmadığını hayal edin. Tasarım konseptinin bazı revizyonu varsa sayfayı revize etmek ne kadar sürer. Başlıklar veya altbilgiler gibi diğer bölümlerden bahsetmiyorum bile. Tasarım sistemi böyle oynuyor. Bir yerden sayfalarda (renkler, tipografi vb.) Değişiklikler yapabilirsiniz. Sitedeki tüm sayfalara bir değişiklik uygulanacaktır.
Tasarım sistemi konsepti ayrıca web sitenizin tutarlı bir renk şemasına ve tipografisine sahip olmasını sağlar. Bu konsept aynı zamanda web temsilcileri veya gevşek web tasarımcıları/geliştiricileri için çalışırlarsa çok iyi olan web siteleri oluşturmak için basitlik sunar. Elementor tasarım sisteminin kendisi 2 bileşenden oluşur: Global Renkler ve Global Yazı Tipleri. Elementor editörünün sol üst köşesindeki üç -Row simgesine (Hamburger simgesi) tıklayarak Global Ayarlar Elementor panelinden erişebilirsiniz. Gördüğünüz gibi, eriştiğinizde yayın düğmesi maviye (yeşilden) dönecektir. Global ayar paneli. Mavi Güncelleme düğmesi, Global Ayarlar panelinde olduğunuzu gösterirken, Yeşil Düğme Yayın/Güncellemesi normal Elementor Ayarları panelinde olduğunuzu gösterir.
Bu arada, tasarım sistemi ücretsiz öğeler ve Pro için kullanılabilir. Aşağıdakiler Elementor Tasarım Sisteminin bir bileşenidir: Global Renk Bir web sitesi oluştururken, uygun rengi seçmek karmaşık görevlerden biridir. Web tasarımında (ve genel olarak diğer tasarımlarda) renkler marka kimliğini temsil eder. Bir markayı gerçekten temsil eden bir renk şemasına sahip olmak için, tasarımcılar genellikle bir renk kombinasyonu ile deneyler yaparlar. Web tasarımı bağlamında, çok zaman geçireceği için tüm sayfaları sadece yeni renkler uygulamak için düzenlemede komik değil. Global Elementor Renk özelliği, birkaç sayfaya aynı anda bir yerden yeni renkler uygulamanızı sağlar. Sayfa yayınlanmış olsa bile. Veya sayfadaki birkaç parçaya yeni renkler de uygulayabilirsiniz.
Yeni Global Rengi ayarlamak için Renk Ekle düğmesini tıklayın. Her küresel rengi tanımlamanızı kolaylaştırmak için yeni Global Renk adınızı verebilirsiniz. Yeni bir küresel renk oluşturmayı bitirdikten sonra Mavi Güncelleme düğmesini tıklayın. Global Renkleri tasarım öğelerinde kullanmak için yeni bir widget ekleyebilir veya mevcut widget’ları düzenleyebilirsiniz. Stil sekmesinin rengini her zamanki gibi değiştirin. Dünya simgesini tıklayın ve var olan küresel renklerden birini seçin. Widget’lara ek olarak, Global Renkleri Elementor’un sütunun, bölümünün ve diğer öğesinin arka plan rengi olarak da kullanabilirsiniz. Global renkleri değiştirmek için, Global ayar panelini girip istediğiniz yeni rengi seçersiniz. İlgili küresel renkleri kullanan tüm tasarım öğelerinde değişiklikler (yeni renkler) uygulanacaktır. Tek tıklamada! Global yazı tipleri renklerle aynıdır, yazı tipleri bir web sitesinin marka kimliğini de temsil edebilir. Bu nedenle, yazı tipi seçimi web siteleri oluşturmada da önemli bir adımdır. Elementor’da tipografik ayarlar içeren birkaç widget vardır. Başlık widget’ından, Metin Editörü Widget, Widget düğmesi, widget formu vb. Renk şemasına ek olarak, iyi bir web sitesi, özellikle yazı tipi türü olan tutarlı bir tipografik ayara sahip. Bazı parçalar için – başlık metni gibi – başlık metnini içeren tüm sayfalarda aynı tipografik ayarları kullanabilirsiniz. Global bir yazı tipi kullanmak, belirli parçaların tipografisini, örneğin başlık metnini aynı anda tüm sayfalarda değiştirmenizi sağlar. Tıpkı küresel renkler gibi. Global ayar panelinin tipografik ayarlarını değiştirebilirsiniz. Global yazı tiplerinin kullanımı küresel renklere çok benzer. Global bir ayar paneli açabilir ve küresel bir yazı tipi seçebilirsiniz. Varsayılan olarak, seçebileceğiniz 4 global yazı tipi vardır. Global yazı tiplerini düzenlemek için, ilgili Global yazı tiplerinde kalem simgesine tıklamanız yeterlidir. Yazı tipi aileleri, yazı tipi boyutu, yazı tipi ağırlığı, yazı tipi stili vb. Her yeni değişiklik yaptığınızda Mavi Güncelleme düğmesine tıklamayı unutmayın. Global yazı tiplerini kullanmak için, başlık widget’ları, metin editörü widget’ları, düğme widget’ları vb. Gibi tipografik ayar seçeneklerine sahip widget’ları ekleyebilir veya düzenleyebilirsiniz. Tipografik seçenekte, Globe simgesini tıklayın ve kullanmak istediğiniz global yazı tipini seçin. Artık sitenizdeki belirli sayfaların tipografik ayarlarını değiştirmek için Global Ayar Paneline gidebilirsiniz. Değişiklikler, ilgili küresel yazı tiplerini kullanan tüm sayfalara uygulanacaktır.
Tema tarzı tema stili, daha hızlı bir şeyi bitirmek için iş akışınızı kolaylaştırmak için başka bir özelliktir. Bu özelliğe Global Ayarlar panelinden de erişebilirsiniz. Bu özellik, dört tasarım öğesi için bir ön ayar oluşturmanıza olanak tanır:
Tipografi top Görüntüler
Saha Alanı Yukarıda daha önce de belirttiğimiz gibi, birkaç web geliştiricisi stil yönergelerine dayalı çalışır. Elementor Tema Stili özelliğiyle, yukarıdaki listedeki dört önemli öğe için ön ayarlar yapabilirsiniz. Örneğin, düğme öğeleri için ön ayarlar yapabilirsiniz. Bu şekilde, belirli bir sayfaya veya sayfanın bir kısmına bir düğme öğesi eklemek istediğinizde, kuvveti baştan ayarlamanıza gerek yoktur. Zaman kazanmak!
Tema stili küresel renklerden ve global yazı tiplerinden farklı bir şekilde çalışır. Birbirlerine bağlı değiller. Belirli sayfalarda belirli widget’larda bazı değişiklikler yapabilirsiniz ve bu değişiklikler diğer sayfalardaki widget’ı etkilemez.
Ön ayar yapmak için Global ayar paneline gidebilirsiniz. Tema stili bloğunda önceden ayarlamak istediğiniz öğeleri seçin. Öğeyi düzenlemeyi bitirdikten sonra önceden ayarlamayı güncellemek için Mavi Güncelleme düğmesini tıklayın.
Site Ayarı Sürüm 3.0, yalnızca sayfa yapımcıları değil, tam bir WordPress tabanlı site üreticisi olmak için diğer görev öğelerini onaylar. Kullandığınız WordPress temaları ne olursa olsun, site kimliği (site adı, site açıklaması, site logosu ve favicon), varsayılan arka plan, varsayılan düzen ve ışık kutusu gibi birkaç önemli şey düzenleyebilirsiniz. Bir Elementor Pro kullanıyorsanız, sayfada çalışmaya başlamadan önce özel bir CSS de ayarlayabilirsiniz. Yukarıda belirtilen her şeyi, Global ayar panelinden de erişebileceğiniz site ayarları aracılığıyla yapabilirsiniz.
Elementor Site Ayarları özelliği, WordPress temasının ayarlanmasına çok benzer (görünüm -> özelleştir). Bu yeni özellik ile, WordPress tabanlı web sitenizden önemli şeyleri Elementor aracılığıyla kontrol edebilirsiniz. Yeni tema üreticisi, Elementor’un en popüler sayfa üreticisi eklentisi olmasının nedenlerinden biridir (elbette 5 aktif kurulum ve hala büyüyen), tema üreticisi özellikleriyle gelmesidir. Bu özellik, üstbilgiler, altbilgi, tek gönderi şablonları, arşiv sayfaları, woocommerce sayfaları vb. Bunu tek bir kod satırına dokunmadan yapabilirsiniz. Elementors’ın çok sezgisel bir editörü ile her şey sürükleniyor ve gevşek. Tema Builder’ın kendisi Elementor 2.0’da (2018’de piyasaya sürüldü) tanıtıldı. Sürüm 3.0’dan önce, tema oluşturucuya şablonlar -> tema oluşturucu girerek WordPress kontrol paneli üzerinden erişilebilir. Sürüm 3.0’da, tema üreticisine aynı rota üzerinden erişebilirsiniz, ancak yeni arayüzü aşağıdaki gibi göreceksiniz: Elementor 2.x’te, tema üreticisi özelliklerine erişirken aşağıdaki arayüze sunulacak. Elementor 3.0’daki tema üreticisi arayüzü eski sürümden çok daha iyidir. Yukarıdaki GIF’de görebileceğiniz gibi, sol paneldeki her sekmeyi tıkladığınızda tema bölümünüz görsel olarak gözden geçirilir. Buradan, mevcut özel şablonları doğrudan düzenleyebilir, dışa aktarma, sil veya değiştirebilirsiniz. Yeni bir şablon oluşturmak için, özel bir şablon yapmak istediğiniz tema bölümündeki artı mavi düğmeyi tıklamanız yeterlidir. Veya sağ üst köşedeki yeni ekle düğmesine de tıklayabilirsiniz. Bu arada, yeni tema üreticisi ayrıca, sitenizin diğer bölümlerine belirli şablonları ayarlamanızı sağlayan anlık görünüm koşullarını düzenleme sunar. Konsept, varsayılan hızlı düzenleme WordPress özelliğine çok benzer. Mükemmel şey, Elementor bir şablon yapma işlemini değiştirmez. Yine de bir Elementor sezgisel düzenleyicisi aracılığıyla bir şablon yapabilirsiniz. Bittiğinde, ekran koşullarını eskisi gibi ayarlayabilirsiniz. Yeni tema üreticisi, şablonu ayarlama şeklinizi yalnızca yapma şeklinizi değil, değiştirir. Yeni Elementor tema üreticisi gerçekten başka bir şey. Karar – Elementor 3.0 İnceleme Elementor 3.0 ana sürümdür. Web siteleri yapımında geleneksel kalıpları kırmak için bazı yeni özellikler getiriyor. Sitenizi oluşturmak için hiçbir yere gitmenize gerek yok çünkü her şey aynı yerde sağlandı: küresel ayar panelleri. Bu panelden, yukarıda tartıştığımız her şeye erişebileceksiniz: Yeni Tema Yapıcısı Site ayarları (site kimliği, düzen, ışık kutusu, arka plan, özel CSS) Tasarım Sistemi (Global Renkler ve Global Yazı Tipleri)