Wix Editör: Hover Kutusu Ekleme ve Kurma

3 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. Düzenleyicinin sol tarafındaki Ekle paneline tıklayın.
  2. Kutu seçeneğine tıklayın.
  3. Üzerinde Gezinme Kutuları seçeneğine tıklayın.
  4. Seçtiğiniz kutuya tıklayıp bu kutuyu sürekleyerek sayfaya ekleyin. 

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 seçeneğine 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
      • Seçtiğiniz ögeye tıklayıp bu ögeyi sürükleyerek kutuya ekleyin.
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 simgesine  tıklayın.
  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.

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.

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?

|