Divi'de Özel Alanlar ve Dinamik İçerik Kullanarak Vaaz Düzeni Nasıl Oluşturulur

Vaazlara erişme ve dinleme yeteneği, herhangi bir kilise web sitesinin hayati bir parçasıdır. Ve Divi'nin yeni Kilise Düzeni Paketinin piyasaya sürülmesiyle, dinamik içerik kullanarak nasıl bir vaaz düzeni oluşturabileceğinizi göstermenin faydalı olacağını düşündüm. Bunu yapmak için, gönderinizin arka ucunda güncelleyebileceğiniz bir grup özel alanı oluşturmak için Gelişmiş Özel Alanlar eklentisini kullanacağım. Ve Divi'nin dinamik içerik özelliğini kullanarak, gönderinizin içeriğini doldurmak için bu özel alanları çekmek için nasıl bir düzen tasarlayabileceğinizi göstereceğim. Her şey söylenip yapıldığında, görsel oluşturucuyu dağıtmak zorunda kalmadan özel alanların sezgisel bir kullanıcı arayüzü kullanılarak arka uçta güncellenebilen dinamik içeriğe sahip güzel bir vaaz düzenine sahip olacaksınız.

Başlayalım.

Neye ihtiyacın var

Bu eğitim için aşağıdakilere ihtiyacınız olacak:

• Divi Teması
• Gelişmiş Özel Alanlar eklentisi
• Kilise Düzen Paketinden Kilise Blog Düzeni (Divi Builder'dan erişilebilir)

Vaaz Düzeni Sneak Peek

İşte inşa edeceğimiz düzene bir göz atın. Bu düzenin güzelliği, içeriğin çoğunun dinamik içerik kullanılarak arka uçtaki özel alanlardan oluşturulmasıdır.

Gelişmiş Özel Alanlar Eklentisi ile Özel Alanlar Oluşturma

Gelişmiş Özel Alanlar (ACF) eklentisi, gönderilerinizde veya sayfalarınızda dinamik içerik olarak kullanılmak üzere özel alanları birlikte gruplandırmanızı kolaylaştırır. Özel alanların güncellenmesini gerçekten kolaylaştıran bir dizi alan türünü (tarih seçici, Wysiwyg düzenleyici ve oEmbed gibi) destekler. Bu, müşterilerin sitelerini özel alanlar kullanarak güncellemeleri için daha sezgisel bir kullanıcı arayüzü sağlamak için son derece yararlıdır.

ACF eklentisini yükledikten ve etkinleştirdikten sonra, WordPress Kontrol Panelinize ve Özel Alanlar > Yeni Ekle'ye gidin.

Yeni bir alan Grup ekle

Yeni bir grup kurmak için yeni alan grubuna bir başlık verin.

Konum bölümü (veya geçiş) altında, Ayarları Gönderi Türü, Gönderi yerine “Proje” olacak şekilde değiştirin. Bu temelde eklentiye Divi'de yerleşik proje gönderi türünde yalnızca bu özel alan grubunu görüntülemesini söyler (İsterseniz gönderi olarak da bırakabilirsiniz. Seçiminiz.)

Ardından ayarlar bölümüne gidin ve aşağıdakileri güncelleyin:

Konum: Yüksek (içerikten sonra)

Bu konum ayarı, gönderinizin veya sayfanızın arka uç düzenleyicisindeki özel alan grubunuzun konumunu belirler.

Alan Grubuna Özel Alanlar Ekle

Grubunuz oluşturulduğuna ve kurulduğuna göre, gruba özel alanlar eklemenin zamanı geldi.

Hoparlör Özel Alanı

İlk özel alan için, kullanıcıların vaaz için bir konuşmacı girmesi için bir yer ekleyelim. Yeni bir alan eklemek için “Alan Ekle” düğmesine tıklayın ve aşağıdakileri girin:

Alan Etiketi: Hoparlör
Alan Adı: konuşmacı
Alan Türü: Seç
Seçenekler (her birini yeni bir satıra girin): Kıdemli Papaz, Yardımcı Papaz, Gençlik Papazı, Konuk Konuşmacı

Vaaz Başlığı Özel Alanı

Ardından, vaaz başlığı için özel bir alan ekleyin.

Alan Etiketi: Vaaz Başlığı
Alan Adı: sermon_title
Alan Türü: Metin
Yer Tutucu Metni: Vaaz Başlığı

Vaaz Tarihi Özel Alanı

Ardından vaaz tarihi için özel bir alan ekleyin. Bu, bir tarih seçici alan türüne sahip olacak şekilde ayarlayacağız, böylece yeni tarihler eklemek arka uçta bir esinti olacak.

Alan Etiketi: Vaaz Tarihi
Alan Adı: sermon_date
Alan Türü: Tarih Seçici
Görüntü Formatı: F j, Y
Dönüş Biçimi: F j, Y
Hafta Başlıyor: Pazartesi

Vaaz Açıklaması Özel Alanı

Ardından, vaaz açıklaması için özel bir alan ekleyin. Bu, kullanıcıların görsel oluşturucuyu açmak zorunda kalmadan bir Wysiwyg düzenleyicisi kullanarak yazının içeriğini güncellemesine olanak tanır.

Alan Etiketi: Vaaz Açıklaması
Alan Adı: sermon_description
Alan Türü: Wysiwyg Düzenleyici

Vaaz Sesi Gömme Özel Alanı

Ardından, oEmbed alan türünü kullanarak vaaz sesi yerleştirmesi için özel bir alan ekleyin. Bu, arka uçtaki yerleştirme için ses url'sini güncelleyerek vaazın ses yerleştirmesini yerleştirmemize olanak tanır.

Alan Etiketi: Sermon Audio Embed
Alan Adı: sermon_audio_embed
Alan Türü: oEmbed

Vaaz Sesi URL'si Özel Alanı

Ardından, vaaz sesi URL'si için özel bir alan ekleyin, böylece URL'yi bir modül içinde dosyaya bir indirme bağlantısı oluşturmak üzere bir bağlantı doldurmak için kullanabiliriz.

Alan Etiketi: Vaaz Sesi URL'si
Alan Adı: sermon_audio_url
Alan Türü: URL

Peki. Alan grubumuza özel alanlar eklendikten sonra alan grubunuzu kaydetmeyi unutmayın. Artık gönderi boyunca dinamik içerik olarak kullanılacak özel alan vaaz içeriğimiz için vaaz düzeni oluşturmaya başlayabiliriz.

Yeni Proje Oluştur

WordPress Kontrol Panelinden Projeler > Yeni Ekle'ye gidin. Ardından, vaazın başlığı da olması gereken Proje için bir başlık girin (ancak bu size kalmış). Ardından Divi Builder'ı kullanmak için tıklayın. Divi oluşturucunun en üstünde görüntülenen özel alan grubunu göreceksiniz.

Şimdi özel alanları bu gönderiye özel vaaz bilgileriyle doldurun.

Konuşmacı: Kıdemli Papaz (açılır menüden seçilir)
Vaaz Başlığı: Yeni Bir Yaratılış (veya ne istersen)
Vaaz Tarihi: tarih seçiciden tarih seçin
Vaaz Açıklaması: vaazın açıklamasını girmek için WYSIWYG editörünü kullanın
Sermon Audio Embed: medya oynatıcıya gömmek istediğiniz medya dosyasının url'sini girin
Sermon Audio URL: medya dosyasının url'sini girin (bunun tıklandığında hemen indirilmesini istiyorsanız bir zip dosyası olmalıdır)

Ardından projeniz için bir Öne Çıkan resim ekleyin. Bu, vaaz düzeninin ses oynatıcısı için kullanılan görüntü görevi görecektir.

Projeniz için Yeni Hazır Düzen Ekleme

Şimdi Visual Builder'ı kullanmak için tıklayın.

(Not: Şu anda arka uç oluşturucu dinamik içeriği desteklemiyor, bu nedenle görsel oluşturucuyu dağıtmamız gerekiyor. Düzeni daha arka uç oluşturucu işleviyle özelleştirmeyi tercih ederseniz, görsel oluşturucuyu dağıtın ve tel çerçeve modunu tıklayın.)

Ardından, Hazır Bir Düzen Seçme seçeneğine tıklayın. Kütüphaneden yükleme açılır penceresinden Kilise Düzen Paketi'ni seçin ve ardından Kilise Blog Sayfası düzenini kullanmak için tıklayın.

Düzen sayfaya yüklendikten sonra ikinci, dördüncü ve beşinci bölümleri düzenden silin. Artık düzeniniz yalnızca üç bölümden oluşmalıdır: üst başlık bölümü, "Son Vaazlar" bölümü ve alt bilgi bölümü.

Ardından ikinci bölümdeki blog modülünü silin.

“Son Vaazlar” metin modülünü aşağıdaki içeriğe sahip olacak şekilde güncelleyin:

<h3>Description</h3>

Ardından bu metin modülünü çoğaltın ve içeriği “Şimdi Dinle” diyecek şekilde güncelleyin.

Vaaz Düzeni Dinamik İçeriğini Ekleme

Vaaz Açıklaması

Artık bölümümüz için dinamik vaaz ses içeriğini oluşturmaya başlamaya hazırız. Yeni başlayanlar için vaaz açıklamasını metin modülünün hemen altına “Açıklama” başlığıyla ekleyeceğiz. Bunu yapmak için yeni bir metin modülü ekleyin. İçerik giriş kutusunun üzerine gelin ve dinamik içerik simgesine tıklayın.

Ardından açılır listeden Vaaz Açıklaması özel alanını seçin.

Ayarları kaydet.

Artık vaaz açıklamanız dinamik içerik olarak görüntülenecektir. Bu, arka uç düzenleyici ekranındaki vaaz açıklaması giriş kutusuna eklediğiniz her şeyin proje sayfasında dinamik olarak güncelleneceği anlamına gelir.

Ses Modülü ve Ses Gömme

“Şimdi Dinle” başlıklı metin modülünün altına yeni bir Ses Modülü ekleyin. Ardından metin içeriğini aşağıdaki dinamik içerikle güncelleyin:

Başlık: Vaaz Başlığı (özel alan)
Sanatçı Adı: Konuşmacı (özel alan)
Albüm Adı: Vaaz Tarihi (özel alan)

Biz esas olarak dinamik içeriğin ses modülü içindeki yerleşimi ile ilgilendiğimiz için etiketler gerçekten önemli değil. Vaaz Başlığı, Konuşmacı ve Vaaz Tarihi, çok fazla çalışma gerektirmeden ses modülü içinde güzel bir şekilde görüntülenir.

Ses modülünün Kapak Resmi Resmi için, resim önizleme alanının üzerine geldiğinizde dinamik içerik simgesine tıklayarak dinamik içerik ekleyin ve Öne Çıkan Resim'i seçin.

Artık arka uçta öne çıkan görseliniz olarak ne ayarladıysanız, vaaz sesiniz için kapak resmi resmini otomatik olarak dolduracaktır.

Düzenin tasarımını daha iyi eşleştirmek için ayarlarınızı kaydedin ve bölüm ayarlarında Arka Plan kategorisi metnine sağ tıklayıp “Arka Planı Kopyala” seçeneğini seçerek alt bölümün arka planını kopyalayın.

Şimdi, ses modülü ayarlarını açarak, arka plan kategorisi metnine sağ tıklayarak ve “Arka Planı Yapıştır” seçeneğine tıklayarak arka planı ses modülü arka plan ayarlarınıza yapıştırın.

Ardından tasarım ayarlarına geçin ve aşağıdakileri güncelleyin:

Metin Yönü: Sol
Özel Kenar Boşluğu: 0 piksel alt

Şimdi vaaz ses oynatıcısını tamamlamak için elimizde kalan tek şey, gerçek ses oynatıcı yerleştirmesidir. Şu anda, ses modülünde yerleşik olan ses giriş kutusu dinamik içeriği desteklemiyor (eminim gelecekte destekleyecektir), bu yüzden küçük bir geçici çözüm yapacağız. Yeni bir metin modülü oluşturacağız ve dinamik içerik kullanarak gömülü ses dosyasını ekleyeceğiz. Ve WordPress, özel alan tarafından oluşturulan kısa kodu tanıma şekli nedeniyle, varsayılan ses çaları görüntüler.

Bunu yapmak için, ses modülünün altına bir metin modülü ekleyin ve ardından dinamik içerik olarak “Sermon Audio Embed” özel alanını ekleyin. Kısa kodun çalışması için Ham HTML'yi Etkinleştirdiğinizden emin olun.

Artık ses çalarımızı bazı özel kenar boşluklarıyla ses modülünün içine yerleştirebiliriz. Tasarım sekmesine gidin ve aşağıdakileri güncelleyin:

Özel Kenar Boşluğu (masaüstü): -40 piksel Üst, 280 piksel Sol, 60 piksel Sağ
Özel Kenar Boşluğu (tablet): 0px Sol, 0px Sağ

İndirme Bağlantısı

Bazen, kullanıcıların ses dosyasını indirmesi yararlıdır. Bunu kolaylaştırmak için, gönderinize ses dosyasına bir bağlantı ekleyebilirsiniz. Bunu yapmak için, bir tanıtım modülünü vaaz başlığı ve ses url'si ile doldurmak için dinamik içerik kullanacağız.

Ses modülünün altına bir tanıtıcı modül ekleyin ve içeriği aşağıdaki gibi güncelleyin:

Başlık: Vaaz Başlığı (özel alan)
Simge: ekran görüntüsüne bakın
Başlık Bağlantı URL'si: Vaaz Sesi URL'si (özel alan)

Tanıtım yazısına daha çok tıklanabilir bir bağlantı gibi görünecek şekilde stil vermek için aşağıdakileri güncelleyin:

Simge Rengi: rgba(33,50,94,0.86)
Resim/Simge Yerleşimi: Sol
Başlık Yazı Tipi Stili: U
Başlık Alt Çizgi Rengi: rgba(33,50,94,0.86)
Başlık Metin Rengi: rgba(33,50,94,0.86)
Başlık Satırı Yüksekliği: 2em
İçerik Genişliği: %100

Bağlantıyı indirme olarak daha da tanınabilir hale getirmek için, tanıtım başlığını işgal eden vaaz başlığı dinamik içeriğini, giriş kutusundaki “(indirme)” yazan ek metinle düzenleyebilirsiniz.

Başlığa Vaaz Başlığı ve Meta Ekleme

Son adım olarak, proje/yazı başlığı bölümümüzün, konuşmacı adı ve vaaz tarihi ile birlikte yazı başlığı için dinamik içerik kullandığından emin olalım. Bunu yapmak için tam genişlikli başlık modülü ayarlarını açın ve aşağıdakileri güncelleyin:

Başlık: Vaaz Başlığı (özel alan)
Alt Başlık Metni: Konuşmacı (özel alan)
(Not: Hoparlör dinamik içeriği için, girişten önce "by:" girin)
Düğme #1 Bağlantı Metni: sil
Düğme #2 Bağlantı Metni: sil
İçerik: Vaaz Tarihi (özel alan)

Şimdi tasarım sekmesine gidin ve kullanılan özel dolguyu çıkarın.

İşte nihai sonuç.

Şimdi yapmanız gereken tek şey, gelecekteki vaaz gönderilerinde kullanılmak üzere düzeni Divi kitaplığınıza kaydetmek. Ve tüm projelere devam etmek için özel alan grubunuz hazır olduğundan, Visual Builder'ı açmanıza gerek kalmadan arka uçtaki özel alan bilgilerini güncelleyebilirsiniz.

Ayrıca proje olarak kaydedilen vaazlar ile vaazlarınızı görüntülemek için kolayca filtrelenebilir bir portföy oluşturabilirsiniz!

Son düşünceler

Umarım bu eğitim, dinamik içeriğe ve vaazlar için güçlü bir düzen oluşturmak üzere Gelişmiş Özel Alanlar eklentisiyle nasıl kullanılabileceğine biraz daha ışık tutmaya yardımcı olur. Her şeyi ayarlamak biraz zaman alabilir, ancak getirisi kesinlikle buna değebilir. Tabii ki, aynı işlem, farklı gönderi türleri için her türlü dinamik içeriği oluşturmak için kullanılabilir. Aşağıdaki yorumlarda herhangi bir sorunuz varsa bana bildirin. Cevabınızı sabırsızlıkla bekliyorum.

Şerefe!