WordPress Gutenberg Editör Genişliğini Arttırma/Azaltma

Geleceği önceden kesinleşen ancak WordPress’in 5.0 güncellemesine kadar eklenti ile kullanılabilen Gutenberg editörü 5.0 güncellemesi ile hayatımıza tamamen girdi. Blogger‘lar tarafından beğenilen ancak Webmastar‘lar tarafından pek beğenilmeyen Gutenberg’den kurtulmanın yolu olduğu gibi düzenlemenin de çeşitli yolları var. Eğer klasik editörü vazgeçemeyecek kadar seviyorsanız 5.0 güncellemesinden önce nasıl Gutenberg’i eklenti ile deneyebiliyorsak, klasik görünümü de eklenti ile geri getirebiliyoruz.

Bu yazımızın konusu ise Gutenberg editörünü düzenlemek. Her ne kadar konuda sadece genişliğini nasıl değiştireceğinizi anlatsak da ekleyeceğiniz CSS dosyasına yazdığınız tüm CSS kodları Gutenberg editöründe aktif olacak ve sayfayı şekillendirmemize imkan tanıyacak. Öncelikle yapmanız gereken temanızın bulunduğu dizine girerek burada bulunan functions.php dosyasına aşağıdaki kodları eklemek.

/**
Gutenberg block editor style
Lanet olasica Gutenberg editor genisligini duzeltir
*/
function gutenberg_editor_styles() {
    wp_enqueue_style( 'add-editor-styles', get_theme_file_uri( '/gutenberg-style.css' ), false, '1.0', 'all' );
}

add_action( 'enqueue_block_editor_assets', 'gutenberg_editor_styles' );

Artık functions.php dosyasına eklediğimiz kod durduğu sürece Gutenberg editörüne gutenberg-style.css adında bir sitil dosyası çağrılacak. tabi olmayan bir dosyayı çağırmak istemeyiz, bu nedenle 2. aşama olarak temamızın içerisine bir gutenberg-style.css dosyası oluşturuyoruz ve son olarak bu dosyanın içerisine aşağıdaki kodları eklediğimizde Gutenberg editörümüzün genişliğini de değiştirmiş oluyoruz.

/* Main column width */
.wp-block {max-width: 870px;}
/* Width of "wide" blocks */
.wp-block[data-align="wide"] {max-width: 1080px;}
/* Width of "full-wide" blocks */
.wp-block[data-align="full"] {max-width: none;}

Önemli not: Örnek kodda biz işlem yaptığımız sitenin içerik genişliğini baz alarak 870px değerini girdik, sizde 870px yerine istediğiniz değeri girerek genişliği arttırabileceğiniz gibi azalta da bilirsiniz. Ayrıca px yerine % değerini de kullanarak duyarlı bir genişlik belirleyebileceğinizi unutmayın.

11
Bir yorum yap yada bir soru sor.

avatar
10 Yorum konuları
1 Konu cevapları
0 Takipçiler
 
En çok beğenilen yorum dizilişi
En iyi yorum dizilişi
11 Yorum yazarları
Erencemil doğancanFurkan YurdakulBurakislamzeki Son yorum yazarları
  Yorumlara Abone Ol  
Önce Yeniler Önce Eskiler Önce Beğenilenler
Bildir
Engin
Engin

WordPress tarafından getirilen bu yeni içerik editörü bir Webmaster olarak benim hoşuma gitmesine rağmen henüz yeterli olmadığını düşünüyorum. Geliştirilmesi gereken birçok nokta bulunuyor umarım en kısa zamanda eksiklikleri giderilir, bunlardan birisi sizin anlatmış olduğunuz genişlik meselesi çok teşekkürler.

eren can bursalı
eren can bursalı

Bu yeni güncellemede bir kaç eksiklikler mevcut hele ki özel temalarda sorun yaratabiliyor benim program temam da özel br bölüm var güncelleme aldıktan sonra orası kayboluyor ve buda benim canımı sıkıyor o yüzden eski sürüm benim için daha iyi oluyor.

İsmail
İsmail

Eyvallah hocam işime yaradı ama nedense gutenberg editörünü bir türlü sevemedim çok zor ve karmaşık geldi ilk kullanımda alışırmıyım zamanla bilemem ama güncelleme yaptık artık. Editörü eski haline haline çevirmenin bir yolu varmı acaba?

Yasir
Yasir

Öncelikle şunu belirtmek istiyorum, WordPress Gutenberg Editör Genişliğini İstediğim şekilde değiştirdim ve çok teşekkür ediyorum. Yeni güncelleme ile Gutenberg Editör düzenleme basitçe yapılabiliyor. Ama kodlar üzerinde değişiklik yaparken dikkat etmelisiniz.

Halil
Halil

Bu yeni guncellemedeki tasarima tam Alışamadım iyi mi oldu kotu mu oldu bilemiyorum tabi yoast seo onerilerine gore iyi olduğunu fark ettim oralarda hatalar vardı bu yeni editör sayesinde o hatalar giderilmis yazının HTML Kod kısmındaki düzen oldukça düzelmiş yararı mutlaka olacaktır. Bu şekilde özelleştirme bilmesi de çok daha iyi olmuş en azından sayenizde güzel hale getirebildim, teşekkürler.

islamzeki
islamzeki

Yeni güncelleme birçok kişi tarafından tepki çekmiş olsa da bana kalırsa oldukça başarılı olacak, henüz yeni yayınlandı ve birçok eksiklik kısa zamanda giderilecektir diye düşünüyorum. Bu ihtiyaç duyduğum bir özellikti sayenizde kolayca hallettim.

Burak
Burak

Bir wp blogger olarak wordpress editör genişliği azaltma yazınızı çok beğendim. Yakında ihtiyacım olacağı için sık kullanılanlara ekliyorum. wordpress ile ilgili bu yazınız için teşekkür ederim. Faydalı paylaşım.

Furkan Yurdakul
Furkan Yurdakul

WordPress’in bu köklü değişikliği çok şahaneydi, bu gutenberg editörü de aslında çok güzel, ama o küçük kısım bazen can sıkabiliyordu, kodlar için teşekkürler daha hoş bir editörüm oldu :D

cemil doğancan
cemil doğancan

Sanırım bu yeni editörü beğenen sadece ben varım. Eksikleri şu an için oldukça fazla kabul ediyorum ama bunu kullanmayıp eskisine dönmek pek akılcı bir çözüm değil bence. Sonuçta wordpress bunun üzerinden geliştirmelerine devam edecek ve tüm tuğlaları bu editör üzerinden birbirine bağlayacağız. Bu yüzden sevmeseniz de bu editör gelen güncellemelerle ilerde çok daha fonksiyonel bir hal alacağından alışma sürecinde yazıda paylaşılan küçük ama güzel çözümler kesinlikle eski editöre dönmekten daha mantıklı.

Eren
Eren

Çok faydalı bir yazı olmuş. Gutenberg ilk çıktığında pek beğenmemiştim, hemen silip klasik düzenleyiciyi kurmuştum. Ancak araştırmalarım sonucunda özelliklerinin daha fazla olduğunu keşfettim. Şimdi gutenberg kullanıyorum ve gayet memnunum. Editör genişliği gerçekten merak ettiğim bir konuydu, çünkü bana dar geliyor, böyle olunca sayfanın üstünden altına gitmek zahmetli oluyor. Yazılarımın 2000kelime üstünde olduğunu düşününce sizde bana hak verirsiniz.