WordPress’te bir blok düzenleyiciyle bir yön sayfası nasıl oluşturulur
WordPress 5.0’ın bir parçası olarak yayınlanan bir blok düzenleyiciyle bir yön sayfası oluşturmanın mümkün olup olmadığını bilmek ister misiniz? Gerçekten de, bu yazı nasıl olduğunu gösterecek. “Yeni Blok” yaklaşımı sayesinde, artık kahramanları yönetme, harekete geçme (CTA) ve yön sayfasının diğer önemli unsurlarını yönetme yeteneğine sahipsiniz.
Bu yeni işlevden yararlanmanıza yardımcı olmak için, bir Block Düzenleyicisi ile Adım adım nasıl bir yön sayfası oluşturacağınızı göstereceğim.
Yeni #WordPress Block Düzenleyicisi (aka #gutenberg) ile bir yön sayfası oluşturmayı öğrenin
Tweet için tıklayın
WordPress’teki yeni blok düzenleyicisi nedir? Block Editor, WordPress 5.0’ın varsayılan düzenleyicisi olan yeni bir içerik düzenleyicisidir. Gelişiminde, yeni editör “Gutenberg” olarak adlandırıldı. Ancak, daha spesifik olmak istiyorsanız, çekirdeğin bir parçası haline geldiğinden, şimdi sadece “WordPress Editor” veya “Block Editor”.
Neden bahsettiğimden emin değilseniz, yeni editörde birkaç yazı yazdık. Burada temel bir tanıtım ve burada daha yaygın bir öğretici alabilirsiniz. Veya yeni bir düzenleyiciye alışkınsanız, bir yön sayfası oluşturmak için nasıl kullanılacağını öğrenmek için okumaya devam edin … Geliştirme işlemine başlamadan önce mevcut blok düzenleyici arayüzünün kısa turu, işte burada görüntülenen kısa bir tur var. Block Editor kullanıcısının arayüzü. Yeni bir blok eklemek için soldaki bir açılır pencerede çalışacaksınız. Ve bir blok ekledikten sonra, sağ tarafın yan tarafında renk gibi önemli bilgileri ayarlayabilirsiniz:
General Block – Paragraflar, başlıklar, listeler, alıntılar ve diğer temel içerik öğeleri gibi tüm genel öğeleri içerir. Biçimlendirme – özel kodlar eklemek, WP editörleri (klasik) ile blokları düzenlemek veya tablo eklemek için iyi.
Düzen Elemanları – Sütunlar gibi genel düzeni artırmak için öğeler vardır.
Widget – Tasarımınıza sıradan WordPress widget’ları eklemenizi sağlar.
PICING – YouTube, Twitter ve daha fazlası gibi harici platformlardan içerik yerleştirmenize yardımcı olun.
Üçüncü taraf eklentileri aracılığıyla yeni bloklar ve işlevler de ekleyebilirsiniz. Örneğin, Otter Blocks eklentisiyle, fiyat tabloları, referanslar, Google Haritalar ve diğerleri gibi yeni bloklar alabilirsiniz.
WordPress’te bir blok düzenleyiciyle bir yön sayfası nasıl oluşturulur
Size ne öğreneceğinize dair bir resim vermek için, bu yeni bir blok düzenleyiciyle yapacağımız temel yön sayfasıdır: görünüm dışında, hızlı yükleme süresi kaliteli yön sayfaları için çok önemlidir. Bu nedenle, kullandığınız temanın yeni bir blok düzenleyici ve hızlı yükleme ile uyumlu olduğundan emin olun.
Bir blok düzenleyiciyle bir yön sayfası oluşturmak için tema çekiminden ücretsiz Neve temasını seçtim. Özgür ve hafif olmanın yanı sıra, Neve yeni bir blok düzenleyiciyle iyi çalışmak ve doğru yön sayfasını oluşturabilmeniz için size birçok düzen seçeneği sunmak için inşa edilmiştir. Web sitenizi ayarladıktan sonra, tek yapmanız gereken sayfaya gitmek → yeni ekleyin ve çalışmanıza başlayın. 1. Adım: Sayfa Düzeninizi Seçin
Yön sayfanızda yeterli alan sağlamak için, düzeni yan olmadan seçmek isteyeceksiniz. Neve temasını kullanmanın bir başka yararı da bunu kolayca yapabilmenizdir. Düzeni belge bölümünün altındaki sağ taraftan seçebilirsiniz. Yan bıçaklar olmadan düzenlerden birini kullanmak iyi bir seçimdir. Test tasarımları için, ortada içerik olan yan kutuyu seçmiyorum (tam genişlikte değil). Adım 2: Bir sonraki temel yön sayfanızı planlayın, yön sayfanızın genel tasarımı için bir plan yapmak istiyorsunuz, böylece hangisini biliyorsunuz dahil etmeniz gereken öğeler. Örneğin, hizmet satmaya çalışırsanız, yön sayfanızın bir fiyat tablosu olması önemli olabilir (eğer öyleyse, Otter Blocks eklentisi size bunun için bir blok verir). Veya e -posta listenizi geliştirmeye çalışırsanız, ön ve ortada bir e -posta katılım formu isteyebilirsiniz. Bu öğretici için web semineri için basit bir yön sayfası örneğini kullanacağım. Hangi öğelere ihtiyacınız olduğunu düşünmenin yanı sıra, bu öğeleri nasıl ayarlamak istediğinizi de düşünün. Yaygın bir yaklaşım kalıpları kullanmaktır. Bu desen, minimum içeriğe sahip sayfalar için iyidir. Kurallar, kullanıcının sayfayı menü çubuğunda soldan sağa görmeye başlaması, ardından sol alt köşeye gitmeye ve bir kez daha sağ tarafa gitmeye dayanıyor (sayfa ağır içerik olmadığı sürece) . Bu tasarım Shopify, Facebook ve daha fazlası gibi birkaç popüler platform tarafından kullanılır.
İyi bir temel web tasarımı ilkelerini izlerken sayfalarınız için herhangi bir tasarım kullanmaktan çekinmeyin. Adım 3: Yön sayfanıza öğeler eklemek için bir blok kullanın, şimdi önemli bilgileriniz var, sayfanızı oluşturmaya başlamaya hazırsınız. Genellikle, sayfanın üstünde inşa etmeye başlamak ve aşağı hareket etmek en kolay olanı. Örneğimiz için ana başlık ve altyazılarla başlayacağım. Başlıklar, altyazılar ve arka plan resimleri
Kapak bloğu, sayfanızın üst kısmı için iyi bir seçimdir, çünkü büyük bir görüntüyü ve resmin üzerindeki metni girmenizi sağlar. Turuncu bindirme ile arka plan görüntüsünün üstüne başlık ve alt başlık dahil etmek için kullanacağım. Bir kapak bloğu ekledikten sonra, yön sayfanız için güzel bir resim yükleyin. Metninizi daha görünür hale getirmek için, kaplama renkleri ve arka plan opaklığı eklemek için sağ kenar çubuğunu kullanabilirsiniz.
Metin eklemek için yalnızca tıklamanız ve yazmanız gerekir. Eylem Durumu (CTA) Main Bir kapak bloğu ile bitirdikten sonra, düğme bloğunu kullanarak altına ana CTA’nızı ekleyebilirsiniz. Düğmenizin rengini ayarlamak için sağ taraf çubuğunu kullanabilirsiniz. Kapağın altına başlangıç düğmesini eklediğimi görebilirsiniz: Ve bu şimdiye kadar her şeyin doğrudan önizlemede birleştiği yolu budur: Ürün Detayları/Genel Bakış Kutusu Çekici ürün detay kutuları eklemek için bir medya ve metin kutusu kullanabilirsiniz. Adından da anlaşılacağı gibi, bu blok bir tarafta görüntüler ve diğer tarafta her türlü metin içeren iki sütunun düzenini yapar. Metin için bir liste kullanmaya karar verdim. Aşağıda görebilirsiniz: Düzeni artırmak için, ara bloğu ekleyerek önceki parçalar ile bu bölüm arasında boşluk ekleyebilirsiniz. İki blok arasındaki mesafeyi, ara blok üzerindeki mavi noktadan ayarlayabilirsiniz.
Medya ve metin bloğuna içerik ve resimler ekledikten sonra. Bu şöyle görünecek: Son CTA’yı yönlendirme sayfanızın sonuna son CTA eklemek için (CTA) Son ACT (CTA) çağrısı, başka bir düğme bloğu kullanabilirsiniz. Veya bir form kullanmayı tercih ederseniz, WPForms eklentisi, her türlü formu gömmek için kullanabileceğiniz kendi WPForms bloğunu içerir. Blok editörlerle yön sayfaları oluşturmak için tüm bu blokları kullandıktan sonra her şeyi birleştirin, bu son yön sayfasının tasarımında başka bir ekrandır: Blok düzenleyicisinde çalışırken göremeseniz de, Neve tarafı olmayan şablon son tasarımınıza ön tarafta çok fazla beyaz alan verir. Ve hepsi orada! Yeni Blok Editör bir sayfa yapıcı değildir – geçerli ayar seçeneği, düzen ve stil açısından sayfa yapımcılarıyla rekabet edemez. Bununla birlikte, aşamalarda piyasaya sürülen bazı harika eklentiler göreceğiz, çünkü geliştirici 2019’da yeni düzenleyiciye daha alışkındır, bu da boşluğu azaltmalı ve bir blok düzenleyiciyle bir yön sayfası oluşturmayı kolaylaştırmalıdır. Bu kullanım durumu için yeni blok düzenleyicinin diğer sayfa üreticileriyle nasıl karşılaştırıldığını görmek istiyorsanız, bir yön sayfası oluşturma konusunda bir öğreticimiz de var: Ana Sayfa Maker Element Divi yapımcısı
WordPress 5.0’da bir blok düzenleyiciyle nasıl bir yön sayfası oluşturacağınızla ilgili başka sorularınız mı var? Bize yorumlarda söyleyin! Pulkit Bhardwaj tarafından Yeni #WordPress Block Düzenleyicisi (aka #gutenberg) ile bir yön sayfası oluşturmayı öğrenin
Tweet için tıklayın
ÜCRETSİZ KILAVUZU 5 WordPress sitenizi hızlandırmak için önemli ipuçları, basit ipuçlarını takip ederek yükleme sürenizi% 50-80’e kadar azaltın. Ücretsiz Kılavuz İndir
