Oluşturucu Temelleri: Blok Kalıplarını Keşfetme

WordPress'in en son sürümü 25 Ocak'ta ayın sonunda gelecek. Belki de siz bu yazıyı okurken, 5.9 sürümü zaten dünyaya yayınlanmıştır. Daha heyecanlı olamazdım. Birçoğu gelecekteki makalelerde ele alacağımız sayısız geliştirme ve yeni özellik var, ancak bugünün konusu blok “kalıplar”.

WordPress için yeni olmasa da, özellikle blok tabanlı temalar olmak üzere 5.9 sürümü tarafından etkinleştirilen işlevsellik nedeniyle kalıplar çok fazla ilgi görüyor. Kalıplar hızla WordPress'in temel bir bileşeni haline geliyor ve web siteleri tasarlama ve oluşturma şeklimizi yeniden şekillendirmeye hazır görünüyor. Öyleyse, blok kalıplarının gerçekte ne olduğunu ve bunları nasıl kullanabileceğinizi keşfetmek için daha iyi bir zaman olabilir mi?

Temeller

Blok kalıplarına dalmadan önce, temel bilgilerle başlayalım ve bazı terminoloji oluşturalım. WordPress son birkaç yılda biraz değişti. Hepimizin aynı sayfada olduğundan emin olmak güzel.

Engellemek

Bir blok , WordPress'teki içeriğin temel “birimidir”. Bir metin paragrafından bir resim galerisine kadar, bir blok hemen hemen her biçimi alabilir. Tek bir LEGO parçası hayal etmeyi seviyorum . Her blok farklı görünebilir veya benzersiz bir işleve hizmet edebilirken, hepsi bir web sayfasının içeriğini oluştururken birbirine çok yakışır.

Model

Bir blok deseni , belirli bir düzen oluşturan önceden tanımlanmış bir blok koleksiyonudur. Bir desen, tek bir blok olabilir veya birden fazla bloktan oluşabilir. Daha sonra göreceğimiz gibi, kalıplar karmaşık sayfa düzenleri oluşturmayı kolay ve eğlenceli hale getirir.

Editör

Editör , bloklardan sayfalar ve gönderiler oluşturmak için kullandığımız kullanıcı arayüzüdür. WordPress 5.0'da 2018'de piyasaya sürülmesinden bu yana, Editör birçok isimle anıldı. Bunlara Gutenberg, Gutenberg Düzenleyici, Blok Düzenleyici ve diğerleri dahildir. Bu makalenin amaçları doğrultusunda sadece “Editör” terimini kullanacağız.

yerleştirici

Düzenleyici içinde, Yerleştirici , sayfaya bloklar ve desenler eklemek için kullanılır. Ekleyiciye Editörün sol üst köşesindeki mavi (+) işaretine tıklayarak ulaşabilirsiniz.

Aşağıdaki ekran görüntüsü tanımlı terimlerimizi göstermektedir.

Neden Blok Kalıpları?

Editör, ister basit bir blog yazısı isterse ayrıntılı bir açılış sayfası olsun, bloklardan pratik olarak herhangi bir tasarım oluşturmamızı sağlar. Bu makaleyi örnek olarak kullanalım. Şu anda okuduğunuz şey bir Paragraf bloğu. Yukarıdaki başlık bir Başlık bloğudur ve ekran görüntüsü yalnızca bir Görüntü bloğudur. Bu içerik öğelerini sayfaya eklemek kolaydı. Yerleştiriciyi açtım, uygun bloğu buldum ve eklemek için tıkladım.

Hızlı İpucu: Blokların eğik çizgi komutu kullanılarak da eklenebileceğini biliyor muydunuz? “/” tuşuyla yeni bir paragrafa başlayın ve mevcut blokların bir listesi görünecektir. Ek harfler yazmak, arama sonuçlarında ince ayar yapacaktır. Bir şans ver!

Biraz daha karmaşık bir şeye ne dersin? Bir web sitesinde ürünleri veya hizmetleri sergilemek için yaygın olarak kullanılan bir tasarım olan aşağıdaki fiyatlandırma tablosunu göz önünde bulundurun.

Yakından bakın ve bu düzeni oluşturmak için kullanılan tek tek blokları tanıyabilirsiniz. Taban, eşit aralıklı üç sütun içeren bir Sütun bloğudur. Her Sütun bloğunun içinde bir Ayırıcı, Başlık, Paragraf, Düğmeler ve Aralayıcı bloğu bulunur. Kaç tanesini fark edebildin?

Aslında bu fiyatlandırma tablosu 25 ayrı bloktan oluşuyor. WordPress'teki beceri seviyeniz ne olursa olsun, bu düzeni sıfırdan kopyalamak hem sıkıcı hem de biraz zorlayıcı olacaktır.

Şimdi, bu 25 blokluk grubun sizin için önceden yapılandırıldığını hayal edin. Tek bir tıklama ile tam fiyat tablosunu ekleyebilir ve kişisel ihtiyaçlarınıza göre ayarlayabilirsiniz. Daha da iyisi, parmaklarınızın ucunda her biri temanızın estetiğine uyan geniş bir tasarım koleksiyonu olsaydı? Yaratıcı resim ve metin düzenleri, harekete geçirici mesajlar, üstbilgiler, altbilgiler ve hatta tam sayfa düzenleri düşünün. Bu tür bir "başlangıç ​​içeriğine" sahip olmak çok zaman kazandıracak ve hatta Düzenleyiciyi daha yeni WordPress kullanıcıları için daha erişilebilir hale getirecektir.

İşte burada blok kalıplar devreye giriyor. Yukarıdaki fiyatlandırma tablosu aslında WordPress 5.9 ile birlikte piyasaya sürülecek olan Twenty Twenty-Two temasında yer alan bir kalıptır!

Umarım bu küçük alıştırma, blok kalıpların potansiyeli konusunda neden bu kadar heyecanlandığımı göstermiştir, ancak bunları gerçekte nasıl kullanırız?

Desenler Nasıl Kullanılır

Bloklar gibi, desenler Yerleştirici kullanılarak bir sayfaya eklenebilir. Yerleştirici açıkken, kategorilere göre ayrılmış tüm mevcut kalıpları gösteren "Desenler" sekmesine gidin. Size uygun düzeni seçin ve eklemek için tıklayın. Daha sonra, diğer bloklarda yaptığınız gibi, deseni oluşturan tek tek blokları düzenleyebilirsiniz. Ekleyebileceğiniz desen sayısında bir sınırlama yoktur. Benzersiz sayfa tasarımları oluşturmak için karıştırın ve eşleştirin.

Yerleştirici blok kalıplara kolay erişim sağlarken, her bir kalıbın önizlemesinin oldukça küçük olduğunu ve hepsinin tek bir sütunda istiflendiğini fark edeceksiniz. Düzenleri görselleştirmek ve karşılaştırmak zor olabilir, bu da doğru olanı seçmeyi zorlaştırır.

Bu sorunu çözmek için WordPress 5.9, Kalıp Gezgini'ni içerir. Bu heyecan verici yeni özelliğe, "Desenler" sekmesindeki kategoriler açılır menüsünün yanındaki "Keşfet" düğmesine tıklayarak erişilebilir.

Gezgin, bir kılavuzda görüntülenen desenlerle gelişmiş bir tarama deneyimi sağlayan kalıcı bir pencere açar. Ayrıca kategoriye göre kolayca aranabilir veya filtrelenebilirler.

Yukarıdaki ekran görüntüsü, Pattern Explorer'ın ilk yinelemesidir. Gelecekteki WordPress sürümlerinin Explorer'ın işlevselliğini genişletmesi bekleniyor. Mevcut deneyler, mobil/tablet önizlemeleri ve ızgara düzeninin aksine kalıpları ayrı ayrı demo seçeneği ekler. Hiçbir şey onaylanmasa da, 2022'nin ortalarına doğru WordPress 6.0'daki ek geliştirmelere dikkat edin.

Tüm bu kalıp tartışmasıyla, merak ediyor olabilirsiniz, aslında nereden geliyorlar?

Nerede Bulunur?

Kalıplar, mevcut temanız, bir üçüncü taraf eklentisi veya WordPress'in kendisi aracılığıyla Kalıp Dizini aracılığıyla üç yoldan biriyle kaydedilebilir. Her yöntemi inceleyelim.

Tema

Temanız, muhtemelen kalıpların web sitenizde kullanıma sunulmasının en doğrudan yolu olacaktır. Yukarıdaki fiyatlandırma tablosunda gördüğümüz gibi, birçok blok tabanlı tema kendi ısmarlama desen koleksiyonlarını içerir. Bu, temaların kendilerini farklılaştırmasının başka bir yoludur ve sağlam bir düzen seçenekleri seti, kullanıcılar için büyük bir fayda sağlayacaktır. Yazma sırasında, Twenty Twenty-Two teması 60'ın üzerinde ürünle birlikte gönderilecek!

Kalıp Dizini (WordPress)

WordPress 5.9'un piyasaya sürülmesiyle başlayarak, WordPress, Kalıp Dizini aracılığıyla kendi kalıplarını sağlayacaktır.

Kalıp Dizini, WordPress eklentisi ve tema havuzlarına çok benzeyen, topluluk tarafından yönlendirilen bir kalıp deposudur ve 5.9 sürümünden itibaren herkese açık gönderimlere açık olacaktır. Gönderilen ve onaylanan tüm kalıplar, doğrudan Kalıp Gezgini'nden göz atmanız ve eklemeniz için hazır olacaktır. Bu, WordPress kullanıcılarının binlerce olmasa da yüzlerce blok kalıbına erişebileceği anlamına gelir.

Hızlı İpucu: Bazı temalar, WordPress'in içerdiği kalıpları Kalıp Dizininden devre dışı bırakabilir. Bu genellikle tema geliştiricileri kendi desen koleksiyonlarını eklediğinde ve daha iyi seçilmiş bir kullanıcı deneyimi sağlamak istediğinde yapılır.

Üçüncü Taraf Eklentiler

Sonunda eklentilerimiz var. Kalıplar birkaç yıldan beri var olduğundan, Genesis Blocks ve Redux gibi birçok üçüncü taraf eklentileri kapsamlı kalıp kitaplıkları oluşturmuştur. Genellikle bu kitaplıklar, Kalıp Gezgini gibi özelliklerle doğrudan entegre değildir ve WordPress çekirdeğinde bulunmayan özel bloklara sahiptir. Ayrıca, kalıp eklemek için kendi yöntemlerini kullanma eğilimindedirler, ancak zamanla birçoğunun WordPress'in yeni standartlaştırılmış yaklaşımına uymaya başlayacağını düşünüyorum.

Kalıp Dizini olgunlaşmaya devam ederken niş bloklar ve düzenler arıyorsanız veya kendi kalıplarına sahip bir tema kullanmıyorsanız, kesinlikle üçüncü taraf eklentilerin neler sunabileceğini keşfetmenizi tavsiye ederim.

Desenlerin Geleceği

WordPress 5.9, kalıpları engellemek için birçok geliştirme getirecektir. Tartıştığımız gibi, Pattern Explorer web siteniz için doğru tasarımı seçmeyi kolaylaştıracaktır. Desen Dizini, temanıza sorunsuz bir şekilde entegre olacak, topluluk tarafından oluşturulmuş geniş bir desen koleksiyonuna erişmenizi sağlayacaktır.

Bireysel bloklardan her zaman benzersiz tasarımlar yaratabilecek olsanız da, çoğumuzun doğrudan Desen Gezgini'ne gideceğine inanıyorum. Temamız tarafından veya Dizin'den sağlanan bir düzen seçeceğiz ve ardından gerektiği gibi ince ayar yapacağız. yapacağımı biliyorum.

Ayrıca, yeni blok tabanlı temaların, yerleşik blok desen koleksiyonlarının ne kadar kapsamlı olduğuna göre değerlendirilmesini bekleyebiliriz. Hepsi düzgün bir şekilde kategorize edilmiş ve çok çeşitli kullanım durumlarını kapsayan yüzün üzerinde desene sahip temalar büyük olasılıkla norm haline gelecektir. Bir temanın estetiği önemli olsa da, kullanıcılara zahmetsizce güzel web sayfaları oluşturmak için ihtiyaç duydukları araçları sağlamak çok önemlidir.

Kalıplar WordPress'in geleceğidir ve gelecek parlaktır.

toparlamak

Bu makalede, blok kalıplarının ne olduğunu, bunları nasıl kullanabileceğinizi ve WordPress web siteleri oluşturma şeklimizi neden temelden değiştireceklerini inceledik. Bir sonraki Oluşturucu Temelleri makalesinde biraz daha derine ineceğiz ve size kendi kalıplarınızı nasıl oluşturacağınızı öğreteceğiz!

Peki desenler hakkında ne düşünüyorsun? Bunları web sitenizde kullanıyor musunuz? Bu makalede ele alınmayan sorularınız mı var? Yorumlarda bize bildirin.