Divi's Theme Builder ile Özel bir e-Ticaret Mega Menüsü Nasıl Oluşturulur

Divi ve WooCommerce kullanarak bir e-Ticaret web sitesi oluştururken, web sitenizin genel görünümünü ve verdiği hissi özelleştirmenin tonlarca yolu vardır. Divi'nin WooCommerce modülleri, Divi Tema Oluşturucu ile birlikte ürün sayfalarınız, kategori sayfalarınız ve daha fazlası için şablonlar oluşturmanıza olanak tanır. Ancak web sitenizin yapısının ve WooCommerce sayfalarının kullanıma hazır olduğundan emin olmanın yanı sıra, ziyaretçilerin sahip olacağı gezinme deneyimini düşünmek de önemlidir. E-Ticaret web siteniz için oluşturduğunuz menü, ziyaretçilerinizin web sitenizdeki satın alma davranışlarının tonunu belirler.

E-Ticaret web sitenizin tam potansiyeline ulaşmasına yardımcı olmak için size Divi's Theme Builder ile özel bir e-ticaret mega menüsünün nasıl oluşturulacağını göstereceğiz. Divi'nin yerleşik öğelerini kullanarak her şeyi görsel olarak oluşturacağız ve öğeleri bazı kodlarla birlikte açılır menüler olarak kullanacağız. Bu yaklaşımı kullanarak, oluşturduğunuz e-Ticaret web siteleri için her türlü e-ticaret mega menüsü oluşturabileceksiniz! JSON dosyasını da ücretsiz olarak indirebileceksiniz.

Hadi hadi bakalım.

Ön izleme

Eğiticiye dalmadan önce, farklı ekran boyutlarındaki sonuca hızlıca bir göz atalım.

masaüstü

Mobil

E-Ticaret Mega Menü Düzenini ÜCRETSİZ İndirin

Ücretsiz e-ticaret mega menü düzenine el koymak için önce aşağıdaki düğmeyi kullanarak indirmeniz gerekir. İndirmeye erişmek için aşağıdaki formu kullanarak Divi Daily e-posta listemize abone olmanız gerekir. Yeni bir abone olarak, her Pazartesi daha da fazla Divi iyiliği ve ücretsiz bir Divi Düzen paketi alacaksınız! Zaten listedeyseniz, aşağıya e-posta adresinizi girin ve indir'i tıklayın. "Yeniden abone olmayacaksınız" veya fazladan e-posta almayacaksınız.

Dosyaları İndirin

Ücretsiz İndir

Divi Bültenine katılın ve size nihai Divi Açılış Sayfası Düzen Paketinin bir kopyasını ve ayrıca tonlarca başka şaşırtıcı ve ücretsiz Divi kaynağı, ipucu ve püf noktası e-posta ile gönderelim. Takip edin ve kısa sürede bir Divi ustası olacaksınız. Zaten aboneyseniz, e-posta adresinizi aşağıya yazın ve düzen paketine erişmek için indir'i tıklayın.

İNDİRMEK

Başarıyla abone oldunuz. Aboneliğinizi onaylamak ve haftalık ücretsiz Divi düzen paketlerine erişmek için lütfen e-posta adresinizi kontrol edin!

JSON Dosyası Nasıl Yüklenir

Yukarıda indirebildiğiniz sıkıştırılmış klasörü açın. Ardından, WordPress web siteniz > Divi > Divi Kitaplığı'na gidin ve JSON'u yükleyin.

Düzeniniz Divi Kitaplığına kaydedildikten sonra Divi Tema Oluşturucu'ya gidebilir ve "Genel Başlık Ekle" veya "Özel Başlık Ekle" üzerine tıklayarak ve "Genel/Özel Başlık Oluştur" öğesini seçerek kaydedilen düzeni içe aktarabilirsiniz. Divi Kitaplığındaki "Kaydedilen Düzenleriniz" sekmesine gidin, önceki adımda yüklediğiniz düzeni seçin ve tüm Divi Tema Oluşturucu Değişikliklerini kaydedin.

Yarasadan hemen sonra işleyen bir menüye sahip olmak için, aşağıdaki bu öğreticinin ilk bölümünü gözden geçirmeniz gerekecek; menü öğelerine bireysel düzeyde CSS sınıfları ekleme. Ayrıca bu öğreticinin 5. bölümünde gösterildiği gibi Kod Modülü içindeki CSS sınıflarından birini etkinleştirmeniz gerekir. Simgeler düzgün görünmüyorsa, Kod Modülü içindeki simge içeriğini kontrol ettiğinizden emin olun. Simgeler, aşağıdaki yazdırma ekranında görebileceğiniz gibi “\4c” ve “\21” içeriğini içermelidir.

1. Menü Öğelerine CSS Sınıfları Ekleyin

Görünümdeki Menülere Git

Bu öğreticinin ilk bölümünde, bir açılır mega menü eklemek istediğimiz menü öğelerine iki farklı CSS sınıfı atayacağız. Bunu yapmak için WordPress kontrol panelinizin görünüm ayarlarındaki menülere gidin.

CSS Sınıfı Seçeneğini Etkinleştir

Ekran seçenekleri arasında geçiş yaparak ve CSS sınıfları seçeneğini etkinleştirerek en üstte CSS sınıfı seçeneğinin etkinleştirildiğinden emin olun.

Açılır Liste Gerektiren Menü Öğelerine Ardışık CSS Sınıfları Ekleme

Bir açılır mega menü atamak istediğiniz menü öğelerinin her biri iki CSS sınıfına ihtiyaç duyar. İlk olarak, "birinci düzey" olarak adlandırılan genel bir CSS sınıfı. İkinci CSS sınıfı, sonunda “birinci seviye-1”, “birinci seviye-2”, “birinci seviye-3” vb. ardışık bir sayı içerir.

• Açılır menüyü içeren ilk menü öğesi: birinci seviye birinci seviye-1
• Açılır menüyü içeren ikinci menü öğesi: birinci seviye birinci seviye-2
• Açılır menüyü içeren üçüncü menü öğesi: birinci seviye birinci seviye-3

2. Divi's Theme Builder ile Global Başlık Oluşturun

Divi Theme Builder'a gidin ve Global Header Oluşturmaya Başlayın

Menü öğeleriniz hazır olduğunda, Divi'ye geçme zamanı. Divi Tema Oluşturucumuza gidip “Global Başlık Ekle”ye tıklayarak yeni bir genel başlık oluşturacağız. Global başlığı sıfırdan oluşturacağız.

Bölüm #1 Ayarlar

aralık

Şablon düzenleyicinin içine girdikten sonra bir bölüm göreceksiniz. Bu bölümü açın ve tüm varsayılan üst ve alt dolguyu kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

görünürlük

Daha sonra bu bölümü tablet ve telefonda gizleyin. Bu bölümü yalnızca daha küçük ekran boyutlarında gezinme deneyiminin bunaltıcı hale gelmediğinden emin olmak için daha büyük ekran boyutlarında tutuyoruz.

1. Satır Ekle

Sütun Yapısı

Aşağıdaki sütun yapısını kullanarak yeni bir satır ekleyerek devam edin:

boyutlandırma

Henüz herhangi bir modül eklemeden satır ayarlarını açın ve boyutlandırma ayarlarını aşağıdaki gibi değiştirin:

• Özel Oluk Genişliğini Kullan: Evet
• Oluk Genişliği: 1
• Sütun Yüksekliklerini Eşitle: Evet
• Genişlik: %95
• Maksimum Genişlik: %100

aralık

Sonraki tüm varsayılan üst ve alt dolguyu kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

Sütun 1'e Görüntü Modülü Ekle

Logo Yükle

Sütun 1'deki Resim Modülü ile başlayarak modül ekleme zamanı. Logonuzu yükleyin.

aralık

Modülün tasarım sekmesine gidin ve biraz üst kenar boşluğu ekleyin.

• Üst Marj: %3

Sütun 2'ye Metin Modülü Ekle

İçerik Ekle

Bir sonraki sütuna. Seçtiğiniz bazı içeriğe sahip bir Metin Modülü ekleyin.

Metin Ayarları

Modülün tasarım sekmesine gidin ve metin ayarlarını aşağıdaki gibi değiştirin:

• Yazı Tipi: Oswald
• Metin Yazı Tipi Ağırlığı: Orta
• Metin Yazı Tipi Stili: Büyük Harf
• Metin Rengi: #000000
• Metin Boyutu: 19px

aralık

Biraz üst ve alt kenar boşluğu da ekleyin.

• Üst Marj: %5
• Alt Marj: %5

Metin Modülünü İki Kez Klonla ve Kopyaları Sütun 3 ve 4'e Yerleştir

Kopyayı Değiştir

2. sütundaki ilk Metin Modülünü tamamladıktan sonra, onu iki kez kopyalayabilir ve kopyaları 3. ve 4. sütuna yerleştirebilirsiniz. Her iki kopya modüldeki içeriği de değiştirdiğinizden emin olun.

2. Bölüm Ekle

aralık

Bir öncekinin hemen altına başka bir bölüm ekleyin. Bölüm ayarlarını açın ve tüm varsayılan üst ve alt dolguyu kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

2. Satır Ekle

Sütun Yapısı

Aşağıdaki sütun yapısını kullanarak yeni bir satır ekleyerek devam edin:

boyutlandırma

Henüz herhangi bir modül eklemeden satır ayarlarını açın ve boyutlandırma ayarlarını aşağıdaki gibi değiştirin:

• Özel Oluk Genişliğini Kullan: Evet
• Oluk Genişliği: 1
• Genişlik: %100
• Maksimum Genişlik: %100

aralık

Sonraki tüm varsayılan üst ve alt dolguyu kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

Sınır

Ardından, kenarlık ayarlarına gidin ve bir üst ve alt kenarlık uygulayın.

• Üst Kenar Genişliği:
  • Masaüstü: 2 piksel
  • Tablet ve Telefon: 0px
• Alt Kenar Genişliği: 2px
• Kenar Rengi: #ff6600

Sütuna Menü Modülü Ekle

Seçim Menüsü

Satırın sütununa bir Menü Modülü ekleyin ve istediğiniz bir menüyü seçin.

Tablet ve Telefona Logo Ekleme

Ardından, duyarlı seçenekleri etkinleştirerek ve logo resim dosyanızı yükleyerek tablete ve telefona bir logo ekleyin. Masaüstü alanını boş bırakın.

Elementler

Alışveriş sepetini ve arama simgelerini de etkinleştiriyoruz.

• Alışveriş Sepeti Simgesini Göster: Evet
• Arama Simgesini Göster: Evet

Menü Metin Ayarları

Tasarım sekmesine gidin ve menü metin ayarlarını aşağıdaki gibi değiştirin:

• Menü Yazı Tipi: Oswald
• Menü Yazı Tipi Stili: Büyük Harf
• Menü Metin Rengi: #000000
• Menü Metin Boyutu: 19px

Açılır Menü Metin Ayarları

Açılır menü satırı rengini de değiştiriyoruz.

• Açılır Menü Satır Rengi: #ffffff

Simge Ayarları

Simge ayarlarıyla birlikte.

• Alışveriş Sepeti Simge Rengi: #ff6600
• Arama Simgesi Rengi: #ff6600
• Hamburger Menü Simge Rengi: #ff6600

CSS Sınıfı

Bir CSS sınıfı ekleyerek modülün ayarlarını tamamlayın. Kodu eklediğimizde bu CSS sınıfını daha sonra öğreticide kullanacağız.

• CSS Sınıfı: kategori menüsü

3. Başlık Şablonu İçinde Açılır Satır Oluşturun

Yeni Bölüm Ekle (İlk Menü Öğesinin Açılır Listesine Adanmış)

boyutlandırma

Artık menümüzü hazırladığımıza göre, öğreticinin e-ticaret mega menü açılır menülerini oluşturmaya adanmış bir sonraki bölümüne geçmenin zamanı geldi. İlk açılır e-ticaret mega menüsünü oluşturmak için yeni bir bölüm ekleyeceğiz. Bölüm ayarlarını açın ve boyutlandırma ayarlarında genişlik ve maksimum genişliğin %100 olarak ayarlandığından emin olun.

• Genişlik: %100
• Maksimum Genişlik: %100

aralık

Sonraki tüm varsayılan üst ve alt dolguyu kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

CSS Sınıfı

Ardından, iki CSS sınıfı ekleyin. İkinci CSS sınıfının sonundaki sayı, bu öğreticinin ilk bölümünde ilk menü öğesi için kullanılan sayı ile aynıdır.

• CSS Sınıfı: açılır menü açılır menü-1

Bölüme Yeni Satır Ekle

Sütun Yapısı

Aşağıdaki sütun yapısını kullanarak bölüme yeni bir satır ekleyerek devam edin:

Arka plan rengi

Henüz herhangi bir modül eklemeden satır ayarlarını açın ve beyaz bir arka plan rengi ekleyin.

• Arka Plan Rengi: #ffffff

boyutlandırma

Satırın tasarım sekmesine gidin ve boyutlandırma ayarlarını aşağıdaki gibi değiştirin:

• Özel Oluk Genişliğini Kullan: Evet
• Oluk Genişliği: 1
• Sütun Yüksekliklerini Eşitle: Evet
• Genişlik: %100
• Maksimum Genişlik: %100

aralık

Tüm varsayılan üst ve alt dolguyu da kaldırın.

• Üst Dolgu: 0px
• Alt Dolgu: 0px

Sınır

Ve bir alt kenarlık uygulayın.

• Alt Kenar Genişliği: 2px
• Alt Kenar Rengi: #ff6600

Sütun 1 ve 2 Ayarları

Ardından, sütun 1 ve 2 ayarlarını ayrı ayrı açın.

aralık

Her iki sütuna da aşağıdaki duyarlı dolgu değerlerini ekleyin:

• Üst Dolgu:
  • Masaüstü ve Tablet: %10
  • Telefon: %5
• Alt Dolgu:
  • Masaüstü ve Tablet: %10
  • Telefon: %5
• Sol Dolgu: %5
• Sağ Dolgu: %5

Ana Eleman CSS

Bir satır CSS koduyla birlikte. Bu, sütunları daha küçük ekran boyutlarında yan yana yerleştirmemize de yardımcı olacaktır.

width: 50% !important

Sütun 3 Ayarları

Degrade Arka Plan

Sütun 3 ayarlarına gidin. Aşağıdaki degrade arka planını uygulayın:

• Renk 1: rgba(0,0,0,0.08)
• Renk 2: #0a0a0a
• Gradyanı Arka Plan Resminin Üstüne Yerleştir: Evet

Arka plan görüntüsü

Daha sonra seçtiğiniz bir arka plan resmini yükleyin.

Ana Eleman CSS

Ve bir satır CSS kodu kullanarak sütuna biraz sağ kenar boşluğu ekleyin.

margin-right: 10px !important;

görünürlük

Mobil açılır listemizin çok bunaltıcı olmadığından emin olmak için bu sütunun tamamını tablet ve telefonda saklıyoruz.

Sütun 4 Ayarları

Degrade Arka Plan

Ardından, dördüncü sütunumuz var. Aynı degrade arka planını ekleyin.

• Renk 1: rgba(0,0,0,0.08)
• Renk 2: #0a0a0a
• Gradyanı Arka Plan Resminin Üstüne Yerleştir: Evet

Arka plan görüntüsü

Buraya da bir arka plan resmi yükleyin.

görünürlük

Ve sütunu tablette ve telefonda gizleyin.

Sütun 1'e Metin Modülü Ekle

İçerik Kutusuna Ürün Kategorisi Adı Ekle

Modül ekleme zamanı! Bu açılır menüye istediğiniz her şeyi yerleştirebilirsiniz. Sütun 1'deki ilk modülden başlayarak Metin Modülleri kullanıyoruz. Bir kategori adı ekleyin.

Ürün Kategori Bağlantısı Ekle

Sonraki bağlantıyı bu kategoriye ekleyin.

Metin Ayarları

Tasarım sekmesine gidin ve metin ayarlarını aşağıdaki gibi değiştirin:

• Yazı Tipi: Oswald
• Metin Yazı Tipi Stili: Büyük Harf
• Metin Rengi: #000000
• Yazı Boyutu:
  • Masaüstü: 22 piksel
  • tablet: 18 piksel
  • Telefon: 16 piksel
• Metin Harf Aralığı: -0.6px
• Metin Satırı Yüksekliği: 2.4em

Sınır

Bir alt kenarlık da ekleyin.

• Alt Kenar Genişliği: 2px
• Alt Kenarlık Rengi:
  • Varsayılan: rgba(0,0,0,0)
  • Fareyle üzerine gelin: #ff6600

Metin Modülünü Gerektiği Kadar Kez Klonlayın ve Değiştirin

İlkini tamamladıktan sonra, istediğiniz kadar klonlayabilir ve kopyaları hem 1. hem de 2. sütuna yayabilirsiniz.

Ürün Kategorisi Başlıklarını ve Bağlantılarını Değiştir

Tüm ürün kategorisi adlarını ve bağlantılarını değiştirdiğinizden emin olun.

Sütun 3'e Metin Modülü Ekle

Ürün Kategorisi Adı Ekle

Üçüncü sütuna geçin. Yeni bir Metin Modülü ekleyin ve ürün kategorisi adını girin.

Ürün Kategori Bağlantısı Ekle

Linki de ekleyin.

Metin Ayarları

Modülün tasarım sekmesine gidin ve metin ayarlarını aşağıdaki gibi değiştirin:

• Yazı Tipi: Oswald
• Metin Yazı Tipi Ağırlığı: Kalın
• Metin Yazı Tipi Stili: Büyük Harf
• Metin Rengi: #ffffff
• Metin Boyutu: 3.4vw
• Metin Satırı Yüksekliği: 1em

Konum

Modülü de yeniden konumlandırın.

• Pozisyon: Mutlak
• Konum: Sol Alt
• Dikey Ofset: %2
• Yatay Ofset: %2

Metin Modülünü Sütun 3'e Klonla ve Çoğaltmayı Sütun 4'e Yerleştir

Metin Modülünü 3. sütuna kopyalayabilir ve kopyayı 4. sütuna yerleştirebilirsiniz.

Ürün Kategorisi Adını ve Bağlantısını Değiştir

Bağlantıyla birlikte ürün kategorisi adını da değiştirdiğinizden emin olun.

Diğer Menü Öğeleri için Açılır Menü Olarak Yeniden Kullanılmak üzere Tüm Bölümü Klonla

İlk bölüm açılır menüsünü oluşturduğunuz anda, onu iki kez klonlayabilirsiniz.

Tüm Ürün Kategorisi Adlarını ve Bağlantılarını Değiştirin

Yeni açılır menülerdeki tüm ürün kategorisi adlarını değiştirin.

Bölüm CSS Sınıflarını Ardışık Olarak Değiştirin

Her kopya için son bölüm CSS sınıfı ile birlikte. Ardışık bir sırayı takip ettiğinizden emin olun.

• CSS Sınıfı: açılır menü açılır menü-2

• CSS Sınıfı: açılır menü açılır menü-3

4. CSS ve JQuery Kodu Ekle

Menü Modülünün Üstüne Yeni Kod Modülü Ekle

Artık tüm menü öğelerini yerleştirdiğimize göre, e-Ticaret mega menü açılır menülerini menümüze yerleştirmenin zamanı geldi. Bunu yapmak için yeni bir Kod Modülüne bazı kodlar ekleyeceğiz. Bu Kod Modülünü ikinci bölümünüzün Menü Modülünün hemen üstüne yerleştirin.

CSS Kodu Ekle

Kod Modülünü açın ve aşağıdaki yazdırma ekranında görebileceğiniz gibi stil etiketleri arasına aşağıdaki CSS kodu satırlarını ekleyin:

/* Enable class below once you're done editing the menu */ 
   
/*
.dropdown-menu {
visibility: hidden;
}
*/
  
.category-menu .et_pb_menu__menu .dropdown-menu {
visibility: hidden;
opacity: 0;

-webkit-transition: 300ms all cubic-bezier(.4,0,.2,1);
-moz-transition: 300ms all cubic-bezier(.4,0,.2,1);   
-o-transition: 300ms all cubic-bezier(.4,0,.2,1); 
-ms-transition: 300ms all cubic-bezier(.4,0,.2,1);   
transition: 300ms all cubic-bezier(.4,0,.2,1);    
  
position: absolute!important;
top: 75px;
bottom: auto;
left: 0px;
right: auto;
}
  
.category-menu .et_pb_menu__menu li.first-level:hover .dropdown-menu {
visibility: visible;
opacity: 1;
}

.category-menu  .et_pb_menu__menu li {
margin-top: 0px !important;
} 

.category-menu .et_pb_menu__menu li>a {
margin-top: 0px !important;
padding: 30px 20px !important;    
}

.category-menu .et_pb_menu__menu li.first-level>a:hover {
background-color: #FF6600; 
}  
  
.category-menu .et_mobile_menu .dropdown-menu {
background-color: white; 
padding-top: 25px;
padding-bottom: 5px;
}   

.category-menu .et_mobile_menu li > a {
background-color: transparent;
position: relative;
}
  
.category-menu .et_mobile_menu .first-level > a:after {
font-family: 'ETmodules';
content: '\4c';
color: #FF6600;
font-weight: normal;
position: absolute;
font-size: 16px;
top: 13px;
right: 10px;
}
  
.category-menu .et_mobile_menu .first-level > .icon-switch:after{
content: '\21';
color: #c9c9c9;
}
  
.category-menu .et_mobile_menu .dropdown-menu {
display: none;
}
  
.category-menu .et_mobile_menu .dropdown-menu.reveal-items {
display: block;
}
  
.category-menu .et_pb_menu__menu>nav>ul>li {
position: static !important;
}

.category-menu .et_mobile_menu .dropdown-menu {
visibility: visible !important;
}

JQuery Kodu Ekle

Aşağıdaki baskı ekranında da görebileceğiniz gibi JQuery kodunu script etiketleri arasına ekleyin.

jQuery(function($){
$(document).ready(function(){
  

$('.dropdown-menu').each(function(i){
  
i = i + 1;
  
var $dropdown = $('.dropdown-menu-' + i);
var $mainMenuItem = $('.first-level-' + i + '>a');
$dropdown.insertAfter($mainMenuItem);
  
});  
  
var $firstLevel = $('.et_mobile_menu .first-level > a');
var $allDropdowns = $('.et_mobile_menu .dropdown-menu');

$firstLevel.off('click').click(function() {

$(this).attr('href', '#');  
var $thisDropdown = $(this).siblings(); 

$thisDropdown.slideToggle();
$(this).toggleClass('icon-switch');

var dropdownSiblings = $allDropdowns.not($thisDropdown);   
dropdownSiblings.slideUp();

var $thisFirstLevel = $(this);
var $firstLevelSiblings = $firstLevel.not($thisFirstLevel);
$firstLevelSiblings.removeClass('icon-switch');  

});      
  
});
});

5. Menüyü Özelleştirmeyi Bitirdikten Sonra CSS Sınıfını Etkinleştirin

Tüm açılır bölümleri özelleştirmeyi bitirir bitirmez, yapmanız gereken tek bir şey kalır: onları ilk görüşte gizlemek. Bu, sayfa yüklenirken açılır menünün görünmesini engeller. Bu CSS sınıfını etkinleştirdiğinizde, Visual Builder içindeki açılır bölümleri artık görmeyeceksiniz, ancak bunlara tel kafes modunda erişebilecek ve/veya açılır bölümlerinizde değişiklik yaparken CSS sınıfını geçici olarak devre dışı bırakabileceksiniz. Sınıfı etkinleştirmek için CSS sınıfının başındaki ve sonundaki '/* */' köşeli parantezlerini kaldırın.

6. Divi Tema Oluşturucu Değişikliklerini Kaydet

Genel başlığı tamamladığınızda, sonucu web sitenizde görüntülemeden önce tüm Divi Theme Builder değişikliklerini kaydettiğinizden emin olun!

Ön izleme

Artık tüm adımların üzerinden geçtik, şimdi farklı ekran boyutlarındaki sonuca son bir göz atalım.

masaüstü

Mobil

Son düşünceler

Bu gönderide, Divi's Theme Builder içinde özel bir e-ticaret mega menüsünün nasıl oluşturulacağını gösterdik. Divi'nin yerleşik öğelerini kullanarak açılır menüleri oluşturduk ve menüyü açılır menülere uygun şekilde bağlamaya yardımcı olan bazı kodlarla birleştirdik. Bu yaklaşım, bir eklenti kullanmadan e-Ticaret açılır listenizi farklı ekran boyutlarında tamamen özelleştirmenize olanak tanır! JSON dosyasını da indirebildiniz. Herhangi bir sorunuz veya öneriniz varsa, aşağıdaki yorum bölümüne yorum bırakmaktan çekinmeyin.

Divi hakkında daha fazla bilgi edinmek ve daha fazla ücretsiz Divi almak istiyorsanız, e-posta bültenimize ve YouTube kanalımıza abone olduğunuzdan emin olun, böylece her zaman bu ücretsiz içeriği bilen ve bu ücretsiz içerikten yararlanan ilk kişilerden biri olursunuz.