Divi Eklentisi Vurgulama – Bölüm Stil Yöneticisi Pro


Web'de birçok harika Divi tasarımı var. En iyi Divi temalarının çoğunu öne çıkaran şeylerden biri de bölüm bölümleridir. Bölüm bölümleri, web sitenize biraz görsel parıltı eklemenin harika bir yoludur. Bunları eklemenin en iyi yolu CSS stilidir, ancak bunları Divi web sitenize eklemek için CSS bilmeniz gerekmez. Section Style Manager Pro adlı bir eklenti kullanabilirsiniz.

Bölüm stili, bölümleri birbirinden ayıran benzersiz yollar ekler. Standart bölümler düzdür. Stil, benzersiz açılar, kutular, daireler, üçgenler ve daha fazlasını oluşturabilir. Bir açı kadar basit bir şey bile web sitenizin öne çıkmasını ve daha ilginç görünmesini sağlayabilir. Bu eklenti genel bakışında, Section Style Manager Pro'da bulunan stillere bir göz atacağız ve kullanımının ne kadar kolay olduğunu göreceğiz.

Bölüm Stil Yöneticisi Pro şuradan edinilebilir: Bolt Temaları

Divi Modül Düzenleyicisi'nden ve CodDrops'taki ayırıcı seçiminden ilham alan eklenti, Divi web sitenizin bölümleri için 28 benzersiz ayırıcı oluşturmak üzere CSS stili eklemenin kolay bir yolunu sunar.

Eklenti, uygun CSS Sınıfını kullanarak bölümlere atayabileceğiniz CSS sınıfları ekler. CSS'yi veya sınıfların ne olduğunu bilmek zorunda değilsiniz. Ekranda size verdiği görsellerden istediğiniz stili seçmeniz yeterli. Nasıl yapacağınızı bilmeniz gereken tek şey bir alana yapıştırmaktır.

Bölüm stilleri şunları içerir:

  • 3 üçgen
  • 3 köşegen
  • 3 yarım daire
  • 2 yuvarlak bölünmüş
  • 3 açı
  • 2 kaydırıcı

Gelişmiş şunları içerir:

  • kutular
  • Kaleler
  • noktalar
  • Çift çizgiler
  • katlanmış köşe
  • Incizigzag
  • Çoklu üçgenler
  • Yuvarlak kenarlar
  • Yarık
  • Şeffaf büyük üçgen
  • Şeffaf küçük üçgen
  • zikzak

Pano Menüsü

Eklentiyi yükledikten sonra, Bölüm Stilleri adlı pano menüsüne yeni bir bağlantı eklenir. Bu, mevcut stilleri ve bunları kullanma talimatlarını görebileceğiniz menü ekranını açar.

Stilleri Kullanma

İlk olarak, panodaki eklenti sayfasında kullanmak istediğiniz stile tıklayın. Bu stil için CSS sınıfı otomatik olarak panonuza kopyalanacaktır.

Ardından, stile sahip olmak istediğiniz bölüme gidin. Bölümün ayarlarına gidin, Özel CSS'yi seçin ve CSS Sınıfı adlı alana yapıştırın.

Son olarak Kaydet ve Çık'a tıklayın ve sayfayı güncelleyin. Stil şimdi o bölüme eklendi.

Normal Bölüm Stillerinin Örnekleri

Örnekler oluşturmak için Divi Kütüphanesinden Ana Sayfa Temel düzenini kullanarak bir test sayfası yaptım. İkinci bölüm, metin içeren tam genişlikte bir başlıktır. Bu, stilleri ekleyeceğim bölümdür. Bu bölümün öne çıkmasına yardımcı olmak için yukarıdaki ve aşağıdaki bölümleri mavi renkle biçimlendirdim.

Şimdi birkaç örneğe bakalım.

Üçgen Bölümler Üst

İşte bir Üçgen Bölüm. Bu, üçgeni en üste yerleştirir. Ayrıca altta veya hem üstte hem de altta mevcuttur.

Diyagonal Bölümler Her ikisi de

Çapraz Bölüm, üstte, altta veya her ikisinde de çapraz bir eğim ekler. Bu ikisini de kullanır.

Yarım Daire Bölümler Alt

Bu, üstte, altta veya her ikisinde de yarım daire yerleştirir. Bu yer en altta.

Yuvarlak Bölünmüş Bölümler Kavisli Üst

Bu, üst kısmı kavisli Yuvarlak Bölme stilidir. Ayrıca kavisli bir alt için bir seçeneği vardır.

Açı Her ikisi de

Açı stili, bölümün soluna, sağına veya her ikisine de bir açı yerleştirir. Bu ikisini de kullanır.

Kaydırıcılar Tam Ekran

Bu stil, tam ekran kaydırıcılarla çalışır ve tam ekranı veya ekranın yarısını yatay olarak almak için kolayca kaydırıcı yapmanıza olanak tanır. Bu, tam ekran bir kaydırıcıdır.

Bölümde başka bir şey varsa, o modül tam veya yarım ekran olarak görünmeyecektir. Yukarıdaki resimde orijinal satır ve kaydırıcı aynı bölümdedir. Kaydırıcının arka planını ayrı duracak şekilde şekillendirdim.

Arka Planı Şekillendirme

Arka planı biçimlendirmek için bölümde bir arka plan rengi seçmeniz yeterlidir. Stiller, arka plan rengi stiliyle otomatik olarak eşleşir.

Bu, hem üst hem de alt için üçgen kullanır.

Bu, altta çapraz bir bölüm kullanır.

Görselleri Kullanma

Yalnızca renkli arka planlarla çalışması amaçlanmış olsa da, görüntülerle biraz çalışır, ancak beklenenden farklı tepki verir. Deneme yanılma yöntemini kullanarak bazı ilginç etkiler elde edebilirsiniz. Paralaks stili kapatır. Adil olmak gerekirse, onu resimlerle kullanmam onların amacı değildi, bu yüzden bu eklenti için bir olumsuzluk değil, ama denemem gerekti ve denemeye değer olduğunu düşünüyorum. Denemeye karar verirseniz, resimlerinizi birkaç tarayıcıda test etmenizi öneririm.

Gelişmiş Bölüm Stilleri

Gelişmiş Bölüm Stilleri, ekstra bir kişiselleştirme düzeyi ekler – daha karmaşık desenlere sahiptirler ve Tema Özelleştirici kullanılarak özelleştirilebilirler .


SSM Gelişmiş Tema Özelleştirici

Tema Özelleştirici'ye SSM Gelişmiş adlı yeni bir sekme eklenir ve Gelişmiş Bölüm Stillerinin her biri için bir sekme içerir. Burada stillerin her biri için renkleri bağımsız olarak ayarlayabilirsiniz. Bunlar genel özelleştirmelerdir, yani bu ayarlamalar, stilin kullanıldığı her yerde görünecektir.

kutular

Kutular, bir kale duvarı efekti oluşturmak için harika olan iki renk için ayarlamalar sağlar. Yukarıdaki örnekte, iki bölümü birbirine bağlamak için mevcut bölümdeki ve altındaki bölümdeki renkleri kullandım.

noktalar

Önce ve sonra noktaları bir renk ve orta noktayı başka bir renkle şekillendirebilirsiniz.

Çift Hat

Çift Çizgiler bağımsız olarak şekillendirilebilir. Burada, bölümün arka plan rengiyle uyumlu olması için iki çeşit kırmızı kullandım.

Katlanmış Köşe

İşte Katlanmış Köşeye bir bakış. Bunu şekillendirmeyi zor buldum çünkü gerçekten sadece köşeyi bölüme uyacak şekilde şekillendirirseniz işe yarıyor. Biraz öne çıkması için köşenin üst kısmını bölümün renginden biraz daha koyu yaptım. Köşenin arka tarafı çok daha koyu ve bölümün altındaki alan tamamen farklı bir renk. Okuyucunun gözünün kırmızıyı bölümün altında olduğu gibi algılamasına yardımcı olmak için, o bölümde başka bir şeyi, içinden bakıyormuş gibi görünecek şekilde biçimlendirebilirim.

Incizigzag

Inczigzag bazı ilginç efektler yapar. Alt arka plan rengini önceki ve sonraki bölümün arka plan renkleriyle eşleştirerek bu bölümün üst üste binmesini sağladım.

Çoklu Üçgen

İşte Çoklu Üçgen'e bir bakış. Öne çıkması için koyu kırmızı bir arka plan rengi ekledim.

Yarık

İşte Slit'e bir bakış. Bölümün üst kısmına geniş bir bant yerleştirir ve iki renk için stile sahiptir. Ana arka planı bölümle ve ikinci arka planı ana rengin daha koyu bir versiyonuyla eşleştirdim.

Şeffaf Büyük Üçgen

Bu Şeffaf Büyük Üçgen. Stil vermek için, ilginç bir aşağı ok tasarımı oluşturmak için altındaki bölümle aynı rengi kullandım.

Bu bölümde bölüme koyu mavi bir arka plan ekledim ve şeffaf arka plan rengi için biraz daha açık mavi kullandım.

Şeffaf Küçük Üçgen

İşte aynı rengin iki varyasyonu ile şekillendirilmiş Şeffaf Küçük Üçgen.

Ön Uç Oluşturucu

Eklenti, bölümlerinize önceden hazırlanmış CSS sınıfları eklemenin kolay bir yolunu sunduğundan, aslında ön uç oluşturucu tarafından çakışacak veya kısıtlanacak herhangi bir kodu yoktur. Yine de herhangi bir bölüm gibi ön uç oluşturucuyu kullanarak bölüm stilinizi ayarlayabilirsiniz.

CSS stilinin Tema Özelleştirici'den yapılması gerekecek, ancak hepsi ön uçtan ayarlanabilir. Beklendiği gibi, CSS Sınıfını ön uçtan uygun alana yapıştırabilirsiniz. Ön uç oluşturucuyu kullanmayı tercih ederseniz, Section Style Manager Pro'yu kullanırken herhangi bir sorun yaşamayacaksınız.

Ekstra ile kullanma

Extra'daki sayfalar ve gönderilerle iyi çalışır. Kategori oluşturucu bana biçimlendirme ile ilgili bazı sorunlar verdi. Tasarımınız için en iyi olanı görmek için farklı stiller denemenizi öneririm.

Lisans, Belgeler, Güncellemeler ve Destek

Section Style Manager Pro, siz ve müşterileriniz için sınırsız web sitesinde kullanılabilir.

Eklenti, ücretsiz ömür boyu güncellemeler içerir. Güncellemeler otomatik olarak yapılır ve eklentiler listesinde güncellemeleri kontrol edebileceğiniz eklentiye bir bağlantı eklenir.

Belgeler panodaki sayfada sağlanır ve CSS Sınıfının nasıl kopyalanıp nereye yapıştırılacağını ve tema özelleştirici kullanılarak gelişmiş stillerin nasıl stillendirileceğini kapsar. Eklentinin satış sayfasında, her iki stil türünü de kullanmanıza yardımcı olacak iki video eğitimi vardır.

Ömür boyu destek e-posta yoluyla sağlanır. Ayrıca satış öncesi sorularınızı onlara e-posta ile gönderebilirsiniz.

Son düşünceler

Section Style Manager Pro, web sitenize 28 bölüm bölme stili eklemenin kolay bir yolunu sunar. CSS sınıfını istediğiniz bölüme yapıştırmanız gerekecek, ancak pano ekranında istediğiniz sınıfa tıklayarak birden fazla stil arasından seçim yapabilmek CSS stil sürecini basitleştiriyor. Programlamaya gerek yok… sadece tıklayın ve yapıştırın.

Stilleri tek bir sayfada istediğiniz kadar bölümde kullanabilirsiniz, ancak bölüm başına yalnızca bir stil kullanmanızı öneririm. İki stil kullanmak, bunların çakışmasına neden olabilir. Eklenti hafiftir, bu nedenle web sitenizde fazladan bir zorlama olmaz.

Tüm stiller bölümün arka plan rengini kullanır ve mükemmel uyum sağlar. Gelişmiş stiller, Tema Özelleştirici kullanılarak ayrı ayrı renklendirilebilen birden çok katman sağlar. Web sitenizin renk paletini veya kendi markalı renklerinizi eşleştirmek kolaydır.

Bolt Temalarından edinilebilir (burada bulunur: Divi Section Style Manager Pro). Sadece temel stilleri ve iki kaydırıcı stilini istiyorsanız, ücretsiz lite sürümünü deneyebilirsiniz (burada bulunan: Divi Section Style Manager Lite).

Section Style Manager Pro'yu denediniz mi? Aşağıdaki yorumlarda bunun hakkında ne düşündüğünüzü bize bildirin!

Öne Çıkan Görsel: Lesia_G / Shutterstock.com

Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

Divi's Theme Builder ile Özel Global Başlık Nasıl Oluşturulur

Artık Tema Oluşturucu burada olduğuna göre, web sitenizi A'dan Z'ye kurmanıza yardımcı olacak yeni eğitimlere dalmak için sabırsızlanıyoruz. Buna Divi'nin yerleşik seçeneğini kullanarak özel başlıklar oluşturma da dahildir. Bu eğitimde Divi's Theme Builder'ı kullanarak global bir başlık oluşturmaya odaklanacağız. Bu sayfaya veya gönderiye farklı bir başlık atamadıysanız, web sitenizin her yerinde genel bir başlık görünecektir.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir