Divi'nin Video Kaydırıcı Modülü ile Oynatma Listesi Sayfası Nasıl Oluşturulur

Oynatma listesi sayfası, benzer içeriği kullanıcının kolayca erişebileceği bir şekilde sunmanın etkili bir yoludur. Divi Video Slider modülleri, kurslar ve öğreticiler gibi video içerikli bir oynatma listesi sayfası oluşturmanın harika bir yoludur. Bu makalede, birden fazla bölüm ve birkaç destekleyici modül kullanarak Divi's Video Slider modülü ile bir oynatma listesi sayfasının nasıl oluşturulacağını göreceğiz.

Başlayalım.

Oynatma Listesi Sayfası Önizlemesi

İlk olarak, burada ne inşa edeceğimize bir bakalım.

masaüstü

Telefon

Oynatma Listesi Sayfası Oluşturun

Sayfamız, her biri iki satırdan oluşan üç bölümden oluşacaktır. Her bölümde 5 modül olacaktır. İlk bölümü oluşturduktan sonra, onu iki kez kopyalayacağız ve ikinci ve üçüncü bölümleri oluşturmak için değişiklikler yapacağız.

İlk bölümümüz ve satırlarımız varsayılan stili kullanacak. Divi'de bulunan ücretsiz Print Shop Layout Pack'teki stil kuyruklarını kullanıyorum. Takip etmeyi kolaylaştırmak için, sayfayı Tel Çerçeve Görünümü ile oluşturacağım ve Masaüstü Görünümü ile biçimlendireceğim.

Tam Genişlik Sırası

İlk olarak, yeni bir sayfa oluşturun, Visual Builder'ı etkinleştirin ve tam genişlikte bir satır ekleyin .

2/3 1/3 Sıra

Bu satırın altına 2/3, 1/3 satır ekleyin .

Video Kaydırıcı Başlık Metin Modülünü Ekleyin

Tam genişlik satırına bir Metin modülü ekleyin.

Video Kaydırıcı Modülü Ekleyin

Ardından, 2/3, 1/3 satırının sol sütununa bir Video Slider modülü ekleyin.

Video Kaydırıcısı Ekle Açıklama Başlık Metin Modülü

Ardından, Video Slider modülünün altına bir Metin modülü ekleyin. Bu, açıklamayı tanıtmak için kullanılacaktır.

Video Kaydırıcısı Açıklama Metin Modülü Ekle

Ardından, açıklamayı içerecek Metin modülünü ekleyin. Bu, Açıklama Başlığı modülünün altına girer.

Kişi Modülünü ekleyin

Son olarak, 2/3, 1/3 satırının sağ sütununa bir Kişi modülü ekleyin.

Video Oynatma Listesi Sayfasının Stilini Oluşturun

Sayfanız artık benimki gibi görünecek. Bu, Tel Çerçeve Görünümüdür. Şimdi modüllere stil verme zamanı. Masaüstü Görünümüne geçeceğiz. Sayfayı oluşturma şeklim nedeniyle benimki varsayılan içeriği göstermeyecek.

Oynatma Listesi Sayfasına Stil Ver Video Kaydırıcısı Başlık Metin Modülü

İlk Metin modülünün ayarlarını açın.

Metin Düzeyini Başlık 2 olarak değiştirin ve gövde içeriğine Birinci Sütun: Temel Temeller (veya başlığınız) başlığını ekleyin.

• Metin Düzeyi: H2
• Gövde İçeriği: Birinci Sütun: Divi Temelleri

Ardından, Tasarım sekmesine gidin. H2 Başlık Metni'ni seçin ve Yazı Tipi'ni Oswald olarak değiştirin. Stili TT'ye, Hizalamayı Merkeze ve Rengi #000645'e ayarlayın.

• Başlık Seviyesi: H2
• Yazı Tipi: Oswald
• stil: TT
• Hizalama: Merkez
• Renk: #000645

Ardından, Yazı Tipi boyutunu Masaüstü için 46 piksel, Tablet için 32 piksel ve Telefon için 20 piksel olarak ayarlayın. Harf Aralığını 1 piksel ve Satır Yüksekliğini 1.4em olarak değiştirin. Modülün ayarlarını kapatın.

• Yazı Tipi Boyutu: Masaüstü 46px, Tablet 32px, Telefon 20px
• Harf Aralığı: 1px
• Çizgi Yüksekliği: 1.4em

Oynatma Listesi Sayfası Video Kaydırıcı Modülünü Stillendirin

Ardından, içeriği ekleyeceğiz ve Video Slider modülünü şekillendireceğiz . Modülün üzerine gelin ve ayarlarını açmak için dişli simgesine tıklayın.

Yeni Video Ekle 'yi tıklayın.

Videonuzu ekleyin ve alt modülü kapatın.

İlk bölüm için tüm videolarınızı ekleyene kadar işleme devam edin. Varsayılan ayarları kullanıyorum, ancak videolar için varsayılan öne çıkan görseli göstermek istemiyorsanız Slider Track yerine Dot Navigation'ı kullanabilir ve Bindirmeleri etkinleştirebilirsiniz.

Oynatma Listesi Sayfası Stili Video Kaydırıcısı Açıklama Başlık Metin Modülü

Ardından, doğrudan Video Kaydırıcısının altındaki Metin modülünün ayarlarını açın. Bu, açıklamamızın başlığı olarak kullanılacaktır.

Gövde Metni'ni Başlık 3 olarak değiştirin ve Bu Seri Hakkında metnini Gövde İçeriği alanına girin.

• Metin Düzeyi: Başlık 3
• İçerik: Bu Seri Hakkında

Ardından, Tasarım sekmesine gidin. Başlık Metni H3'ü seçin ve Yazı Tipi'ni Oswald, Stili TT, Hizalamayı Sola ve rengi #000645 olarak değiştirin. Modülün ayarlarını kapatın.

• Başlık Metni: H3
• Yazı Tipi: Oswald
• stil: TT
• Hizalama: Sol
• Renk: #000645

Oynatma Listesi Sayfası Stili Video Kaydırıcısı Açıklama Metin Modülü

Ardından, bir sonraki Metin modülünün ayarlarını açın. Bu, video serisinin açıklamasını içerecektir.

Serinin açıklamasını Gövde İçeriği alanına girin.

• İçerik: video açıklaması

Ardından, Tasarım sekmesine gidin ve Metin Hizalama'ya gidin. Hizalamayı Sola Ayarlayın. Ayarlarının geri kalanını varsayılan değerlerinde bırakacağız. Modülün ayarlarını kapatın.

• Hizalama: Sol

Oynatma Listesi Sayfası Kişi Modülünü Stillendirin

Son olarak, Kişi modülünün ayarlarını açın.

Genel sekmesinde, Metin altında, kişinin adını Ad alanına girin ve Pozisyon alanına Eğitmen yazın. İstediğiniz sosyal medya bağlantılarından herhangi birini girin. Bu eğitim için onları boş bırakıyorum.

• İsim: kişinin adı
• Pozisyon: Eğitmen

İçerik alanına ilerleyin ve eğitmenin açıklamasını ekleyin. Görüntü altında, medya kitaplığınızdan bir görüntü seçin.

• Içerik açıklaması
• Resim: kişinin resmi

Başlık Metni

Tasarım sekmesine gidin ve Başlık Metni'ne gidin. H4 Başlık Düzeyini seçin. Yazı Tipi'ni Oswald'a, Ağırlığı Yarı Kalın'a, Stili TT'ye ve Rengi #000645'e ayarlayın. Boyutu 20 piksele, Aralığı 1 piksele ve Çizgi Yüksekliğini 1,5em olarak ayarlayın.

• H4
• Oswald
• Yarı Kalın
• TT
• #000645
• 20 piksel
• 1 piksel boşluk
• Hat yüksekliği 1.5em

Konum Metni

Son olarak, Konum Metni'ne gidin . Yazı Tipi için Oswald'ı seçin ve Ağırlığı Yarı Kalın olarak ayarlayın. Stili TT'ye, Rengi #8f9ca4, Boyutu 15 piksele, Satır Aralığını 1 piksele ve Çizgi Yüksekliğini 1.5em olarak ayarlayın. Modülün ayarlarını kapatın.

• Yazı Tipi: Oswald
• Ağırlık: Yarı Kalın
• stil: TT
• Renk: #8f9ca4
• Boyut: 15 piksel
• Aralık: 1 piksel
• Çizgi Yüksekliği: 2em

Oynatma Listesi Sayfasının Bölümünü Çoğalt

Artık Bölüm bizim istediğimiz şekilde tasarlanıp biçimlendirildiğine göre, fareyle ayarlarının üzerine gelin ve 2 kopya yapın .

Oynatma Listesi Sayfasının İkinci Bölümüne Stil Ver

İkinci bölüm için arka plan rengini değiştireceğiz , böylece diğerlerinden farklı olacak. Modüllerin içeriğini de değiştireceğiz.

Bölüm Ayarları

Ardından, ikinci bölüm için ayarları açın.

Arka Plan'a ilerleyin ve rengi #f9f7f4 olarak ayarlayın. Ayarları kapatın.

• Arka Plan Rengi: #f9f7f4

İkinci Video Kaydırıcı Başlık Metin Modülü

İkinci bölümün başlığını açın ve ikinci video grubunu yansıtacak şekilde değiştirin. Bu bölüme Sütun İki: Divi Modülleri adını veriyorum. Ayarları kapatın.

• İçerik: İkinci Sütun: Divi Modülleri

İkinci Video Kaydırıcı Modülü

İkinci bölümün Video Slider modülünün ayarlarını açın. Videoları ikinci bölümünkilerle değiştirin. Ayarları kapatın.

• Alt modüller: videoları seçin

İkinci Video Kaydırıcı Açıklama Başlık Metin Modülü

Bu başlık aynı kalacak, bu yüzden değişiklik yapmamız gerekmeyecek.

İkinci Video Kaydırıcı Açıklama Metin Modülü

Ardından, ikinci video açıklamasıyla Metin modülünü açın ve ikinci video grubu için açıklama oluşturun .

• Gövde İçeriği: video açıklaması

İkinci Kişi Modülü

İkinci video grubunu farklı bir eğitmen öğretiyorsa, ikinci Kişi modülünü açın ve adı değiştirin. Ayrıca, kullanıyorsanız sosyal medya URL'lerini değiştirin veya ekleyin.

• İsim: eğitmenin adı

Ardından, Gövde İçeriği ve Görüntü alanına gidin ve kişinin açıklamasını ve görüntüsünü değiştirin.

• Gövde İçeriği: kişinin açıklaması
• Resim: kişinin resmi

Üçüncü Bölüme Stil Ver

Üçüncü bölüm için modüllerin içeriğini değiştireceğiz. Bu bölüm varsayılan ayarları kullanacak, böylece ilk başlığa geçebiliriz.

Üçüncü Video Kaydırıcı Başlık Metin Modülü

Başlık Metin modülünü açın ve başlığı bu video grubuyla eşleşecek şekilde değiştirin. Modülün ayarlarını kapatın.

• Gövde İçeriği: Üçüncü Sütun: Divi Düzenleri

Üçüncü Video Kaydırıcı Modülü

Üçüncü Video Slider modülünü açın ve videoları bu set için olanlarla değiştirin. İsterseniz Amin Etiketlerini değiştirin ve modülün ayarlarını kapatın.

• Yeni Video Ekle: her videoyu değiştirin

Üçüncü Video Kaydırıcı Açıklama Metin Modülü

Üçüncü bölümün video açıklaması için Metin modülünü açın. Bu video grubu için bir açıklama oluşturun. Metin modülünün ayarlarını kapatın.

• Gövde İçeriği: video açıklaması

Üçüncü Kişi Modülü

Son olarak, bu bölüm için Kişi modülünü açın ve ilk video grubundan farklıysa adı değiştirin. İkinci grupla aynı kişiyse, o modülü kopyalayın, bu sütuna yapıştırın ve bu modülü silin. Kullanıyorsanız sosyal ağ bağlantılarını değiştirin veya ekleyin.

• İsim: Eğitmenin adı

Gövde İçeriği ve Görüntü alanına gidin ve bunları bu kişinin bilgileriyle eşleşecek şekilde değiştirin. Modülü kapatın , sayfanızı kaydedin ve Visual Builder'dan çıkın .

• Gövde İçeriği: kişinin açıklaması
• Resim: kişinin resmi

Oynatma Listesi Sayfası Sonuçları

Oynatma listesi sayfamızın masaüstünde ve telefonda nasıl göründüğü aşağıda açıklanmıştır.

masaüstü

Telefon

Biten Düşünceler

Divi's Video Slider modülü ile bir oynatma listesi sayfasını nasıl oluşturacağımıza bakışımız bu. Bu basit bir işlemdir ve ilk bölümün stilini oluşturduktan sonra kopyalar oluşturmak, ikinci ve üçüncü bölümleri oluşturmayı çok daha kolay hale getirir. Sadece içeriği değiştirmemiz gerekiyor ve işimiz bitti. Divi'nin Video Slider modülü, videolar içeren herhangi bir oynatma listesi sayfası için mükemmel bir seçimdir.

Senden duymak istiyoruz. Divi'nin Video Slider modülüyle bir oynatma listesi sayfası oluşturdunuz mu? Yorumlardaki deneyiminizi bize anlatın.