So erstellen Sie mit Elementor eine vollständig benutzerdefinierte Website-Fußzeile

So erstellen Sie mit Elementor eine vollständig benutzerdefinierte Website-Fußzeile

Haben Sie sich jemals gefragt, wie Sie Ihre eigene Website-Fußzeile erstellen und anpassen können, ohne eine einzige Codezeile zu berühren? 

Klingt wie ein Märchen, oder? Nun...diesmal wird die Geschichte Wirklichkeit! ✨

Mit dem beliebtesten Seitenersteller Elementor erhalten Sie die volle Flexibilität, eine prominente Fußzeile zu erstellen. 

Als 66% Webbesucher Um tatsächlich unterhalb der Falte zu wandern, muss der Fußzeilenbereich für den Benutzer interaktiv sein. Andernfalls verlieren Sie im Handumdrehen einen großen Teil Ihrer Kunden.

Aber seien Sie noch nicht paranoid! In diesem Artikel zeigen wir Ihnen, wie Sie mit Elementor effektiv eine vollständig benutzerdefinierte Website-Fußzeile für Ihre Website erstellen können! 🙌

Also, legen wir los! 

Warum ist die Fußzeile wichtig?

Wussten Sie, dass Sie Ihren Umsatz steigern können? Geschäft um etwa 16% einfach durch das Hinzufügen einer leicht navigierbaren Fußzeile?

Neben der enormen Benutzereinbindung ist es auch für SEO äußerst effektiv. Es verbessert die interne Verlinkungsstruktur und macht die Navigation reibungsloser als je zuvor.

Glücklicherweise können Sie alle diese Funktionen nutzen, indem Sie einfach eine auffällige Fußzeile hinzufügen, die die internen Links als Site-weite Links oder Standard-Links enthält.

Aber enthält eine Fußzeile nur Links? 🤔

Nein…❗

Sie können Ihre hinzufügen Produktdemos, Abonnement-Buttons oder Kontaktformulare zu! So können Ihre Kunden nicht nur bequem auf Ihrer Website surfen, sondern sich auch ein klares Bild von Ihren Produkten machen.

Ziemlich beeindruckend, oder?

Festhalten! Hier ist ein weiterer Bonus-Fakt speziell für Sie!

Vergessen Sie nicht, neben all diesen Funktionen auch eine hinzuzufügen auffälliger CTA-Button! So werden die Nutzer beeindruckt sein und zu Ihren echten Kunden werden.

Es ist eine Win-Win-Situation für beide, oder?

Entdecken Sie, wie Sie den Fußzeilenbereich gestalten und wie er Ihrer Marke zugute kommen kann, indem er das Erlebnis Ihrer Besucher mit Elementor verbessert.

Dinge, die Sie zu den Fußzeilen Ihrer Website hinzufügen müssen

Hier sind die Hauptelemente eines guten Website-Fußzeilendesigns. Ich werde versuchen, alle Abschnitte abzudecken, die Sie selbst erstellen und anpassen können. 

  1. Logo
  2. Firmeninfo 
  3. Kontaktdetails
  4. Navigation
  5. Unterstützung
  6. Urheberrecht, Nutzungsbedingungen, Datenschutzbestimmungen
  7. Social-Media-Symbole
  8. Aufruf zum Handeln
Hinweis: Übertreiben Sie das Design Ihrer Website-Fußzeile nie und versuchen Sie, sie so einfach wie möglich zu halten.

Was Sie benötigen, um mit Elementor benutzerdefinierte Fußzeilen zu erstellen

Um diesem Tutorial-Blog zu folgen, benötigen Sie zwei Dinge–>

Und fertig!

Warum Elementor & ElementsKit? 

Wenn Sie Probleme beim Entwerfen Ihrer Webseite mit viel Code und dergleichen haben. Keine Sorge! Ihr leistungsstärkster Seitenersteller Elementor ist da! 

Genießen Sie die vollständige Drag-and-Drop-Kontrolle über die Fußzeile Ihrer Website. Elementor ist die beste Wahl, wenn Ihnen das Aussehen Ihrer aktuellen Fußzeile nicht gefällt. 

Elementor enthält nützliche Add-ons, mit denen Sie Ihre Website ganz einfach anpassen können. ElementsKit ist das beliebteste unter ihnen mit einem leistungsstarken Fußzeilen-Builder, über 85 Widgets und einem vorgefertigten Fußzeilenlayout zur Verbesserung Ihres Designs. 

Hier in diesem Tutorial erfahren Sie, wie Sie mit ElementsKit eine schöne benutzerdefinierte Elementor-Fußzeile erstellen! 

Also lasst uns anfangen.

So erstellen Sie mit Elementor eine vollständig benutzerdefinierte Website-Fußzeile

In diesem Abschnitt zeigen wir, wie Sie mit nur wenigen Schritten eine benutzerinteraktive Fußzeile für Ihre Website anpassen oder erstellen können!

Schritt->1: Fußzeile hinzufügen

Um mit Elementor eine vollständig benutzerdefinierte Website-Fußzeile zu erstellen, melden Sie sich zunächst im Admin-Dashboard-Panel Ihrer Website an. 

  • Navigieren Sie zu ElementsKit Meine Vorlagen 
  • Klicken Neue hinzufügen

Es öffnet sich ein Popup-Fenster mit Optionen.

Schritt->1: Fußzeile hinzufügen

Schritt->2: Wählen Sie Fußzeilenoptionen

  • Geben Sie dann im Popup-Feld a ein Titel. Zum Beispiel: Benutzerdefinierte Fußzeile
  • Wählen Sie den Typ → Fusszeile
  • Wählen Sie die Bedingungen → Ganze Seite
  • Schalten Sie die um Aktivierungsoption 
  • Klicken „Mit Elementor bearbeiten“

Es öffnet sich eine Editor-Seite. Hier können Sie das Aussehen Ihres Fußzeilenbereichs gestalten

Schritt->2: Wählen Sie Fußzeilenoptionen

Schritt->3: Wählen Sie ein Web-Footer-Design

Sie können mit der Erstellung Ihrer Website-Fußzeile von Grund auf beginnen oder eine unserer zuvor erstellten Fußzeilen als Ausgangspunkt auswählen.

  • Um die Fußzeile einer Website zu gestalten, müssen Sie auf klicken Ausgewähltes Symbol -> Gehe zum Registerkarte „Fußzeile“.
  • Klicken Sie einfach auf Schaltfläche „Einfügen“. hinzufügen und fertig! 
Schritt->3: Wählen Sie ein Fußzeilendesign

Schritt->4: Richten Sie das allgemeine Layout ein

Wählen Sie in dieser Einstellung die aus Art des Layouts Sie möchten eine benutzerdefinierte Fußzeile erstellen.

  • Klicken Sie auf die Schaltfläche „Hauptanpassung“: Um den Abschnitt „Layout“ in der Seitenleiste Ihres Fußzeilenteils zu bearbeiten.
  • Abschnitt „Strecken“ aktivieren: Dehnen Sie den Abschnitt mit JS auf die volle Breite der Seite.
  • Inhaltsbreite festlegen: Wählen Sie aus dem Dropdown-Menü die Breite des Inhalts in Box oder in voller Breite aus. Steuern Sie es auch durch einfaches Ziehen. 
  • Wählen Sie Spaltenabstand: Wählen Sie „Schmal“, „Erweitert“, „Breit“, „Breiter“.
  • Höhe anpassen: Wählen Sie „An Bildschirm anpassen“ oder „Mindesthöhe“.
  • Wählen Sie „Vertikale Ausrichtung“: Wählen Sie „Oben“, „Mitte“, „Unten“, „Abstand dazwischen“, „Abstand umher“ und „Gleichmäßiger Abstand“.
  • Überlauf: Behalten Sie die Option „Standard“ oder „Ausgeblendet“ bei 
  • Wählen Sie HTML-Tag: Wählen Sie aus der Dropdown-Liste aus
Schritt->4: Richten Sie das allgemeine Layout ein

Sie sollten Ihr Unternehmen in der Fußzeile Ihrer Produktwebsite verlinken, um die Sichtbarkeit in Suchmaschinen zu verbessern. In diesem Fall führt Ihr Firmenlogo die Benutzer zurück zur Startseite, wenn Sie darauf klicken. Und Sie können mit nur einem einfachen Schritt ganz einfach ein Logo hinzufügen. 

  • Klick auf das Logobild→ Laden Sie ganz einfach ein Bild hoch oder wählen Sie aus Ihrer Mediendatei aus.
  • Wählen Sie ganz einfach die aus Bildgröße aus dem Dropdown-Menü
  • Wählen Sie das Ausrichtung links, in der Mitte oder rechts
  • Sie können jede Art von hinzufügen Bildbeschreibung B. eine Anhangsbeschriftung oder eine benutzerdefinierte Beschriftung
  • Wählen Sie das Linktyp Mediendatei oder benutzerdefinierte URL. Sie können eine beliebige Weiterleitungs-URL angeben. 
Schritt->5: Fügen Sie ein Logo hinzu

Schritt->6: Firmenbeschreibung hinzufügen oder bearbeiten

Jetzt ist die Fußzeile Ihrer Website ein Ort, an dem Sie wichtige Informationen anzeigen können. Sie können ganz einfach eine kurze Beschreibung Ihres Unternehmens hinzufügen 

  • In dieser Einstellung können Sie Hinzufügen oder Bearbeiten jede Art von Text 
  • Aktivieren Sie Drop-Cap um einen großen Buchstaben am Anfang des Inhalts anzuzeigen, der auffälliger aussieht. 
Schritt->6: Firmenbeschreibung hinzufügen oder bearbeiten

Schritt -> 7: Fügen Sie die Social-Sharing-Symbole hinzu

Wussten Sie, 72% der Websites verwenden Social-Media-Symbole mit Elementor eine vollständig benutzerdefinierte Website-Fußzeile erstellen?

Nun, das Hinzufügen eines Widgets, das Ihre neuesten Beiträge wie Twitter, Facebook oder Instagram anzeigt, hilft Benutzern, in Verbindung zu bleiben. 

Um Social-Media-Symbole anzupassen und die Social-Sharing-Links zu den Symbolen unten hinzuzufügen. Sie müssen →

  • Klicken Sie auf das soziale Widget, um die sozialen Symbole zu bearbeiten. 
  • Wählen Sie Ihren Stil: Symbol, Text oder beides
  • Wählen Sie Ausrichtungsposition Links, Mitte oder Rechts
  • Klick auf das Facebook-Inhalte erweitern
  • Symbol hinzufügen: Symbol aus Bibliothek hochladen
  • Hinzufügen/Bearbeiten Etikett
  • Bieten Soziale Verbindung
  • Passen Sie das Symbol an sowohl für Normal als auch für Schweben
  • Hinzufügen Hintergrundfarbe
  • Hinzufügen Randtyp: Voll, doppelt, gepunktet, gestrichelt, gerillt
  • Wählen Textschatten: Unschärfe, horizontal, vertikal
  • Wählen Box Schatten: Horizontal, Vertikal, Unschärfe, Ausbreitung
  • Wählen Position: Umriss oder Einschub
Schritt->7: Fügen Sie die Social-Sharing-Symbole hinzu

Schritt->8: Urheberrecht angeben

Ihre Copyright-Informationen sind ein unverzichtbares Element jeder Fußzeile. Denn es ist der beste Weg, Ihre Website vor Plagiaten zu schützen. 

  • Fügen Sie den Inhalt einfach hinzu oder bearbeiten Sie ihn
  • Wählen Sie im Dropdown-Menü „HTML-Tag“ aus 
Schritt->8: Urheberrecht angeben

Schritt->8: Passen Sie die Überschrift „Kontaktinformationen“ an

Gemäß Webdesign-Standards Kontaktinformationen sollte sich rechts oder in der Mitte der Fußzeile befinden. Sie können es jedoch mit wenigen Schritten ganz einfach anpassen.

  • Hinzufügen/Bearbeiten Geben Sie hier Ihren Text für die Kontaktüberschrift ein
  • Bieten Link weiterleiten
  • Wählen Größe, HTML-Tag aus dem Dropdown-Menü
  • Wählen Sie das Ausrichtung links, zentriert, rechts oder Blocksatz
Schritt->8: Passen Sie die Überschrift „Kontaktinformationen“ an

Schritt->9: Firmenstandort hinzufügen 

Der Standort Ihres Unternehmens hilft dabei enorm lokales SEO. So fügen Sie Ihre Firmenadresse hinzu→

  • Wählen Sie das Layout: Standard oder Inline
  • Fügen Sie den Firmenstandort hinzu oder bearbeiten Sie ihn 
  • Laden Sie mit dem Redirect-Link ein beliebiges Symbol aus der Symbolbibliothek hoch
Schritt->9: Firmenstandort hinzufügen 

Erfahren Sie mehr - So fügen Sie Google Maps zu einer WordPress-Site hinzu (der einfachste Weg) 🎉

Schritt->10: CTA-Standort-Schaltfläche

A Studie zeigt das Die beste Option, um Ihren Call-to-Action auf jeder Marketingseite unterhalb des Falzes zu platzieren. Befolgen Sie den Vorgang zum Hinzufügen einer CTA-Schaltfläche zur Anzeige des Unternehmensstandorts→

  • Etikett: Schaltflächentext hinzufügen oder bearbeiten
  • URL: Geben Sie einen Weiterleitungs-URL-Link an
  • Aktivieren Die Symbol hinzufügen eine bereitzustellen Schaltflächensymbol
  • Laden Sie das Schaltflächensymbol von hoch die Icon-Bibliothek oder Sie können es von hochladen Ihre eigene Bibliothek
  • Symbolposition auswählen: Vor Text oder Nach Text
  • Bieten Klassenname oder AUSWEIS
Schritt->10: CTA-Standort-Schaltfläche

Schritt->11: Telefonnummer und E-Mail anpassen

Das Hinzufügen der Kontaktnummer zu Ihrer Website trägt zur Verbesserung der SEO bei. Sorgen Sie dafür, dass Ihre Kontaktnummer anklickbar ist, sodass Besucher zum Anrufen einfach darauf tippen können. Jetzt werden wir die Telefon- und E-Mail-Adresse ändern.

  • Wählen Sie das Layout: Standard oder Inline
  • Fügen Sie die Telefonnummer und E-Mail-Adresse des Unternehmens hinzu oder bearbeiten Sie sie
  • Laden Sie ein beliebiges Symbol mit Redirect-Link hoch
Schritt->11: Telefonnummer und E-Mail anpassen

So erweitern Sie Ihre E-Mail-Liste für Unternehmen – bewährte Methoden 🚀

Schritt->12: Seitenliste mit Weiterleitungslink präsentieren

Eine weitere häufige Fußzeilenkomponente ist ein Link zu einer Seite. Fügen Sie eine beliebige Seitenliste wie Datenschutzrichtlinien, Geschäftsbedingungen oder andere hinzu. Zeigen Sie einfach Seitendetails der Website-Richtlinien, Informationen, Regeln und Vorschriften usw. an. Sehen wir uns an, wie das geht→

  • Wählen Sie Layout
  • Text hinzufügen oder bearbeiten
  • Untertitel hinzufügen oder bearbeiten
  • Aktivieren Sie „Umschalten, um Symbol anzuzeigen“.
  • Hochladen-Symbol
  • Wählen Sie Symbolfarbe
  • Wählen Sie Symbolposition
  • Suchen Sie nach Ihrer Seite, auf der Sie die Seitenliste anzeigen möchten
  • Aktivieren Sie diese Option, um die Beschriftung anzuzeigen
  • Etikett hinzufügen oder bearbeiten
  • Passen Sie Hintergrundfarbe, Typografie, Polsterung, Ausrichtung und Radius an
Schritt->12: Seitenliste mit Weiterleitungslink präsentieren

Wenn Sie einen benutzerdefinierten Header für Ihre WordPress-Website erstellen möchten, schauen Sie sich diesen Blog an – So entwerfen Sie einen benutzerdefinierten Header mit Elementor

Schritt->13: Benutzerdefinierter Instagram-Feed in der Fußzeile

Die Website-Fußzeile kann ein perfekter Abschnitt sein, um relevante Social-Media-Feeds einzufügen, z Instagram-Feed. Mal sehen, welche Funktionalität Sie anpassen können→

  • Aus den Layout-Einstellungen => Wählen Sie den Rasterstil „Liste“, „Raster“ oder „Mauerwerk“.
  • Wählen Sie Ihr Spaltenraster aus. 1, 2, 3 oder 4 bedeutet, wie viele Spalten Sie für die Anzeige von Bildern auswählen möchten.
  • Aktivieren Sie den Feed-Stil, um einen Instagram-Feed-Effekt bereitzustellen
  • Geben Sie den Zählwert für die Anzahl der Beiträge an, die Sie anzeigen möchten
  • Aktivieren Sie das Kommentarfeld, um den Kommentar und die Reaktion des Benutzers auf Ihren Beitrag anzuzeigen
  • Aktivieren Sie „Bildunterschrift anzeigen“, um die attraktive Bildunterschrift anzuzeigen
  • Aktivieren Sie die Schaltfläche „Folgen“, um eine Schaltfläche „Folgen uns“ hinzuzufügen und einen Instagram-Link für die folgende Seite bereitzustellen
  • Schaltflächentext folgen: Schaltflächentext anpassen
  • Link folgen: Geben Sie den Link „Folgen“ an
  • Ausrichtung: Wählen Sie die Position der Schaltfläche aus, an der Sie Ihre Schaltfläche anzeigen möchten – links, rechts oder in der Mitte
Profi-Tipps: Sie sollten die Auto-Play-Funktion nicht verwenden, da dies Ihre Besucher abschrecken kann. 
Schritt->14: Veröffentlichen Sie Ihre Fußzeile

Schritt->14: Veröffentlichen Sie Ihre Fußzeile

  • Hier kommt der wichtigste Teil. Nachdem Sie Ihre Fußzeile entworfen haben, klicken Sie einfach auf die Schaltfläche „Aktualisieren“. 

  • Das Wichtigste in diesem Abschnitt ist das Klicken "Vorschau". Und das ist es! Endlich ist Ihr Fußzeilenteil fertig. 

Yeeeee!!! 🥳

Zusammenfassung

Das ist alles über die Fußzeile! 

Wir glauben, dass Sie in diesem Elementor-Tutorial-Blog gelernt haben, wie Sie mit Elementor effektiv Fußzeilen für die Anzeige erstellen und welche Bedeutung Fußzeilen auf Ihrer Website haben. 

Ich hoffe, dass Sie es jetzt problemlos können Erstellen Sie mit dem ElementsKit Elementor-Add-on eine vollständig benutzerdefinierte Website-Fußzeile.

Wenn Sie jedoch Fragen haben, können Sie unten gerne einen Kommentar hinterlassen. Wir helfen Ihnen gerne weiter.

Kommentare

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert