WordPress'te Blok Yüksekliği ve Genişliği Nasıl Değiştirilir

WordPress bloklarınızı tam olarak doğru boyuta getirmek, özel CSS veya karmaşık geçici çözümler gerektiriyordu.

Bu tam olarak bu sorunla kullanıcıların yardımına koştuğumuz sayısız saatler sayesinde biliyoruz. Ancak son WordPress güncellemeleri sayesinde blok boyutlarını kontrol etmek çok daha kolaylaştı.

Birçok insanı şaşırtan şey, WordPress'te blok boyutlarını ayarlamanın aslında birkaç yerleşik yolu olmasıdır. Çok sayıda deney yaparak, farklı durumlar ve temalar üzerinde çalışan en güvenilir yöntemleri belirledik.

Bu kılavuzda, WordPress'te blok yüksekliklerini ve genişliklerini değiştirmenin en kolay yollarını paylaşacağız.

WordPress'te Blok Yüksekliğini ve Genişliğini Neden Değiştirmeli?

WordPress blok düzenleyicisi içerik eklemeyi kolaylaştırsa da, varsayılan blok boyutları her zaman aklınızdaki tasarıma uymayabilir. Bir bloğun yüksekliğini ve genişliğini ayarlamak, sayfanızın görünümü üzerinde daha fazla kontrol elde etmenin basit bir yoludur.

Bir bloğun boyutunu değiştirmek isteyebileceğiniz birkaç temel neden şunlardır:

• Görsel Düzeni İyileştirin: Öğelerinizin tam boyutunu kontrol ederek daha dengeli ve profesyonel görünümlü tasarımlar oluşturabilirsiniz.
• Okunabilirliği Artırın: Metin bloklarının genişliğini ayarlamak, özellikle geniş ekranlarda içeriğinizin okunmasını kolaylaştırabilir.
• Duyarlılığı Sağlayın: Blokları doğru boyutlandırmak, içeriğinizin masaüstü bilgisayarlardan cep telefonlarına kadar tüm cihazlarda harika görünmesine yardımcı olur.
• Vurgu Oluşturun: Bir bloğu daha büyük veya daha küçük yapmak, önemli harekete geçirici mesajlara veya anahtar bilgilere dikkat çekebilir.

Bununla birlikte, WordPress'te blok yüksekliğini ve genişliğini nasıl kolayca değiştirebileceğinize bakalım.

Birkaç farklı yöntemi ele alacağız ve kullanmak istediğiniz yönteme atlamak için aşağıdaki hızlı bağlantıları kullanabilirsiniz:

• Yöntem 1: Blok Ayarlarını Kullanarak Blok Yüksekliğini ve Genişliğini Değiştirme
• Yöntem 2: Sütun Bloğunu Kullanarak Blok Genişliğini Değiştirme
• Yöntem 3: Grup Bloğunu Kullanarak Blok Yüksekliğini ve Genişliğini Değiştirme
• Yöntem 4: Kapak Bloğunu Kullanarak Blok Yüksekliğini Değiştirme
• Bonus: SeedProd'da Gelişmiş Blokları Kullanarak Güzel Sayfalar Oluşturun

Yöntem 1: Blok Ayarlarını Kullanarak Blok Yüksekliğini ve Genişliğini Değiştirme

Bu yöntemde, WordPress'in varsayılan ayarlarını kullanarak bir bloğun yüksekliğini ve genişliğini nasıl değiştireceğinizi göstereceğiz.

Şu anda WordPress, tüm bloklar için aynı yeniden boyutlandırma seçeneklerini sunmamaktadır. Ancak, blok düzenleyici, farklı blokların yüksekliğini ve genişliğini yeniden boyutlandırmak için birçok yol sunar.

WordPress'teki Resim bloğu ile başlayalım.

Öncelikle, blok üzerindeki araç çubuğunda bulunan ‘Hizala’ düğmesine tıklayarak Resim bloğunun hizalamasını değiştirebilirsiniz.

Burada, 'Geniş Genişlik' seçeneğini seçmek, bloğu kapsayıcı ile aynı genişlikte yapacaktır. Veya 'Tam Genişlik' hizalama seçeneği, bloğu sayfanın tamamının genişliğinde yapacaktır.

Sağdaki ‘Blok Ayarları’ paneline gidip ‘Ayarlar’ bölümüne doğru kaydırarak da bir bloğu yeniden boyutlandırabilirsiniz. Buradan, ‘Görüntü Boyutu’ açılır menüsünden bir bloğu yeniden boyutlandırabilirsiniz.

‘Görüntü boyutları’ bölümündeki ‘Genişlik’ ve ‘Yükseklik’ kutularına tercih edilen piksel boyutunu yazarak bloğun genişliğini ve yüksekliğini de ayarlayabilirsiniz.

Bunun altında, bloğun boyutunu yüzde olarak da ayarlayabilirsiniz.

Bir Resim bloğunu yeniden boyutlandırmanın başka bir yolu, üzerine tıklamaktır; bu, dairesel tutamaçlarla mavi bir kenarlık getirir.

Ardından, görüntü bloğunun yüksekliğini ve genişliğini değiştirmek için bu çapaları sürüklemeniz yeterlidir.

İşiniz bittiğinde, ayarlarınızı kaydetmek için ‘Güncelle’ veya ‘Yayınla’ düğmesine tıklayın.

Yöntem 2: Sütun Bloğunu Kullanarak Blok Genişliğini Değiştirme

Yeniden boyutlandırmak istediğiniz blokta, Paragraf bloğu gibi yerleşik boyut denetimleri yoksa, bu yöntem tam size göre. Kontrol edebileceğiniz bir kapsayıcının içine bloğunuzu yerleştirerek bir geçici çözüm görevi görür.

Bu yöntem için bloğumuzu Sütunlar bloğunun içine yerleştireceğiz. Her sütuna farklı bloklar ekleyebileceğiniz bir kapsayıcıdır. Ardından, sütunların yüksekliğini ve genişliğini ayarlayarak bu blokları yeniden boyutlandırabilirsiniz.

İlk olarak, ekranın sol üst köşesindeki 'Blok Ekle' (+) düğmesine tıklayın.

Buradan, Gutenberg düzenleyicisine Sütunlar bloğunu bulun ve ekleyin. Ardından, bir varyasyon seçmeniz istenecektir.

Bundan sonra, sütun düzeni ekranda görüntülenecektir ve artık bir sütun içindeki 'Blok Ekle (+)' düğmesine tıklayarak istediğiniz bloğu ekleyebilirsiniz.

Blok eklendikten sonra, genişliğini bulunduğu sütunu ayarlayarak kontrol edebilirsiniz.

Sadece sütunu seçin ve sağdaki blok ayarları panelinde, ‘Ayarlar’ bölümünde sütunun genişliğini değiştirebilirsiniz. Bu da içindeki bloğun yeniden boyutlandırılmasına neden olacaktır.

İşiniz bittiğinde, değişikliklerinizi kaydetmek için 'Yayınla' düğmesine tıklamanız yeterlidir.

İki sütunlu bir blok içindeki iki paragraf bloğunu yeniden boyutlandırdıktan ve hizaladıktan sonra demo web sitemizde içeriğin görünümü bu şekildeydi.

Yöntem 3: Grup Bloğunu Kullanarak Blok Yüksekliğini ve Genişliğini Değiştirme

Grup bloğunu kullanarak blokların genişliğini ve yüksekliğini de ayarlayabilirsiniz. İstediğiniz blokları gruplandırmanıza ve birlikte stil vermenize olanak tanır.

İlk olarak, üstteki 'Blok Ekle' (+) düğmesine tıklamanız gerekir. Ardından, Grup bloğunu bulun ve içerik düzenleyiciye ekleyin.

Bunu yaptıktan sonra, Grup bloğu üç farklı düzen seçeneği gösterecektir. Bu eğitim için 'Grup' düzenini kullanacağız.

Bundan sonra, ekrandaki ‘Blok Ekle’ düğmesi görüntülenecektir. Artık istediğiniz herhangi bir bloğu ekleyebilirsiniz.

Bu eğitimde, bir Başlık bloğu, bir Paragraf bloğu ve bir Resim bloğu ekleyip yeniden boyutlandıracağız.

Gruba birden fazla blok eklemek için, blok araç çubuğundan 'Grubu Seç' düğmesine tıklayın.

Grup seçildikten sonra, alttaki ‘Blok Ekle’ (+) düğmesine tıklamanız yeterlidir.

Bunu yaptıktan sonra, sağdaki blok ayarları kenar çubuğu açılacaktır. Buradan, tüm blokların düzenini, hizalamasını ve yönünü kolayca ayarlayabilirsiniz.

Düzeni değiştirmek, farklı blok boyutlarını da değiştirecektir. Sonuçtan memnun kalana kadar bu ayarları yapılandırabilirsiniz.

İşiniz bittiğinde, ayarlarınızı kaydetmek için ‘Güncelle’ veya ‘Yayınla’ düğmesine tıklayın.

Grup bloğu demo sitemizde böyle görünüyordu.

Yöntem 4: Kapak Bloğunu Kullanarak Blok Yüksekliğini Değiştirme

Bu yeniden boyutlandırma yöntemi, Kapak bloğunu kullanmak ve bir bölüm için belirli bir minimum yükseklik ayarlamak istiyorsanız sizin içindir. Üzerinde metin ve diğer içeriklerin bulunduğu tam genişlikte banner'lar veya öne çıkan görseller oluşturmak için idealdir.

İlk olarak, üstteki 'Blok Ekle' (+) düğmesine tıklayın ve Kapak bloğunu bulun.

Bunu yaptıktan sonra, WordPress medya kütüphanesinden bir renk seçmeniz veya bir resim yüklemeniz istenecektir. Bu resim veya renk, Kapak bloğunun arka planı olarak kullanılacaktır.

Ardından, istediğiniz herhangi bir bloğu Kapak bloğuna sürükleyip bırakmanız yeterlidir.

Bundan sonra, blok ayarlarını sağ sütunda açmak için Kapak bloğuna tıklamanız gerekir.

Buradan, 'Boyutlar' paneline aşağı kaydırın; burada Kapak bloğunun yüksekliğini pikseller kullanarak ayarlayabilirsiniz.

Son olarak, ayarlarınızı kaydetmek için 'Değişiklikleri Kaydet' düğmesine tıklamayı unutmayın.

Kapak bloğunu nasıl kullanacağınıza dair daha ayrıntılı talimatlar için, WordPress blok düzenleyicisinde Kapak Resmi ve Öne Çıkan Resim hakkındaki başlangıç kılavuzumuza bakmak isteyebilirsiniz.

Bonus: SeedProd'da Gelişmiş Blokları Kullanarak Güzel Sayfalar Oluşturun

SeedProd eklentisini kullanarak kolayca güzel ve estetik açıdan hoş sayfalar oluşturabilirsiniz.

Özelleştirilmesi ve ihtiyaçlarınıza göre yeniden boyutlandırılması çok kolay olan blokları kullanarak açılış sayfaları oluşturmanıza olanak tanıyan, piyasadaki en iyi WordPress sayfa oluşturucusudur.

İş ortağı markalarımızdan birkaçı bu aracı tüm web sitelerini tasarlamak için kullandı ve kullanıcıları taze, modern görünümden çok memnun kaldı. Daha fazla bilgi edinmek için SeedProd incelememize bakın.

Öncelikle, SeedProd eklentisini yüklemeniz ve etkinleştirmeniz gerekecektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair kılavuzumuzu okuyabilirsiniz.

Etkinleştirdikten sonra, WordPress kontrol panelinizden SeedProd » Ayarlar sayfasına gitmeli ve ‘Lisans Anahtarı’ kutusuna lisans anahtarını girmelisiniz.

Lisans anahtarını SeedProd web sitesindeki hesap sayfanızda bulabilirsiniz.

Ardından, bir açılış sayfası oluşturmaya başlamak için yönetici kenar çubuğundan SeedProd » Açılış Sayfaları ekranını ziyaret edin.

Buradan, 'Yeni Açılış Sayfası Ekle' düğmesine tıklamanız yeterlidir.

Şimdi 'Yeni Sayfa Şablonu Seçin' ekranına yönlendirileceksiniz. SeedProd, seçebileceğiniz birçok hazır şablon sunar.

Bir şablon seçtikten sonra, açılış sayfanız için bir ad ve URL sağlamanız istenecektir.

Bu ayrıntıları ekledikten sonra devam etmek için ‘Kaydet ve Sayfayı Düzenlemeye Başla’ düğmesine tıklamanız yeterlidir.

Bu, SeedProd'un sürükle ve bırak sayfa oluşturucusunu başlatacaktır; burada artık sayfanızı düzenlemeye başlayabilirsiniz. Ayrıntılı talimatlar için, WordPress ile bir açılış sayfası oluşturma kılavuzumuza bakın.

Bu eğitim için bir Görüntü bloğu ve bir Düğme bloğu ekleyip yeniden boyutlandıracağız.

İlk olarak, Resim bloğunu soldaki blok panelinden sürükleyip sayfanın istediğiniz yerine bırakmanız gerekecektir.

Ardından, sol sütundaki blok ayarlarına erişmek için Resim bloğuna tıklayın. Buradan medya kitaplığınızdan bir resim yükleyebilirsiniz.

Ardından, bloğun yüksekliğini ve genişliğini piksel veya yüzdeler kullanarak değiştirebilirsiniz.

Ayarlar panelinin üst kısmındaki ‘Gelişmiş’ sekmesine geçerek görüntü boyutunu ve konumunu da ayarlayabilirsiniz.

Ardından, ayarlarını genişletmek için yalnızca Boşluk paneline tıklayın.

Burada, bloğun kenar boşluğunu ve dolgusunu ihtiyaçlarınıza göre ayarlamak için değerler eklemeniz yeterlidir.

Bloğun üst, alt, sol ve sağ alanları için kenar boşluğunu ve dolguyu ayarlayabilirsiniz.

Seedprod ile, aralarına biraz boşluk koymak için iki farklı blok arasına bir Ayırıcı bloğu ekleyebilirsiniz.

İlk olarak, sol sütundan 'Boşluk' bloğunu bulup eklemeniz gerekecektir. Ardından, ayarlarını açmak için üzerine tıklayın.

Şimdi, 'Yükseklik' kaydırıcısını kullanarak boşluk bloğunun yüksekliğini kontrol edebilirsiniz.

Boşluk bloğu, karmaşadan uzak bir web sitesi oluşturmanıza yardımcı olabilir.

Video, Başlık ve Düğme blokları dahil olmak üzere diğer blokların genişliğini ve yüksekliğini de aynı şekilde değiştirebilirsiniz.

Düğme bloğunu sol sütunda bulun ve sayfanıza sürükleyin.

Ardından, blok ayarlarını açmak için Düğme'ye tıklamanız gerekecektir.

Buradan, üst kısımdaki 'Gelişmiş' sekmesine geçin. 'Dikey Dolgu' kaydırıcısını sürükleyerek bloğun yüksekliğini değiştirebilirsiniz.

Genişliği değiştirmek için sol sütundaki ‘Yatay Dolgu’ kaydırıcısını sürükleyin.

İşiniz bittiğinde, ‘Kaydet’ düğmesine tıklamayı unutmayın.

Umarım bu makale, WordPress'te blok genişliğini ve yüksekliğini nasıl değiştireceğinizi öğrenmenize yardımcı olmuştur. Ayrıca, WordPress blok düzenleyicisinde resim ekleme ve hizalama ve en iyi Gutenberg uyumlu WordPress temaları hakkındaki makalelerimize de göz atmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.