Divi eklentisi spot ışığı: divi modül üreticisi
Divi Marketplace’de bulunan Divi Divi Modül Oluşturucu pazarında bulun! Bu, incelememizi geçtiğimiz ve kalite standartlarımızı karşılamayı kanıtladığımız anlamına gelir. Mevcut tüm ürünleri görmek için pazardaki Divi eklentisini ziyaret edebilirsiniz. Divi Marketplace’ten satın alınan ürünler, sınırsız web siteleri ve 30 gün öncesi garantili (Divi gibi) ile birlikte gelir. Divi Pazarı’ndan Satın Alın
Divi Builder, düzeninize neredeyse tüm tasarım öğelerini eklemenize yardımcı olacak birçok modül içerir, ancak kendi modülünüzü yapmak istiyorsanız? Divi Modül Builder adlı üçüncü taraf eklentisi size bu yeteneği verir.
Bu makalede eklentiyi göreceğim ve ne yapılabileceğini ve kullanmanın ne kadar kolay olduğunu göreceğim. Bu Divi 3.0.50 veya daha yüksek gerektirir ve Divi ve ekstra ile çalışır. Bu, geliştirici web sitesinden edinilebilir: diviplugins.com. Divi modül üreticisini yükleme
Modülü ekle Modül, özel modülün altındaki gösterge paneli menüsünde yapılır, modülü ekleyin. Modül yapmak için kullanacağınız iki alan vardır. Soldaki alan bir alan yaratacağınız yerdir. Sağdaki alan, sahada kullanılacak kodu ekleyeceğiniz yerdir. Standart veya tam geniş bir modül yapabilirsiniz. Taslağı kaydedebilir veya hazırsa yayınlayabilirsiniz. Modül verildikten sonra Divi Builder’da görünecektir. Modül alanları İstediğiniz kadar alana sahip olabilirsiniz. Her alanda bir alan özelliği vardır. Her alan özelliğinde daha yakın bir ekran aşağıdadır: Modül İçerik sekmesindeki alanın başlığı olarak görüntülenecek alan etiket etiketi. HTML’de alanı yönlendirmek için kullanacağınız benzersiz alanları belirleme. Alanı tanımlamak için yalnızca küçük harf, sayılar ve alt çizgiler kullanın. Alanın Tanımı – Alanın hedeflerini açıklamak için kendi açıklamanızı ekleyin. Bu, Modül İçerik sekmesindeki girişin altında görüntülenir. Bu alan isteğe bağlıdır, ancak kullanıcılara yardımcı olmak için bilgi veya örnek eklemenizi öneririm. Alan Türü – Kullanıcının gördüğü giriş türünü belirleyin. Açılır kutudan metin, metin alanı, renk, görüntü, EVET/HAYIR ve simgeler dahil olmak üzere birkaç alan türünü seçin.
Tasarım sekmesi – Modül tasarımında bu alan için yazı tipi kontrolü ekleyin. Metin veya metin alanı seçerseniz bu seçeneği göreceksiniz. HTML’ye sınıf ekleyerek hangi öğelerin yazı tipi kontrolü uygulayacağını tanımlamanız gerekir. Alanları Gizle – Kontrol kullanıcılarını, bu öğenin içeriğini kontrol etmelerine izin vermeden HTML çıkışındaki öğe yazı tipi üzerinden verin. Bu seçenek yalnızca metin veya metin alanı türü seçilirse kullanılabilir. Alan etiketini, tanımlama, açıklama, alan türünü seçin, tasarım sekmesini etkinleştirin veya alanı gizlemeyi seçin. Her alandaki yukarı/alt okları tıklayarak düzlemi sıfırlayın. Her bölüm ve alan bir açıklama ve örnek verir. Kod, çıktıyı kontrol etmek için özel HTML, PHP, CSS ve JavaScript ekler. HTML alanı özel kuyruk ve PHP alabilir. Kodu tanımadan önce PHP’yi etkinleştirmelisiniz. Değilse, kodu ekranda yazdıracaktır. Hem HTML hem de PHP, alanın tanımlanmasını alana atıfta bulunmak için kullanır. Kod kısayolları kod alanının altında bir düğme olarak sağlanır. Bu, etiketleri ve alanların tanımlanmasını içerir. Alanınızın kimliğini ekleyin ve ardından kodunuza eklemek için tıklayabileceğiniz kodun altında bulunabilir. HTML tanımlaması turuncu bir düğme olarak görülür ve PHP yeşil görünür. Bir kısayol olarak mevcut olandan daha fazlasını kullanabilirsiniz, ancak bu, geliştirme süresini hızlandırmaya yardımcı olmak için burada.
Modüller yapmak
İşte bir modül yapmanın hızlı bir örneği. Başlık, Divi Builder’daki modülde görünen isim olacak. Bir alan etiketi, açıklama, metin türü olarak metin seçimi ve alan tanımlayıcıları oluşturma ekledim.
HTML kısayolunda tanımlama görünmesi için bir taslak olarak saklıyorum. Sonra, kısayoldan H1 etiketini seçtim, imlecimi etiketler arasına koydum ve etiketi HTML kısayolundan seçtim. Bitirdikten sonra Publish’e basın. Sonuç, kullanıcının metne girebileceği alanın bulunduğu bir modül olmalıdır. Çıktı metni başlık olarak görüntüler. Modül artık Divi Builder’da görünür. Diğer divi modülleri gibi sayfalara ekleyebilirim. İçerik sekmesi, etiketimle eklediğim alanı içerir. Modül, alana girdiğim metni görüntüler. H1 olarak görüntülemek için HTML eklediğim için, metnin otomatik olarak bir H1 özelliği var. Daha fazla ayarlama özelliği eklemek için bir tasarım sekmesi ekleyebilirim. Bu, alanı doğru bir şekilde hedeflemek için birkaç kod gerektirecektir. Modül Modül listesini gösterge paneli menüsünde görebilirsiniz. Özel bir modül olan modüle gidin. Burada modülünüzü düzenleyebilir veya silebilirsiniz. Bu, PHP’nin her modül için açılıp açılmadığını veya kapatılıp kapatılmadığını gösterir. Modülü klonlamak istiyorsanız, ayarlarda görmelisiniz. Özel Modül Ayarları Ayarlar menüsü, modülünüzü yönetebileceğiniz bir konum sağlar. Yayınlanan ve taslak olan modülleri görebilirsiniz. Klonlayabilirsiniz, bu da size başka bir modülde kullandığınız birçok kod gerektiren bir modülde başlamak için iyi bir yer sağlar. Ayrıca PHP’yi düzenleyebilir, devre dışı bırakabilir veya etkinleştirebilirsiniz (kod hatası nedeniyle editörden kilitliyseniz yararlıdır – bunu yapıyorum ve modülü düzenlemek için bu özelliği kullanıyorum) ve modülünüzü içe aktarın ve dışa aktarabilir. Bağımlılık ekle Burada CSS ve JavaScript Üçüncü Partisi bağımlılıkları ekleyebilirsiniz. Bunları harici veya dahili URL’ler olarak ekleyin. Açılır kutudan CSS veya JavaScript’i seçin, adı ekleyin ve URL’yi ekleyin. Daha sonra herhangi bir sayfada kullanılabilirler. Bu, Font Awesome kullanımına bir örnek verir. Bu, tek bir yere bağımlılık yapmanın ve daha sonra her yerde kullanmanın en iyi yoludur. Divi modülü Moder örnekleri – ‘Tamam’ modülü oluşturmak yerine özel blog ızgarası, geliştiriciler tarafından yapılan muhteşem bir örnek gösteriyorum – Kustom Blog Kutuları (Geliştirici web sitesinden ücretsiz olarak indirilebilir). Buna HTML, PHP ve CSS olmak üzere 3 alan dahildir. Aşağıdakiler her birini görmek. Özel Blog Izgara Modülü
Alan 1, kategorileri tanımlandığı gibi kullanılarak etiketlenmiş kategorilerdir ve alanın türü metne düzenlenir.
Alan 2, B&W görüntü efekti olarak etiketlenmiştir. Tanımlama filtredir ve önerilen tip evet/hayır geçiştir. Filtreler CSS’de yapılır. Alan 3 yazı başlığı olarak etiketlenir ve Post_title’yi kimlik olarak kullanır. Alan türü metne düzenlenir ve tasarım sekmesi etkinleştirilir. Modülde bu alana ayarlamalar göreceğiz. Bu alana HTML’de H2 sınıfı verilir.PHP, HTML çıktı kodu kutusunda kullanılabilecek şekilde seçilir. CSS çıkış kutusuna özel CSS eklenir. Sırada JavaScript. Bu eklentiden maksimum sonuç almak için HTML, PHP, CSS ve JavaScript hakkında iyi bir anlayışa sahip olmalısınız. Başka bir deyişle, bu geliştiriciler için bir eklentidir. Divi Builder’da özel blog ızgarası modülü Modül yayınlandıktan sonra Divi Builder’da bulacaksınız. Modülde ve etikette görünen ayarlar, yaptığınız seçime bağlı olarak değişecektir.Bu modül, kategoriler eklemenize, siyah beyaz efekti etkinleştirmenize ve içerik sekmesine yayın başlığını eklemenize olanak tanır.Bu aynı zamanda arka plan ayarlarını da içerir (modüller için varsayılandır). Bu modül için tasarım sekmeleri etkinleştirilir.Buna metin, metin başlıkları, sınırlar, boşluklar ve animasyonlar için ayarları içerir.Özel blog ızgarasının sonuçları Sonuç, Hover animasyonlu bir blog ızgarasıdır.Siyah beyaz modu etkinleştirdim, böylece imleci işaret etmedikçe görüntünün siyah beyaz görüntülenmesi.Bu uçuşun şeklini tercih ederim – zemini gizlemek yerine fotoğrafları ifade etmek için.