Wie erstellt man ein Logo in Wix, dass die Farbe ändert, wenn man mit der Maus darüberfährt? Die Hover Funktion Einstellung gibt es bei Wix Logos leider nicht standardmässig.

Animationen auf Webseiten

Animationen können eine Webseite lebendiger erscheinen lassen und werden bewusst dazu eingesetzt Aufmerksamkeit zu erregen. Beim Einsetzen von Hover Animationen bei Logos wird die Navigation für den Besucher vereinfacht, denn durch den Effekt wird angezeigt, dass das Element anklickbar ist. Dadurch verbessert sich ebenso die User Experience deiner Webseite.

Mouseover Logo in Wix

Um ein Logo mit Hilfe der Mouseover Box in Wix zu erstellen, solltest Du dein Logo zweimal in der Wix Mediathek einfügen – einmal als dein normales Logo und einmal mit den Farben, die das Logo beim Mouseover anzeigen soll. Das heisst, du brauchst zwei Logos in zwei unterschiedlichen Farben.

1. Füge deiner Webseite eine Mouseover Box hinzu, indem du auf das unter + / Box / Mouseover Boxen auswählst

Um deinem Logo den Effekt hinzuzufügen, wähle die Box aus, die deinem Logo am ähnlichsten ist. Ist dein Logo rund, wähle eine runde Mouseover Box aus.

2. Lösche den Inhalt der Mouseover Box den du nicht benötigst, auch den Hintergrund.

3. Füge dein Logo der Standardansicht über  + / Bild / meine Daten hinzu. Je nach Mouseover Box, die du ausgewählt hast, kann es sein, dass du bei der Standardansicht dein Logo als Vektorgrafik (.svg) einfügen musst.

4. Klicke jetzt auf den Reiter „Mouseover“.

5. Füge das Logo ein, das beim darüberfahren erscheinen soll.

6. Achte darauf, dass das Mouseover Logo nun direkt über dem ursprünglichen Logo liegt.

7. Lösche das ursprüngliche Logo aus der Mouseover Ansicht.

8. Teste dein Mouseover Effekt über die Vorschau.

9. Passe die Grösse des Logos deinem Header an und füge es dort hinzu.

10. Texte, ob sich bei der Grössenänderung nichts verschoben hat.

Das Video zum Blogbeitrag:

For the photographer template, I wanted to add a kind of creative twist to the website. Instead of sticking to the most common horizontal menu, I was looking for a vertical menu.

Because it makes a difference what kind of photographer the client is, the vertical menu allows adding as many menu items as needed. A portrait photographer may only need a portfolio and contact page, while a travel photographer may need to add the different countries travelled to as sub-items.

How can I add a vertical menu to WIX?

2. Click on Menu.

3. Click on Vertical Menus.

4. Click or drag your selected menu to add it to your website.

Customizing the Menu Design

Click on the Layout Menu to adjust the text of each menu item. Should text be displayed on the left, in the middle or on the right side?

The Design Icon allows you to adjust the colours, shadows, opacity and borders.

How do I add a Lightbox as a menu

Click + Add in the editor on the left, then Interactive. S

Select a Lightbox template from Welcome or Subscribe.

Customizing the Pop-up Menu Design

To be able to close the Lightbox keep the „X“ and don’t delete it.

Add a Vertical Menu to your Lightbox and adjust the design.

The Lightbox Layout allows you to position the Lightbox on the left or right side.

Customize the background with the Design Icon.

Do you want to go back to a previous version of your website because you made accidentally changes on your site? WiX has created the site history feature, which automatically creates site revisions every time you save or publish.

How to manage your site history?

If you want to access your site history from the Editor, follow the 7 steps:

1. Click Site from the top bar of the Editor.

2. Click Site History.

3. Click See your Site History.

4. Click the Arrow icon next to the relevant revision.

5. Make sure that you are going to restore the version you wanted.

6. Click Restore.

7. Start editing the restored site again.