Divi eklentisi spot ışığı – divi modülü freze bulanıklığı
Blurb, Divi düzeninde popülerdir. Ürün ve hizmetleri görüntülemek için çok iyi olan metin, resimler, simgeler ve daha fazlasını görüntüler. Ya daha belirgin olmalarını ve bazı ilginç yüzen animasyonlar sağlamalarını istiyorsanız? Genel animasyon CSS aracılığıyla yapılabilir, ancak farklı bir şey istiyorsanız? Tilt Blurb Divi modülü adı verilen bir eklenti belki arıyorsunuz. Modül öğütme bulanıklığı nedir? Tilt Blurb modülü, Divi oluşturucuya (divi ve ekstra için) yeni bir bulanıklık modülü ekleyen ve ilginç bir eğimli efekt ekleyerek bir 3D ekran oluşturan üçüncü taraflı bir eklentidir. Bu eklentinin spot ışığında modülü göreceğiz ve ne yapabileceğini göreceğiz. Birkaç GIF gösterdim ama çoğu GIF dosya boyutu nedeniyle resim olacak. Unssplash.com ve wordpress.org’dan alınan örnekler için görüntüler.
Divi Modül Modülünün Kurulumu Eksik Blurb
İçerik – metin, bağlantılar, resimler ve simgeler, arka plan, yönetici etiketi
Eğim Düzenlemesi – Eğim, Eğim Arka Planı, Eğim Katmanı
Tasarımlar ve görüntüler ve simgeler, metin, başlık metni, içerik metin, sınırlar, boyut, sürdürülebilirlik – ID ve Sınıf CSS, Özel CSS, animasyon, görünürlük
Bu örnek için eğim ayarı bir arka plan ekliyorum ve daha sonra bir 3D efekt oluşturmak için üzerindeki ön arka plan olarak daha küçük bir görüntü yerleştiriyorum. Ve sonra kahve yap. Çok kahve. Varsayılan ayarlarla örnek
Aşağıda, ayarlamadan önce bir 3D eğim ekranı örneğidir. Başlık, metin, arka plan ve simgeyi ekledim. Eğim faremi takip eder ve metni ve simgeleri görüntüden ayırır, böylece 3D ekran verir. Benim için paralaksın etkisi arka planı ortadan kaldırıyor, bu yüzden kullanmam. Görüntülerle Boyut
Bu, gizli görüntülerin kullanılması ve odaklama içeriğinin açıklamasını ölçer. Yüzen içerikli 2 resim ile bulanıklığın boyutu Bu, biri ön ve diğeri arka plan için iki resim içerir. 3D’deki ilk arka plan görüntüleri ve metin Float İçeriği özelliğini kullanın. Ön arka plan içeriğini okuyucuya getirerek zoom gibi işlev gören şamandıraların sayısını ayarlayabilirsiniz. Bu resim, maksimize edilen şamandıra sayısı için 200 kullanır. Eğik miktar Eğim kayması, görüntünün ne kadar eğileceğini kontrol etmenizi sağlar. Varsayılan ayar 20’dir. Bu 100 kullanır. Eğimli bakış açısı
Eğim perspektifi derinleştirme perspektifi. Sayı ne kadar düşük olursa, perspektif o kadar derin olur. Standart 1000’dir. Bu örnek 200. Eğimli ölçek Eğim ölçeği zum seviyesidir. Varsayılan 1.1’dir, yani görüntüyü yönlendirirken 1.1 ile çarpılır. Bu örnek 2’dir. Bu 0’a gider, ancak Seviye 0, bu resim için çalışmayan sürekli olarak ileri geri zum sağlar. Belki istediğiniz şeyi yapması için bazı deneylere ihtiyacınız var. Hız Hızı Hız İmleçini yönlendirdiğinizde hareketli görüntünün hızını kontrol eder. Sayı ne kadar düşük olursa o kadar hızlı hareket eder. Standart 100’dür. Bu 5000’dir. Yavaş etkiyi sevmiyorum. Baş aşağı eğil Eğimi ters değiştirdi eğimi değiştirdi. Genellikle eğim fareden uzaklaşır. Fareye doğru eğimli görüntüleri tersine çevirin. Parlama eğimi
TILT GLARE, fareyi takip eden parlama etkisini ekler. Parlama miktarı ayarlanabilir. Yukarıdaki resim, varsayılan ayarlar olan .8’i kullanır. Bu, aydınlatma efektleri oluşturmak için iyidir. Sınır yarıçapı Sınır yarıçapı sınır şeklini değiştirir. Standart 40’dır. Bu, maksimum miktarda 100 olarak düzenlenmiştir. Arka plan eğildi
Eğim arka planı, arka plan rengini ve sınır efektlerini ayarlamanızı sağlar. Arka plan eğildi
Eğim arka plan renginin yan etkilerinden biri, görüntünün etrafında iyi bir ışık yaratmasıdır. Eğikin arka plan rengini, sınır genişliğini, arka plan sınırı kuvvetini, sınır genişliğini ve sınırın rengini ve kutunun gölgesini ayarlayın. Arka plan mesafesi Eğimin arka plan mesafesi gölge mesafesini ayarlar. Bu varsayılan olarak 50 tarafından düzenlenir. Bu örnek -25 kullanır. Bu örnek, arka planın üzerinde bir gerilme yaratan eğim 0 ve opaklık 0.3’ün arka plan mesafesi kullanır. Boyut/arka plan ölçeğini eğin Eğim arka plan boyutu/ölçek eğimin arka plan mesafesini değiştirin. Standart 1.04’tür. Bu 1.2. Lops Eğim katmanları aynı görüntüyü birkaç katmanla tekrar tekrar uygulayarak sağlam bir 3D efekt oluşturur. Görüntüleri veya arka plan renklerini kullanabilir ve katmanın derinliğini ayarlayabilirsiniz. Yukarıdaki resmi katman 50 derinliği ile uyguladım. Uyguladığım resim burada bir sınır olarak görülüyor. Görmeyi kolaylaştırmak için eğim sayısını ayarladım.Beklendiği gibi, görüntünün tabanı farklı görünüyor. Bu, sınıra biraz doku eklemenin iyi bir yoludur. Daha küçük tabakanın derinliği sınır daha ince hale getirecektir. Bu, katman 10 derinliğini kullanır. Bu örnek bir eğim arka planı ve eğim katmanı kullanır. Aşağıda kristallere sarılmış görünen 3D WordPress logosudur. Logoyu görüntü alanına ve simgesine yükledim, eğim sayısını 100’e ayarladım, varsayılan eğimi kullanarak, logoyu eğim katmanının altındaki katman görüntüne ekledim, katman 50’nin derinliğini ayarladım ve katman beyaz ve neredeyse tamamen şeffaf olacak. Renk katmanı olmayan aşağıdaki logo. Kenarları görmek daha zor. Eklentinin lisansları, desteği ve belgeleri, siz ve müşterileriniz için sınırsız web sitelerinde kullanılabilir. Buna 6 aylık destek dahildir. Belgeler geliştirici web sitesinde verilmektedir. Bu, web sitesinde görüntülenen bazı örneklerin nasıl yapılacağına dair talimatlar içerir. Logonun nasıl yapıldığı gibi daha fazla örnek görmek istiyorum.
