Wix Editör: Hover Kutusu Ekleme ve Kurma

4 dakikalık okuma
Sitenizin ziyaretçileri için havalı ve interaktif bir hover kutusu ekleyin.
Hover kutuları ziyaretçiler üzerine geldiğinde değişerek farklı ögeler ve içerikler gösterir. Ayrıca ziyaretçilerinizi daha da etkilemek ve sitenizi keşfetmeye devam etmeleri için onları teşvik etmek üzere ögelere animasyon ekleyebilirsiniz.

1. Adım | Sitenize hover kutusu ekleyin

Göz alıcı sayfalar oluşturmaya başlamak için bir hover kutusu ekleyin. Birçok eğlenceli, renkli şablon mevcuttur. Böylece sitenizin görünümüne ve temasına uygun bir şablon seçebilirsiniz.

Hover kutusu eklemek için:

  1. Editörünüze gidin.
  2. Sol çubuktaki Öge Ekle simgesine  tıklayın.
  3. Kutu seçeneğine tıklayın.
  4. Üzerinde Gezinme Kutuları seçeneğine tıklayın.
  5. Seçtiğiniz kutuya tıklayıp bu kutuyu sürekleyerek sayfaya ekleyin. 
wix editor'deki öge ekle panelinin ekran görüntüsü. seçeneklerin görüntülendiği kutu.

2. Adım | Hover kutunuza öge ekleme

Ziyaretçilerinize ilgili bilgileri ve içerikleri göstermek için kutunuza ögeler ekleyin. Normal mod, hover modu veya her ikisi için farklı ögeler ekleyebilirsiniz.
Her iki görünüme de bir öge eklemek için ögenizi Normal modda eklemeniz yeterlidir. Bir ögeyi sadece Normal modda görüntülemek için ögeyi ekleyin ve Hover modunda gizleyin.
Bir ögeyi sadece Hover modunda göstermek için ögeyi Hover modunda ekleyin.

Hover kutunuza öge eklemek için:

  1. Hover kutunuza tıklayın.
  2. Ögeyi eklemek istediğiniz moda göre Normal veya Hover sekmesine tıklayın:
    • Normal: 
      • Editör'ün sol çubuğundaki Ekle 'ye tıklayın.
      • Seçtiğiniz ögeye tıklayıp bu ögeyi sürükleyerek kutunuza ekleyin.
    • Hover:
      • Editör'ün sol tarafındaki Üzerinde Gezinmeye Ekle'ye tıklayın.
      • Seçtiğiniz ögeye tıklayıp bu ögeyi sürükleyerek kutuya ekleyin.
Wix Editor'da Normal ve Üzerindeyken seçeneklerinin vurgulandığı bir kutucuğun ekran görüntüsü.
Not:
Normal görünümde bir düğme eklerseniz, bu düğmenin tasarımını hover modunda düzenleyemezsiniz. Buna bir çözüm olarak düğmeyi hover görünümde gizleyip yeniden ekleyebilir ve ihtiyaçlarınıza uygun olacak şekilde tasarlayabilirsiniz.

3. Adım | Kutu tasarımını özelleştirin

Hover kutunuzu tam istediğiniz gibi görünecek şekilde özelleştirebilirsiniz. Seçtiğiniz kutu tasarımına bağlı olarak dolgu, kenarlık ve köşeler gibi ayarları sitenizin ihtiyaçlarına uygun olacak şekilde düzenleyebilirsiniz. 

Kutu tasarımını özelleştirmek için:

  1. Tasarım sekmesine tıklayın.  simge.
  2. Tasarımı Değiştir seçeneğine tıklayın.
  3. (İsteğe bağlı) Üstten farklı bir hazır tasarım seçin.
  4. Şu sekmelerden birini seçerek ayarları düzenleyin:
    • Dolgu Rengi ve Saydamlığı: Bir arka plan rengi seçin ve  kaydırıcıyı sürükleyerek saydamlığını ayarlayın.
    • Kenarlık: Kenarlığın saydamlık, renk ve genişlik ayarlarını yapın.
    • Köşeler: Kutuları kullanarak kutunun köşelerinin piksel boyutunu ayarlayın.
    • Gölge: Gölgeyi etkinleştirin veya devre dışı bırakın ve gölgenin açısını, mesafesini, boyutunu, bulanıklığını, rengini ve saydamlığını ayarlayın.
Üzerinde gezinme kutusu tasarım panelinin ekran görüntüsü. renk ve opaklık kaydırıcısı gösteriliyor.

4. Adım | Hover kutunuza efekt ekleyin

Efektler Hover Kutularınıza canlılık katar. Mevcut seçeneklerle hem göz alıcı hem de eğlenceli bir efekt oluşturabilirsiniz.
Ayrıca efekti özelleştirerek sitenizle ve hover kutunuzla uyumlu hale getirebilirsiniz.
wix editor'deki kutu efektleri ayar paneli

Efekt eklemek ve efekti özelleştirmek için:

  1. Hover kutunuza tıklayın.
  2. Üzerinde Gezinme sekmesine tıklayın.
  3. Efekti Seç'e tıklayın.
  4. Efekt ayarlarını düzenlemek için Özelleştir seçeneğine tıklayın.
Efekti nasıl özelleştirebileceğiniz hakkında daha fazla bilgi edinmek için aşağıdaki seçeneklerden birine tıklayın.

Bu içerik yardımcı oldu mu?

|