So erstellen Sie einen Preloader auf WordPress mit Elementor

Ein Preloader, auch Loader genannt, ist eine einfache oder komplexe Animation oder GIF, die auf der Seite weiterläuft, während der andere Inhalt der Seite geladen wird.

Es ist sehr wichtig, Ihre Benutzer für die kurze Zeit zu unterhalten, die Ihre Website benötigt, um den Inhalt zu laden. Es hilft nicht nur, viele Benutzer zu binden, sondern ermöglicht auch eine dauerhafte Präsenz in den Köpfen der Benutzer. In diesem Tutorial werden wir verstehen, wie man Preloader mit Elementor erstellt .

So erstellen Sie einen Preloader mit Elementor

Elementor ist voller Optionen, mit denen Sie Ihre Website auf einer ganz anderen Ebene darstellen können. In ähnlicher Weise können Sie auch Preloader erstellen, mit denen Sie die Benutzer erfassen können, die schnell von Ihrer Website abprallen.

Stellen Sie zunächst sicher, dass Sie Preloader nur für Seiten erstellen, die tatsächlich einen Moment zum Laden des Inhalts benötigen und ein wichtiger Aspekt Ihrer Website sind.

Sobald Sie sich entschieden haben, auf welcher Seite Sie den Preloader platzieren möchten, suchen Sie ein SVG oder ein GIF , das zu Ihrer Website und dieser bestimmten Seite passt. Icons8 ist eine wirklich berühmte Quelle für Preloader-Animationen.

Wenn Sie nicht wissen, wie Sie Dateien im SVG-Format in Elementor importieren, lesen Sie unser Tutorial .

Als nächstes gibt es zwei Möglichkeiten, Preloader auf Ihrer Website zu verwenden, entweder indem Sie sie für eine bestimmte Seite oder für die gesamte Website verwenden.

• Wenn Sie den Preloader für die gesamte Website verwenden möchten, erstellen Sie einen neuen Abschnitt im Header-Template .
• Wenn Sie den Preloader für eine bestimmte Seite verwenden möchten, erstellen Sie oben auf der Seite einen neuen Abschnitt .

Stellen Sie in beiden Fällen sicher, dass Sie die Einstellungen des Abschnitts auf Keine Lücke ändern.

Wenn Sie mit den Einstellungen fertig sind, gehen Sie zur Registerkarte Elemente auf der linken Seite Ihres Bildschirms und wählen Sie HTML .

Fügen Sie im HTML-Feld den folgenden Code hinzu und stellen Sie sicher, dass Sie die Preloader-URL durch Ihre eigene ändern.

>div class="loader" /divscript/scriptstyle/style

Die Codierung enthält eine kommentierte Erklärung für Anfänger, um bei Bedarf Änderungen vorzunehmen.

Schließlich veröffentlichen Sie Ihren Preloader und prüfen, ob er perfekt funktioniert. So können Sie mit Elementor einen Preloader auf Ihrer WordPress-Website erstellen.

Wir hoffen, dass dieses Tutorial Ihnen dabei hilft, die Benutzer Ihrer Website zu binden und sie viel professioneller aussehen zu lassen. Das ist alles von uns für dieses Tutorial. Besuchen Sie uns auf Twitter und Facebook, um über unsere Inhalte auf dem Laufenden zu bleiben.