Divi ile Düzensiz Şekilli Bölüm Geçişleri Nasıl Oluşturulur

Web sitenizin tasarımını güçlendirmenin en iyi yollarından biri farklı bölüm geçişleri kullanmaktır. Önceki bir gönderide, yalnızca Divi'nin yerleşik seçeneklerini kullanarak bunu nasıl yapabileceğinizi gösterdik. Bununla birlikte, biraz daha gelişmiş veya kişiselleştirilmiş bir şey yaratmak istiyorsanız, düzensiz şekilli kesit geçişleri de oluşturabilirsiniz. Karmaşıklıkları nedeniyle buna yaklaşmanın en iyi yolu şeffaf kenarlıklı görüntüler kullanmaktır.

Bu yazıda, bunu nasıl yapabileceğinizi göstereceğiz. Size sadece Divi Builder'da ne yapacağınızı göstermekle kalmayacak, aynı zamanda Photoshop kullanarak birkaç adımda görüntüler üzerinde bu saydam kenarlıkları nasıl oluşturabileceğinizi de göstereceğiz.

Örnek Sonuç

Çarpıcı düzensiz şekilli kesit geçişlerine sahip bir yerleşim örneğine bakalım:

Fark edeceğiniz gibi bu şeffaf çerçeveleri sitenizin tamamında ve farklı bölümlerde kullanabilirsiniz. Saydam kenarlığınızın ne kadar büyük olduğuna bağlı olarak, paylaşmaya çalıştığınız farklı içeriğe sığacak kadar bölümler içinde yeterli alanınız olması gerektiğini unutmamak önemlidir. Ayrıca çeşitli bölümler arasında güzel bir denge oluşturacaktır.

Divi ile Düzensiz Şekilli Bölüm Geçişleri Nasıl Oluşturulur

Youtube Kanalımıza Abone Olun

Photoshop ile Şeffaf Kenarlıklar Oluşturun

Photoshop ile istediğiniz kadar orijinal şekiller elde edebilirsiniz. Ayrıca GimpShop adlı ücretsiz bir alternatifi de tercih edebilirsiniz. Bu eğitim için Photoshop kullanacağız.

Photoshop'u açın

Bilgisayarınızda photoshop'u açarak başlayın.

Resmi Aç

Bunu yaptıktan sonra üzerinde çalışmak istediğiniz resmi açın.

Görüntüye Çift Tıkla ve Katman Oluştur

Görüntünüz Photoshop'a yüklendikten sonra, görüntü katmanına çift tıklayın ve onun için yeni bir katman oluşturun (Katman 0).

Başka Bir Katman Ekle

Saydam kenarlığı eklemek için başka bir katmana da ihtiyacınız olacak, bu yüzden devam edin ve aşağıdaki yazdırma ekranında işaretlediğimiz simgeye tıklayarak ekleyin. Katmanı (Katman 1) oluşturduktan sonra, görüntünüzü içeren katmanın üzerine yerleştirildiğinden emin olun.

Fırça ve Boyut Seçin

Katman 1'i etkinleştirirken devam edin ve fırça simgesine tıklayın.

Bunu yaptıktan sonra, fırça için kullanılan boyutu ve deseni kendi tercihinize göre ayarlayabilirsiniz. İnternette tonlarca ücretsiz Photoshop fırçası var, bu yüzden ne tür bir web sitesi oluşturduğunuza bağlı olarak uygun bir tane seçin. Ayrıca, opaklığın %100 olarak ayarlandığından emin olun.

Kenarlarda Fırçayı Kullanmaya Başlayın

Fırçanızı yerleştirdikten sonra şeffaf olmasını istediğiniz tarafta kullanmaya başlayın. Tüm kenarlığı fırçanızla kapladığınızdan emin olun, böylece daha sonra hepsi şeffaf hale gelir.

CTRL (Windows) veya Command (Mac) + Yeni Katman Seç

Bittiğinde, klavyenizde CTRL (Windows için) veya Command (Mac için) tuşuna basabilir ve aynı anda Katman 1'i tıklayabilirsiniz. Photoshop'un bu katmana eklediğiniz her şeyi, yani bu durumda şekilli kenarlığı seçeceğini göreceksiniz.

Yeni Katmanı Görünmez Yap

Ardından, aşağıdaki yazdırma ekranında işaretlendiği gibi gözü kaldırarak Katman 1'i görünmez yapın.

Görüntü Seç ve Yeni Katmanı Sil

Ardından, resminizi içeren katmana tıklayın ve klavyenizdeki sil düğmesine basın. Bunu yaptığınızda, sınırın şeffaf hale geleceğini göreceksiniz.

Dikdörtgen Seçim Çerçevesi Aracını Seçin ve Resme Tıklayın

Dikdörtgen Seçim Çerçevesi Aracına tıklayın ve görüntünün üzerinde rastgele bir yere basın.

Resmi PNG Olarak Kaydet

Son olarak, web sitenizde kullanabilmeniz için görüntüyü PNG olarak kaydetmeniz gerekir.

Divi'ye Arka Plan Ekle

Divi web sitenizde kullanmak istediğiniz farklı görüntüleri oluşturduktan sonra (yukarıdaki Photoshop tekniğini kullanarak), geri kalanı basittir. Oluşturduğunuz resimler, belirli bir bölümün arka planı olarak hizmet eder. Aynı yöntem farklı bölümler için de geçerli olduğundan, yalnızca örneğimizin kahraman bölümünü nasıl oluşturacağınızı göstereceğiz.

Yeni Standart Bölüm Ekle

Yeni bir sayfa ekleyin, Visual Builder'a geçin ve o sayfaya yeni bir standart bölüm ekleyin.

Arka Plan Resmi Yükle

Kahraman bölümünde görünmesini istediğiniz tüm modülleri yerleştirdikten sonra, devam edip bu gönderinin önceki bölümünde oluşturduğunuz resmi ekleyebilirsiniz.

Arka Plan Rengi Ekle

Bunu yaptıktan sonra, resminizin şeffaf kısmında hangi rengin görüneceğine karar verebilirsiniz. Bu örnekte, arka plan rengi olarak '#dddddd' kullandık. Rengin görüntünün şeffaf kısmında görüneceğini hemen görebilirsiniz.

Yeterli Dolgu Olduğundan Emin Olun

Kahraman bölümünüzde kullandığınız modüllerin sayısına ve şeffaf kenarlığınızın boyutuna bağlı olarak, bazı özel dolgular eklemeniz gerekebilir. Farklı bölüm dolgu değerleriyle oynayın ve hangisinin size en iyi sonucu verdiğini görün.

Sonraki Bölüme Aynı Arka Plan Rengini Ekle

Farklı bölümlerin birbiriyle iyi uyum sağladığından emin olmak için, bir sonraki bölümde de kahraman bölümünüzde kullandığınız arka plan rengini kullanın. Bu, bir sonraki bölümünüz için tek renkli bir arka plan rengi kullanmanız gerektiği anlamına gelmez, her iki bölümün renkleri güzelce karıştığı sürece degrade bir arka plan kullanabilirsiniz.

Örnek

Daha önce de belirttiğimiz gibi, istediğiniz kadar resim kenarlığı oluşturabilir ve bunları web sitenizde yaratıcı bir şekilde kullanabilirsiniz. Size bir tat vermek için aşağıdaki örnek önizlemeyi oluşturduk:

Son düşünceler

Bu yazımızda size düzensiz şekilli kesit geçişlerinden nasıl kolayca faydalanabileceğinizi gösterdik. Bu yöntemi kullanarak temelde istediğiniz her türlü kesit geçişini oluşturabilirsiniz. Photoshop'ta birkaç adımda bu düzensiz şekilleri nasıl oluşturacağınızı göstermenin yanı sıra, Divi Builder'da nasıl çalıştırabileceğinizi de gösterdik. Herhangi bir sorunuz veya öneriniz varsa; Aşağıdaki yorum bölümünde bir yorum bıraktığınızdan emin olun!

Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!