Divi blog modülü kullanarak yüzen bir kart nasıl tasarlanır
Bugün size blog yayınlarını Divi’de yüzen kartlar olarak göstermenin yaratıcı yollarını göstereceğiz. Her blog veya web sitesi harika ilginç içeriğe sahip olmaya çalışmalı ve belki de önemli olan erişilebilir. İçeriğin hala kullanıcılar tarafından erişilebilmesini sağlamanın bir yolu bunu sayfaya sarmaktır. Bu aynı zamanda kalıcı bir element (veya yapışkan) yapmak olarak da bilinir. Ve orada blogcular için, blog yayınınızı yüzen bir kart olarak nasıl görüntüleyeceğinizi göstereceğiz, böylece sayfayı aşağı kaydırırken hala görünecek. Yüzen kartı nasıl görüntüleneceğiniz ve ortaya çıkaracağına dair ipuçları bile vereceğiz.
Haydi Yapalım şunu. Aşağıdaki gizlice göz atma, bu öğreticide yapacağımız tasarımın bir bakış. Bu öğreticiden bir tasarım almak için düzeni ücretsiz indirin, önce aşağıdaki düğmeyi kullanarak indirmeniz gerekir. İndirmelere erişmek için, aşağıdaki formu kullanarak Divi Daily E -posta listemize abone olmanız gerekir. Yeni bir müşteri olarak, her Pazartesi daha fazla Divi’nin iyi ve ücretsiz Divi düzen paketleri alacaksınız! Zaten listede iseniz, e -posta adresinizi aşağıya girin ve İndir’i tıklayın. “Abone olmayacak” veya ek e -postalar almayacaksınız.
Dosyayı indir
YouTube kanalımıza abone olun
Parçanın düzenini Divi kütüphanenize aktarmak için aşağıdaki adımları izleyin:
Divi kütüphanesine gidin.
İçe Aktar düğmesini tıklayın.
Taşınabilirlik açılır penceresinde İçe Aktarma sekmesini seçin.
Bilgisayarınızdan indirme dosyasını seçin.
Ardından İçe Aktar düğmesini tıklayın.
Bittiğinde, parçanın düzeni Divi Builder’da mevcut olacak. Doğrudan öğreticiye mi gidiyorsunuz? Bu tasarımı Divi’de yapmaya başlamadan önce başlamanız gereken şey, aşağıdakileri yapmanız gerekir: Yeni bir sayfa oluşturun ve sayfayı ön taraftaki (görsel yapımcı) düzenlemek için Divi Builder’ı kullanın.
“Önceden Yapılmış Düzen Seç” seçeneğini seçin.
Blogger yön sayfasının düzenini arayın ve seçin.
Sayfaya yüklemek için “Bu Düzeni Kullan” düğmesini tıklayın.
Bundan sonra, bu öğretici için kullanılmaya hazır olan hazır bir sayfa düzeniniz olacak. Bir blog kayan kartı nasıl tasarlanır Divi blog modülü kullanarak şimdi sayfada yayınlanan blogger sayfalarının düzeni yaptıktan sonra, blog yayınımızı yüzen bir kart yapmaya hazırız. 5 ana adım içeren bir blog gönderme kartı yapmak: Blog modülü için yeni bir kaplama olarak parça, satır ve sütun oluşturun. Satır/sütuna bir blog modülü ve başlık ekleyin
Sırayı sabit ve özel genişlik konumuna ayarlayın
Minimal içerik ve gölge kutusuna sahip bir blog modülünü güncelleyin
Bir satır kart yapmak Hover’da görünür
Adım 1: Blog modülü için yeni bir kaplama olarak parça, satır ve sütunlar oluşturma, sayfa düzeninin altında yeni bir bölüm oluşturarak başlayalım.
Ardından bu bölüme yeni bir sütun satırı ekleyin.
Adım 2: Burada yeni bir blog modülü oluşturmak yerine satır/sütuna bir blog modülü ve başlık ekleyin, yukarı kaydırma ve mevcut bir blog modülü bulmak üç blog yazısı (sayfanın ortasına üçüncü bölümde) görüntüler. “Diğer Modül Ayarları” nı açın ve “Modül Kopyala” ı seçin.
Ardından, modülü, simgeyi artı gri sağ tıklayarak ve “Modülü Yapıştır” ı seçerek sayfanın altından yaptığımız yeni bir sütun satırına yapıştırın.
Ardından, blog yayın kartında da yüzecek blog yayınımızın üzerindeki başlığı ekleyeceğiz. Bunu yapmak için, mevcut metin modülünü “yaşam tarzı” yazan küçük bir başlık metni ile kopyalayın. Ardından, modülü aşağıda eklediğimiz yeni blog modülünün hemen üzerine yapıştırın. Ardından, görüntülemek istediğiniz blog yayınının türünü tanımlamak için başlık metnini değiştirin. Bu örnekte, sadece “en popüler” i kullanacağız. Adım 3: Satırı sabit ve özel genişliğe göre ayarlayın Blog kartpostalını, sabit bir konuma sahip olduklarında sayfada fazla yer kaplamayacak şekilde daha küçük hale getirmek istiyoruz. Bu can sıkıcı olacak. Bunu yapmak için çizgi ayarlarını açın ve aşağıdakileri güncelleyin: Yüzen bir kart yapmak için sabit bir konum hattı vermemiz gerekir. Gelişmiş sekmesi altında aşağıdakileri güncelleyin: Pozisyon: Sabit Konum: Alt Sağ Dikey ofset: 20pxYatay ofset: 20px
Dizin Z: 12
Bir blog modülünün en az içerik ve kutunun gölgesine sahip güncellenmesi, blog modülü zaten üç sütunun düzeni ve tasarım paketi tasarımına dahil olan iyi bir stile sahiptir. Ama yapmamız gereken bazı şeyler var. İlk olarak, daha küçük (dikey) bir kart yapmamız gerekiyor, birkaç içerik unsuru yayınlamamız gerekiyor. Bunu yapmak için blog ayarlarını açın ve üstün görüntüler dışındaki tüm öğeleri gizleyin. Bu, onu yalnızca üstün görüntü ve başlığı görüntüleyen bir gönderi yapacaktır.
Tasarım sekmesinin altında, blog kartında aşağıdaki gibi bir gölge verin:
Gölge Kutusu: Ekran yakalamaya bakın Bulanık Güç Gölgesi Kutusu: 28px Gölge Rengi: RGBA (0.0,0,0.19)
Aşağıdaki önizleme, şimdiye kadarki nihai sonuçların bir önizlemesidir. Bir satır kart yapmak son adım olarak Hover’da görünür, kullanıcıları yüzen kartlarla etkileşim kurmaya çeken iyi bir havalı efekti ekleyebiliriz. Bunu yapmak için Divi Transform ve Hover seçeneğini kullanabiliriz. Satır ayarlarını açın ve aşağıdaki dönüşüm seçeneklerini güncelleyin: Masaüstü için
Dönüşüm Y eksenini çevirin:% 50
Durum için yönlendirilmiş Dönüşüm Y eksenini çevirin:% 0
Tabletler (ve telefon) için
Dönüşüm Y eksenini tercüme eder:% 0, tarayıcı görünüm alanı dışındaki tüm kart hattını ilk başta% 50 taşır.Kullanıcı imleci satıra yönlendirdikten sonra, kart hattı tamamen görülür ve kullanıcıların okumak istedikleri gönderiyi tıklamasına izin verir.Bir blog girişi görüntülemek istemediğiniz sürece cepte satırları gizlemek, bu blog girişini mobil cihazlarda görüntülemek mantıklı değildir.Belki çok fazla yer kaplayacak ve kaydırmaya çalışırken sorunlara neden olacaktır.Kartı bir cep telefonuna gizlemek için bölüm ayarlarını açın ve cep telefonu ve tablet üzerindeki parçaların görünürlüğünü devre dışı bırakın.
Son zihnin nihai sonuçları, yorumlarda sizden haber almayı umuyorum.Kızarmış ekmek!