Divi Toolbox bir eklentidir Divi'ye normalde CSS, JavaScript, PHP veya birçok ayrı eklenti gerektiren birçok yeni efekt ekler. Efektlerin kullanımı kolaydır, özelleştirilebilir ve size özel efektler verilebilir. Site Web Kalabalığın arasından sıyrılmak için ekstra ışıltıyı verin.

Etkiler arasında site genelinde değişiklikler, yeni mobil menüler, parçacık arka planları, alt bilgiler, widget'lar, stiller, animasyonlar, başlıklar, gezinme, yeni blog düzenleri, Yeni konumlarda Divi sunumları, giriş ekranının özelleştirilmesi, pop-up'lar vb. Tema özelleştiriciye yapılan yeni eklemelerle birçok özellik özelleştirilebilir. Divi Toolbox, Extra veya Divi Builder eklentisiyle çalışmaz.

Divi Araç Kutusu'nun genel ayarları

divi araç kutusu settings.png

Divi Araç Kutusu seçenek ekranı, Divi gösterge tablosu menüsüne eklenir. Burada ayarlar etkinleştirilir, ancak özelleştiricide ayarlamalar yapılır.

Ayarlar genel genel üstbilgi stili, özel giriş sayfası, projeleri gizleme, SVG dosya türlerini yükleme izni, özel tarayıcı kaydırma çubuğu, 404 sayfa ayarları (düzeni seçin ve gizleyin üstbilgi ve altbilgi) ve sosyal simgeler (stili etkinleştir, dosyayı aç). yeni sekme ve daha fazla simge ekleyin).

divi araç kutusu genel parametreler.png

Sosyal simgeler eklemek, 9 ek sosyal ağın URL'sini girebileceğiniz bir alan açar.

sosyal ağ ekle divi.png

İşte sekme genel etkinleştirdiğim ayarları değiştirebileceğim özelleştirici. Ayarlar, başlıklar ve yazı tipleri, tarayıcı kaydırma çubuğu ve oturum açma ekranını içerir. Bu örnekte, h1 metninde ve gövdesinde bazı ayarlamalar yaptım ve kaydırma çubuğuna stil ekledim. Ayrıca daha fazla sosyal simge ekledim.

divi araç kutusu özelleştirme settings.png

Giriş ekranı için değişikliklerinizi yapmanız ve ardından ekranı başka bir tarayıcıda kapatmanız veya görüntülemeniz gerekir.

özel giriş ekranı divi.png

İşte bir arka plan resmi, logo ekledikten ve alanların ve metnin boyutunu ve rengini değiştirdikten sonra giriş ekranım. Değişikliklerinizi yaparken ekranı göremediğiniz için biraz ince ayar yapmanız gerekir.

Divi Toolbox başlık ayarları

başlık ayarları divi.png

Ayarlar Başlık menüye bir stil ekleyin, özel bir açılır menüyü etkinleştirin, bir CTA menü düğmesi ekleyin, docker üzerindeki logoyu değiştirin, bindirme logosunu etkinleştirin ve ana sayfaya göz atmadan önce bir Divi düzeni ekleyin. 'öncesi ve sonrası biçimlendirme. diğer sayfalara göz atmak.

araç çubuğu konfigürasyonu divi.png

CTA menü düğmesi, CTA'yı ilk veya son menü öğesine uygulamanıza veya özel bir sınıf uygulamanıza olanak tanır. CSS'yi ve nereye ekleneceğine dair talimatları sağlar.

divi.png başlık özelleştiricisi

İşte başlık için özelleştirici. Menünün üstüne bir düzen ekledim (bu örnekte bu sadece bir metin modülü, ancak isterseniz tam bir düzen ekleyebilirsiniz). Örtüşen logonun gölge efektli kare bir kutusu vardır. Logo boyutunu 200'den 140'a değiştirdim ve sosyal simgeleri ana menüye taşıdım. CSS efektini görebilmeniz için Hizmetler menü öğesinin üzerine geliyorum.

Divi Araç Kutusundaki Altbilgi Ayarları

altbilgi ayarları divi.png

Altbilgi ayarları arasında yapışkan altbilgi, altbilgi gösterme, menüleri ve widget'leri özelleştirme, Başa Dön düğmesini özelleştirme (özel bir düğme bağlantısı seçeneği ekler) ve düzenlerden önce ve sonra ekleme altbilgi.

altbilgi divi.png özelleştirmek

Bu örnekte, başlık ve menü yazı tiplerini büyük harfe değiştirdim ve aralığı artırdım. Ayrıca vurgulu renkleri de ayarladım ve vurgulu metnin yanına bir simge ekledim. Düzenden sonra bir düzen ekledim. Bu, açıklanmış bir altbilgi kullanır (bu nedenle metin yukarıdaki metin modülünün arkasındadır).

Metni göstermek için sayfanın üst kısmındaki düğmeyi biçimlendirdim. Bir gölge efekti var ve yerini ayarladım. Varsayılan renkleri bıraktım. Alt metni ve sosyal simgeleri ortaladım. Fareyle üzerine gelme efekti için Büyümeyi seçtim (küçültme, yukarı, aşağı hareket, yalpalama, kalp atışı, jöle ve nabzı da içerir).

Divi Araç Kutusu Mobil Ayarları

mobile.png için araç kutusu ayarları

Ayarlar seyyar mobil menü kesme noktasını (menü masaüstünden mobil cihaza değiştiğinde ekranın tam genişliği) girmek için bir alan ekleyin, özel stiller, logoyu düzenleyin, hamburger simgesi tıklama efektini seçin , iç içe geçmiş alt menüyü daraltın ve etkinleştirin. birkaç CSS sınıfı. CSS sınıfları, sütunları tersine çevirmenize ve metni, modülleri ve düğmeleri ortalamanıza olanak tanır.

Divi-Toolbox-Mobile-Ayarlar-mobile.png için

İşte sayfanın bir önizlemesi Google Duyarlı seçili Chrome. Ekran boyutunu 980 pikselin altına çektiğimde seçtiğim mobil ikona dönüştü ve hamburger menüsünü seçtiğim animasyonla ekledi.

mobil menü animation.png

Bu ekranda arka plan rengini, vurgulu arka plan rengini ve mobil menü hamburger menüsünü şekillendiriyorum. Ana menü öğelerinin metnini büyük harfe değiştirdim ve CTA metin standardını bıraktım. Ayrıca CTA menü öğesinin arka planını da değiştirdim. Ayrıca menü ve simge boyutunu da ayarlayabilirsiniz.

Blog Ayarları Divi Araç Kutusu

blog ayarları divi toolbox.png

Parametreleri blog kenar çubuğunu ve widget'ları özelleştirmenize, meta, arşiv ve kategori sayfalarını göndermenize, bir düzen seçmenize (6 seçenekten), arşiv kenar çubuğunu gizlemenize ve düğme metnini özelleştirmenize olanak sağlar Daha fazla oku.

Tek gönderiler için kenar çubuğu düzenini seçebilir, gönderi başlığını gizleyebilir, yazar kutusu ekleyebilir, önceki ve sonraki bağlantıları ekleyebilir, ilgili gönderileri ekleyebilir ve formulaire yorum sayısı Ayrıca tek gönderilere, arşivlere, kategorilere, yazar sayfalarına ve arama sonuçları sayfalarına özel gezinme sonrası düzenleri ekleyebilirsiniz.

divi.png blog görünümünü özelleştir

Blog sayfası için kenar çubuğuna bir gölge efekti ekledim, yazı tiplerini ve stillerini değiştirdim, arama kutusuna stil uyguladım ve kenarlığın boyutunu artırdım. Alternatif bir düzen kullanıyor ve daha fazlasını oku düğmesi için metni özelleştirdim.

sonuç özelleştirme arayüzü blog divi.png

Bu örnek layout 6'dır. Meta bölümü için yazı tipi renklerini yeniden özelleştirdim ve üzerine gelme rengi ekledim. Ayrıca Daha Fazla Bilgi düğmesinin arka planını da özelleştirdim.

blog içeriğinin yazı tipini değiştir divi.png

Ayrı blog gönderileri, blog ayarlarına eklediğiniz öğelerin her birini özelleştirmenize olanak tanır. Bu ekranda, ilgili makaleleri, sonraki ve önceki bağlantıları ve ayrıca yazar alanını özelleştiriyorum. Tüm metni, renkleri, gölgeleri vb. Kontrol edersiniz.

özelleştirme bölümü yorumu divi.png

Bu örnekte, özelleştiriyorum formulaire yorum sayısı Alan renklerini (odak ve odak dışı), kenarlığı, metni, renkleri, düğmeyi vb. kontrol edersiniz. Düğmenin arka plan rengini, alanın odak rengini değiştirdim, alana kenarlık ekledim ve yarıçapı değiştirdim.

Divi Araç Kutusu Lisansı

İki arasında seçim yapma şansın var lisansları :

  • Normal lisans (bir projede kullanılmak üzere) - 49,00 €
  • Genişletilmiş lisans (sınırsız projelerde kullanım için) - 169,00 €

Ne hatırlamak

Bu eklentideki özelliklerin ve ayarların miktarından etkilendim. Divi oluşturucu ile oluşturulmamış blog yazılarına benzer makaleler, önceki ve sonraki bağlantılar ve bir yazar alanı ekleyebilmesi özellikle hoşuma gidiyor. Kaydırma çubuğu da hoş bir dokunuş.

Divi modüllerinde başlık metni gibi birkaç ayara erişebilirsiniz, ancak bu ayarlar için daha fazla ayrıntı sağlar. Birkaç ince ayarın eklenmesini istiyorum (ör. Yorum alanı için gölge efektleri, daha fazla logo seçeneği, sosyal medya simge konumları vb.).

Divi'ye mümkün olan en kolay şekilde bir ton yeni efekt eklemek isterseniz, Divi Araç Kutusu sapmaya değer.