[Ad_1]
Gidelim.
anket
Öğreticiye dalmadan önce, farklı ekran boyutlarındaki sonuca hızlıca bir göz atalım.
ofis
Telefon
Düzeni ÜCRETSİZ indirin
Ücretsiz düzene sahip olmak için önce aşağıdaki düğmeyi kullanarak bunları indirmeniz gerekecek. İndirmeye erişmek için Divi Daily posta listemize abone olmanız gerekir. formulaire aşağıda. Yeni bir abone olarak, her Pazartesi daha da fazla Divi avantajı ve ücretsiz bir Divi Düzen paketi alacaksınız! Zaten listedeyseniz, aşağıya e-posta adresinizi girin ve indir'i tıklayın. "Yeniden abone olmayacaksınız" veya ek e-posta almayacaksınız.
Yeniden yaratmaya başlayalım!
2x yer tutucu bölüm ekleyin
Yeni bölüm ekle
Üzerinde çalıştığınız sayfaya bir yer tutucu bölüm ekleyerek başlayın.
boyutlandırma
Bölüm ayarlarını açın ve boyutlandırma ayarlarında yüksekliği değiştirin.
Klon bölümü
Bölümü bir kez klonlayın. Bu size sayfanızda iki yer tutucu bölüm bırakır. Bu yer tutucu bölümler, öğreticiyi tamamladıktan sonra nihai etkiyi görmenize yardımcı olacaktır. Canlı bir web sitesinde yer tutucu bölümler, sayfa boyunca kullandığınız normal bölümlerle değiştirilecektir.
Yer tutucu bölümler arasına yeni bölüm ekle
Yer tutucu bölümler yerleştirildikten sonra, yer tutucu bölümler arasına yeni bir bölüm ekleyin.
Arka plan rengi
Bölüm ayarlarını açın ve beyaz bir arka plan rengi kullanın.
- Arka Plan Rengi: #ffffff
aralık
Bölüm tasarım sekmesine geçin ve üst ve alt dolgu değerlerini buna göre değiştirin:
- Üst dolgu: 10vh
- Alt dolgu: 10vh
1 numaralı satırı ekleyin
sütun yapısı
Aşağıdaki sütun yapısını kullanarak bölüme yeni bir satır ekleyerek devam edin:
boyutlandırma
Henüz herhangi bir modül eklemeden satır ayarlarını açın, boyutlandırma ayarlarına gidin ve maksimum genişlik ve genişlik değerlerini değiştirin.
- Genişlik: %100
- Maksimum genişlik: %100
Sütuna metin modülü ekleme
Bir kopya ekle
Bu satır için ihtiyacımız olan tek modül bir metin modülüdür. Seçtiğiniz bir kopyasını ekleyin.
Metin ayarları
Modül tasarımı sekmesine geçin ve metin ayarlarını buna göre değiştirin:
- Metin yazı tipi: Montserrat
- Metin Yazı Tipi Ağırlığı: Ultra Kalın
- Metin yazı tipi stili: büyük harf
- Metin rengi: # fff2ea
- Metin Boyutu: 11vw
- Metin satırı yüksekliği: 1 em
- Metin hizalama: Orta
2 numaralı satırı ekleyin
sütun yapısı
Aşağıdaki sütun yapısını kullanarak bölüme başka bir satır ekleyin:
boyutlandırma
Henüz herhangi bir modül eklemeden satır ayarlarını açın ve boyutlandırma ayarlarını aşağıdaki gibi değiştirin:
- Özel oluk genişliği kullanın: Evet
- Oluk genişliği: 2
- Genişlik:% 90
- Çizgi hizalama: Merkez
Sütuna resim modülü ekle
Bir resim yükle
Satır sütununa bir görüntü modülü ekleyin. Seçtiğiniz bir resmi yükleyin.
hizalanma
Modül tasarımı sekmesine geçin ve görüntü hizalamasını buna göre değiştirin:
boyutlandırma
Ardından boyutlandırma ayarlarına gidin ve modülü tam genişliğe zorlayın.
Kolona bir düğme modülü ekleyin
Bir kopya ekle
Sütuna ekleyeceğimiz sonraki ve son modül bir düğme modülüdür. Seçtiğiniz bir kopyasını kullanın.
Düğme hizalaması
Tasarım sekmesine gidin ve düğme hizalamasını değiştirin.
Düğme ayarları
Ardından düğmeyi aşağıdaki gibi biçimlendirin:
- Düğme için özel stiller kullan: Evet
- Düğme Metin Boyutu: 16px
- Düğme Metin Rengi: # 000000
- Düğme arka plan rengi: #ffffff
- Düğme kenarlık genişliği: 0px
- Düğme harf aralığı: 2px
- Düğme yazı tipi: Montserrat
- Düğme yazı tipi ağırlığı: kalın
- Düğme yazı tipi stili: büyük harf
aralık
Ayrıca boşluk ayarlarında özel dolgu değerleri kullanın.
- Üst dolgu: 20 piksel
- Alt dolgu: 20px
- Sol dolgu: %5
- Sağ dolgu: %5
1. satıra mutlak konumlandırma ekle
İkinci satırı tamamladıktan sonra 1 numaralı satıra dönün. Satır ayarlarını açın, gelişmiş sekmesine gidin ve bölümü mutlak yapın. Bunu yaparak, satır ve içindeki metin modülü, görüntü modülünü içeren satırın altına yerleştirilecektir.
- Pozisyon: Mutlak
- Yer: Merkez
1 numaralı satırı klonlayın ve kopyayı n ° 2 satırının altına yerleştirin
Metin modülünün görüntünün üzerinde görünmesine izin vermek için daha yüksek bir z-endeksi değerine sahip başka bir satıra ihtiyacımız olacak. İlk satırı klonlayın ve kopyayı ikinci satırın altına yerleştirin.
3. satıra efekt uygula
Z indeksini artır
Yinelenen satırı açın ve gelişmiş sekmesinde z dizinini değiştirin.
Metin rengini değiştir
Satırdaki metin modülünü açın ve metin rengini değiştirin.
Çizgiye karışım modunu uygula
Ardından satır ayarlarını açın ve filtre ayarlarında karışım modunu değiştirin.
3. satırdaki metin modülünde kaydırma efektini kullanın
Bir solma ve solma efekti ekleyin
Metin bölmesini yeniden açarak, kaydırma efektlerine giderek ve solma ve kararma efektini açarak öğreticiyi tamamlayın. Bu kadar!
- Azalmayı ve kararmayı etkinleştir: Evet
- Başlangıç opaklığı: %0
- Orta opaklık: %0 (%26'ya kadar)
- Nihai opaklık: %100 (%28'de)
- Hareket Efekti Tetikleyicisi: Elemanın Ortası
anket
Artık tüm adımları attığımıza göre, farklı ekran boyutlarında sonuca son bir göz atalım.
ofis
Telefon
Son düşünceler
Bu makalede, Divi'nin yerleşik kaydırma efektleriyle nasıl yaratıcı olabileceğinizi gösterdik. Özellikle, kayan kopyayı nasıl karıştıracağınızı gösterdik. İlk başta, kopya görüntünün altında görünüyor. Kaydırdıktan sonra, kopya görüntünün üzerinde gösterilir ve görüntüyle birleşir. Ayrıca JSON dosyasını ücretsiz olarak indirebildiniz! Herhangi bir sorunuz veya öneriniz varsa, aşağıdaki yorumlar bölümünde yorum bırakmaktan çekinmeyin.
Divi hakkında daha fazla bilgi edinmek ve daha fazla ücretsiz Divi almak istiyorsanız, sitemize abone olmayı unutmayın. bülten e-posta yoluyla ve bize YouTube kanalı böylece her zaman bu ücretsiz içeriği ilk öğrenen ve faydalanan kişilerden biri olursunuz.
[Ad_2]
