Gutenberg Nasıl Kullanılır: Yeni WordPress Blok Düzenleyici hakkında Hızlı Kılavuz
İçindekiler
WordPress 5.0 sürümünden hemen sonra, bu yeni Gutenberg WordPress düzenleyicisinin nasıl kullanılacağı konusunda oldukça büyük bir belirsizlik vardı. Devrim niteliğinde bir arayüzle nasıl çalışılır, Gutenberg nasıl kullanılır ve bir web sitesinin temel öğesi olarak blokları işlemeye nasıl başlanır? WordPress blok düzenleyici eğitimimizde, Gutenberg editörü ve onunla nasıl çalışılacağı ile ilgili tüm bilgileri netleştireceğiz.
TinyMCE (diğer adıyla WordPress zengin metin editörü), görsel ve metin modlarına sahip eski iyi bilinen arayüz olan birçok kişi tarafından sevildi ve muhtemelen sevildi. Gutenberg'in yeni WordPress editörü, kendi adına, yepyeni konseptine sahip olan ve bir web sitesi oluşturma sürecinin tamamını yükselten tamamen farklı bir şeydir. Bu Gutenberg öğreticisini, onunla nasıl çalışacağınızı bir kez ve herkes için anlamanız için blok ve blok temaları için oluşturduk.
WordPress blok düzenleyicisinin Ana Konsepti
Gutenberg Bloğu , Gutenberg'in temel unsurudur. Artık WordPress Gutenberg editörü ile herhangi bir web sitesi, birbiriyle birleştirdiğiniz, entegre ettiğiniz ve özelleştirdiğiniz çeşitli bloklardan oluşur.
Bu, gördüğünüz anda çok basit – tüm web sitesi bloklardan oluşuyor, bir göz atın:

A – İmge Gutenberg Bloğu
B – Gutenberg Bloğu Başlığı
C – Düğme Gutenberg Bloğu
D – Ara Parça Gutenberg Bloğu
E – Kesit Gutenberg Bloğu
Bu andan itibaren, kelimenin tam anlamıyla bloklar ekleyerek bir web sitesi oluşturursunuz, bu tıpkı bir kurucu veya hatta lego gibidir (kavramın daha iyi anlaşılması için). Böyle anlaşılması kolay bir yaklaşım, WordPress kullanıcıları için yeni olan teknoloji meraklısı olmayanlara tüm kapıları açar ve gerekli kod olmadığı için doğrudan kullanmaya başlayabilir, bu da derin bir programlama bilgisi anlamına gelir.
Yeni WordPress editörü Gutenberg ile her şey daha basit!
Arayüze geri dönersek, bloklarla çalışıyorsunuz ve arka uçta gördüğünüz şey neredeyse ön uçta alacağınız şey. Deneyiminizi daha görsel hale getirir ve zamandan tasarruf sağlar – ön ucun nasıl değiştiğini sürekli kontrol etmeniz gerekmez.
Majesteleri, WordPress Blokları
WordPress bloklarıyla çalışmadan önce, editör alanında en az bir blok bulundurmanız gerektiği açıktır. Varsayılan olarak, gönderinize bir ad vermek için bir Başlık bloğunuz vardır.

Yeni bir blok eklemek için "artı daireler"den birine tıklayın, seçim yapabileceğiniz üç seçenek vardır. En üstteki simge yapışkan olanıdır, bu arada diğer ikisi yalnızca imleci bloğun üzerine geldiğinizde görünür hale gelir.

Ayrıca, eğik çizgiden hemen sonra adını yazarak da bir blok ekleyebilirsiniz (bu, biraz deneyime sahipseniz ve her bir blok adını biliyorsanız bu kullanışlıdır)

“Merhaba Gutenberg” bu bizim başlığımız ve hemen altında, web sitesinde görüntülenmesini istediğiniz ilgi çekici içeriği yazacağınız alanı açıkça görebilirsiniz.

Herhangi bir içeriği yazar yazmaz, metin hizalama, kalın, italik, bağlantı ekleme gibi temel ayarlara sahip hoş bir araç çubuğu vardır ve küçük oka tıklayarak kod ekleme, satır içi görüntü ve üstü çizili görüntü elde edersiniz.

Sağ taraftaki araç çubuğuna bakarsanız, yazı tipi boyutu, arka plan ve metin rengi ayarları gibi metin değiştirme için daha fazla seçenek göreceksiniz ve daha fazla seçenek için özel kod satırları ekleyebileceğiniz gelişmiş bir CSS sınıfı bölümü bile var. .

Gutenberg WordPress düzenleyicisinin en güzel yanı, oluşturduğunuz herhangi bir bloğun yeniden kullanılabilir bloklara kaydedilebilmesi ve daha sonra bunları yeniden oluşturmadan birden çok kez kullanılabilmesidir. Bu özellik, her gün web siteleri ile uğraşanlar, bloglar için çeşitli içerikler yazanlar vb. için harikadır.
Özel bloklarınızı kaydetmek için en kolay talimatları izleyin.

Yeniden kullanılabilir bir blok oluşturup kaydettikten hemen sonra, Bloklar listesi > Yeniden Kullanılabilir'de tıklamalarla bulabilirsiniz.

Tüm Yeniden Kullanılabilir Blokları Yönet'e tıklarsanız, şu ana kadar oluşturduğunuz tüm blokların bulunduğu, bunları silebileceğiniz veya gelecekte başka web sitelerinde kullanmak üzere dışa aktarabileceğiniz sayfaya yönlendirileceksiniz.
Muhtemelen farklı bloklardan oluşan daha fazla sekme fark etmişsinizdir. Onlara da biraz ışık tutalım.

Ortak Bloklar – çoğunlukla kullanılan temel blok setini içerir (Paragraf, Resim, Alıntı, Galeri, Başlık, vb.).
Biçimlendirme – bu bloklar, sayfadaki tüm içeriği (Pullquote, Table, Verse, Custom HTML, vb.) yönetmek için harika araçlardır.
Düzen Öğeleri – İçeriği olmasını istediğiniz şekilde görüntülemek için bunları kullanın: Aralayıcı, Ayırıcı, Sayfa Sonu, Sütun Blokları (ve daha fazlası) ile içeriğinizi bütünsel görünecek şekilde zahmetsizce yeniden düzenleyebilirsiniz. Size yardımcı olacak blok filtreler var.
Widget'lar – onların yardımıyla Kategorileri, En Son Yorumlar ve Gönderileri, Arşivleri, Takvimi ve daha birçok widget'ı doğrudan Gutenberg'de görüntüleyebilirsiniz.
Gömmeler – YouTube, Twitter, Instagram, Facebook vb. gibi üçüncü taraf kaynaklardan içerik ekleyin.

Sağ üstteki Engelleme ayarlarının yanında, web sitenizin sayfasını yönetmek için bir sekme daha var – Belge .

Bu bölümde, URL bilgisini yazacaksınız (gönderi bağlantısı bu şekilde görünecek), öne çıkan bir resim (gönderi başlığının yanındaki ilk resim, gönderiler listesinde görülecektir), gönderinin altında yorumlara izin vereceksiniz. ve sayfa niteliklerini ayarlayın, şablonu seçin (kullandığınız temaya göre değişir) ve bu sayfanın alt sayfa olmasını istiyorsanız ana sayfaya bağlayın.
Bloklara göre daha da ileri gidecek olursak, en çok kullanılan WordPress bloklarından biri de Image Block. Artı düğmesine tıklayarak, flash (/ image ) aracılığıyla yazarak veya masaüstünüzden sürükleyip bırakarak ekleyin.
Not : Blok düzenleyicide kendi Medya kitaplığınızı da oluşturabilirsiniz, burada gerekli tüm görüntüler depolanır ve bunları her seferinde yüklemeniz gerekmez.

Kenarlık boyutunu değiştirerek resminizi düzenlemeye başlayın (sadece resimden sağa sürükleyin), altına bir başlık yazın, alternatif metin ekleyin (bu, SEO arama sıralamanızı etkiler), resim boyutunu, resim boyutlarını seçin, resme bir bağlantı ekleyin ve zaten deneyimliyseniz Gelişmiş CSS bölümünü kullanın.

İçeriğinizi daha ilgi çekici ve canlı görüntüler içeren hale getirmek için Galeri bloğunu kullanın. Düzenler, blok düzenleyicide istediğiniz görüntüleri seçtikten hemen sonra otomatik olarak oluşturulacaktır.

Hack : Klavyede Shift+Alt+H yazdığınızda, ekranınızda editörde gezinmenize, son değişikliklere, eylemleri tekrarlamanıza veya geri almanıza, seçenekleri değiştirmeye vb. yardımcı olacak kısa kodların listesi görünecektir.

Gutenberg editörü ile, oklara tıklayarak (aşağıda gösterildiği gibi) veya okların arasına yerleştirilmiş fare işaretçisi ile blokları manuel olarak sürükleyerek her bloğun konumunu zahmetsizce değiştirebilirsiniz.

İpucu : İçeriğinizin daha yapısal görünmesini sağlamak için Sütunları kullanın.
Blok düzenleyicideki örnek:

Düzenleme alanında sağ üst köşede dört buton bulacaksınız.

Önizleme – web siteniz ön uçta böyle görünür. Sayfanın gerçek yayınlanması olmadan bunu kontrol edin.
Yayınla – Gönderiniz tüm İnternet kullanıcıları tarafından blok düzenleyicide görülecektir.
Ayarlar – çarka tıklandığında sağdaki ayarlar paneli kaybolacak ve tekrar basıldığında – belirecektir.
Daha fazla – ayarlarla ilgili daha fazla özellik. Bu düğmeye tıklayarak, daha fazla seçenek alırsınız, yani:
Üst Araç Çubuğu – varsayılan değiştirme ayarları, kullandığınız bloğa bağlı olarak gönderinin üst kısmında yapışkan bir başlık olarak görünecektir.
Spot Işığı Modu – üzerinde çalışmadığınız tüm bloklar yarı saydam olacaktır, böylece dikkatiniz yalnızca ihtiyaç duyduğunuz yere, yalnızca birlikte çalıştığınız bloka odaklanacaktır.
Tam ekran modu – bununla, sol tarafta WordPress arayüzünü görmezsiniz ve daha iyi UX & UI'ye sahip olursunuz, başka bir deyişle, hiçbir şey dikkatinizi dağıtmaz.

Gutenberg tarafından sağlanan ayarların tümü, özellikle kişisel bir blog çalıştırmak ve şirketinizi ve ürünlerinizi güzel bir şekilde sunmak istiyorsanız, herhangi bir ölçekte bir web sitesi için harika, orijinal ve çekici içerik oluşturmak için fazlasıyla yeterlidir.
Bununla birlikte, Gutenberg sizi yalnızca varsayılan bloklarla bırakmaz, çünkü bazıları, özellikle ileri düzey kullanıcılar, daha fazla kişiselleştirme seçeneğine ve oynamak için başka bazı yeni ilginç bloklara sahip olmak isteyebilir. Bu bağlamda, Gutenberg, Gutenberg, temanız ve tasarımınız ile sorunsuz bir şekilde etkileşime girecek herhangi bir blok eklentisini entegre etmenize izin verir.
Gutenberg için ek eklentiler veya Eklentiler, Gutenberg bloklarının temel seçeneklerini büyük ölçüde genişleten ve dikkat çekici afişler, blok şablonları, CTA'lar, reklamlar vb. oluşturmaya yardımcı olan yeni özel blok koleksiyonlarıdır.
Yardımlarınız ve referanslarınız için Gutenberg el kitabı var.
Gutenberg WordPress için Getwid 34+ Benzersiz Blok
WordPress'te bloklar nasıl oluşturulur? Elinizde harika bir blok kitaplığı varsa buna ihtiyacınız yok.
Getwid, Gutenberg WordPress blok düzenleyicisi için web sitenize kolayca entegre edilebilen 34+ ek blok sağlayan ücretsiz bir eklentidir. Getwid ile harika içerikler oluşturmak için blok tasarımcı olmanıza gerek yok.
Getwid'in arkasındaki ana konsept, onları mümkün olduğunca Gutenberg WordPress'e özgü hale getirmektir. Aramada böyle görünüyorlar:

Getwid Blocks sürekli olarak sayısını artırıyor, bu nedenle 34+ son blok değil!
Getwid koleksiyonunda, zengin özelliklere sahip işlevsellikle sizi kesinlikle etkileyecek çok güçlü bloklar var: Bölüm Bloğu , Afiş Bloğu , benzersiz Görüntü ve Medya Kaydırıcı Blokları , MailChimp Bloğu ve ücretsiz olarak kullanabileceğiniz diğer birçok güçlü blok !
Şu anda çok sayıda blok eklentisi olmasına rağmen, hepsi ücretsiz değil ve WordPress blok düzenleyici için çok çeşitli işlevler sunuyor.
Getwid'i Gutenberg destekli web sitenize yükleyin ve web siteniz için üçüncü taraf eklentileri veya blokları aramanıza gerek kalmayacak, ihtiyacınız olan her şeyi bunlar oluşturuyor. Ve gelecekte, insanların ihtiyaçlarına göre oluşturulan daha fazla güncelleme ve daha fazla blok olacak.
WordPress blok temaları
Bu WordPress blokları öğreticisi için kullanılan tema, yalnızca Getwid bloklarıyla oluşturulmuştur ve buna mükemmel bir blok şablonu olan Getwid Base Theme adı verilir. Bu, herhangi bir ölçekte ve türde bir web sitesini (blog, portföy, vb.) çalıştırmak için uygun olacak ücretsiz çok amaçlı bir temadır.

Blok Şablonu Demosunu Kontrol Edin
WordPress blok düzenleyicide nasıl çalışılacağına dair sonuç
Gutenberg, 5.0 sürümünden başlayarak WordPress'in yeni varsayılan editörüdür. Bu WordPress editörü devrim niteliğindedir, çünkü web sitesinin ana öğesi bir bloktur ve siz manuel olarak kod yazmazsınız, sadece ihtiyacınız olanı oluşturmak için blokları sürükleyip bırakırsınız.
Kullanıcı deneyimi en üst düzeydedir, web sitesi oluşturma prosedürü olabildiğince kolaydır, özelleştirme araçları zengin özelliklere sahiptir ve buna ek eklentiler tamamen ücretsizdir (Getwid Gutenberg Blokları).
Gutenberg WP'nin TinyMCE (WordPress zengin metin editörü) önündeki bariz avantajlarına rağmen, yeni içerik editörünün kabul edilemez bir şey olduğuna dair görüşler hala var. Ve böyle bir tepkinin net bir açıklaması var: insanlar eski editörle uzun yıllardır çalışıyorlar, arayüze , özelliklere ve özelliklerine alıştılar. Yeni, daha önce hiç görülmemiş bir şeyle çalışmak ve bunu çözmek için biraz zaman kazanmak söz konusu olduğunda, birçok insan reddeder ve konfor alanlarından çıkmaz. Ancak bu hiçbir şekilde Gutenberg'de bir sorun olduğu anlamına gelmez.
Birçok kişi Gutenberg WP editörü ile çalışıyor ve wp.org'da indirilen Gutenberg Blocks eklentilerinin sayısı sadece bu gerçeği kanıtlıyor. WordPress'in geleceği kesinlikle Gutenberg ile bağlantılıdır ve daha önce duymadıysanız, bu makale size gerekli tüm bilgileri zaten vermiştir. Blok temaları dizini de giderek zenginleşiyor, bu nedenle herhangi bir işletme için doğru blok şablonunu yakında bulabileceksiniz.
WordPress blok düzenleyicisi hakkındaki düşüncenizi bilmek bizim için ilginç olacak, beğendiniz mi, beğenmediniz mi? Deneyimin neydi? Düşüncelerinizi aşağıdaki yorumlarda paylaşmaktan çekinmeyin.
ev borcu WordPress sitesi