Wie wird eine Navigation und Fusszeile für alle Seiten mit Elementor erstellt?

Wie wird eine Navigation und Fusszeile für alle Seiten mit Elementor erstellt?

Wie wird ein Global Footer mit Elementor in WordPress erstellt?

Wie erstellt man eine Navigation und Fusszeile in WordPress mit Hilfe von Elementor, sodass alle Seiten gleich aussehen? Viele kennen dies auch unter dem Ausdruck „Global Footer“ oder „Global Header“.

Anlegen eines Global Headers und Footers

Um die Navigation und Fusszeile auf allen Seite gleich aussehen zu lassen, muss dieser in Elementor als „Global“ angelegt werden. Dazu öffnet man im Dashboard Elementer den darunter liegenden Ordner „Templates“ -> Theme Builder und legt den gewünschten Header und Footer dort an.

Beim Speichern des Templates oder der Vorlage hast du die Möglichkeit eine Bedingung hinzuzufügen. Hier sollte die Bedingung so eingestellt werden, dass die Vorlage auf allen Seiten deiner Webseite angezeigt werden soll.

Theoretisch kann man die Fusszeile und Navigation in einer Vorlage anlegen. Empfehlenswert ist es jedoch, diese separat anzulegen, da es durchaus vorkommen kann, dass entweder eine andere Navigation angezeigt werden oder die angelegte Navigation von einzelnen Seiten ausgeblendet werden soll. Dies ist z.B. bei Leadpages der Fall.

Je nachdem, wie Ihr Elementor und die jeweiligen Vorlagen angelegt habt, ist der Zugang ein etwas anderer. Wer sich mit Videos leichter tut, dem füge ich das Video von Elementor mit ein.

 

Video von Elementor:

Signature

Wie ein Logo mit Mouseover Effekt in Wix erstellt wird

Wie ein Logo mit Mouseover Effekt in Wix erstellt wird

Mouseover Logo in Wix

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:

Signature