Springe zum Hauptinhalt

Wie man CSS-Animationen Wordpress hinzufügen

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 901.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Haben Sie diese wunderschönen CSS-Animationen auf beliebten Websites gesehen? Animationseffekte wie Inhalte, die gleiten, sich auflösen, Bilder abprallen usw. ? Möchten Sie auch CSS-Animationen zu WordPress hinzufügen?

In diesem Artikel zeigen wir Ihnen, wie Sie einfach CSS-Animationen zu WordPress hinzufügen können, ohne Code zu schreiben.

Wann und warum sollten Sie CSS-Animationen verwenden?

Mit CSS-Animationen können Sie die Aufmerksamkeit des Benutzers auf verschiedene Teile der Seite lenken. Sie können sie verwenden, um Produktfunktionen oder eine Handlungsaufforderung zu animieren. Viele Websites verwenden CSS-Animationen, wenn der Benutzer die Seite nach unten scrollt. Es verleiht der Seite eine gewisse Persönlichkeit und hebt die wichtigsten Elemente hervor.

CSS-Animationen sind auch schneller als die Verwendung von Flash oder Videos. Sie werden schnell geladen und von den meisten modernen Webbrowsern unterstützt. Sie können Ihrem WordPress-Design oder Ihrem Stylesheet manuell CSS-Animationen hinzufügen. Kind Thema. Die meisten Anfänger möchten jedoch weder ihre Themendateien bearbeiten noch CSS lernen.

In diesem Tutorial erfahren Sie jedoch, wie Sie Ihrer WordPress-Website auf einfache Weise CSS-Animationen hinzufügen können.

Aber vorher, wenn Sie WordPress Discover noch nie installiert haben Wie man ein Wordpress-Blog 7 Schritte für die Installation et Wie finden, zu installieren und ein Wordpress-Theme auf Ihrem Blog aktivieren 

Dann zurück zu warum wir hier sind.

Wie Einrichten von CSS-Animationen

Wir werden ein Plugin für dieses Tutorial verwenden. Sie können damit CSS-Animationen erstellen WYSIWYG visueller Editor. Als erstes müssen Sie das Plugin installieren und aktivieren Animieren Sie es!. Das Plugin funktioniert ohne Konfiguration und es gibt kein Control Panel.

Entdecken Sie Wie ein Plugin in Wordpress zu installieren wenn du es noch nie gemacht hast.

Erstellen Sie einfach einen neuen Beitrag und Sie sehen eine neue Schaltfläche in der Symbolleiste des visuellen Editors.

Fügen Sie CSS-Animationen zu WordPress hinzu - animateit-button

Wenn Sie auf die Schaltfläche klicken, wird ein neues Fenster angezeigt, in dem Sie Ihre CSS-Animationen entwerfen können. Das Plugin unterstützt viele CSS-Animationen, aus denen alle zur Auswahl stehen.

Animation-Editor

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Zuerst müssen Sie den Animationsstil auswählen. Danach müssen Sie die Wartezeit vor der Animation und die Dauer der Animation auswählen. Schließlich können Sie festlegen, wann die Animation gestartet werden soll.

Gehen Sie auch weiter und entdecken Sie Wie man beeindruckende Animationen zu Ihrem Blog hinzufügen

Das Plugin bietet drei Möglichkeiten. Sie können die Animation beim Klicken, Bewegen des Mauszeigers oder beim Scrollen ausführen.

Hinzufügen von CSS-Animationen zu WordPress - animateon

Wenn Sie mit den Einstellungen zufrieden sind, können Sie auf die Schaltfläche " es belebt Anzeigen der Vorschau der Animation.

Klicken Sie dann auf die Schaltfläche Insert um Ihrem Beitrag oder Ihrer Seite eine Animation hinzuzufügen. Sie werden feststellen, dass das Plugin im visuellen Editor einen Shortcode mit Dummy-Inhalten hinzufügt.

Animieren-Short

Sie müssen den Dummy-Inhalt im Shortcode entfernen und durch Ihren eigenen Inhalt, Ihre eigenen Bilder oder was auch immer Sie sonst noch animieren möchten ersetzen.

entdecken Sie auch So fügen Sie Ihrer WordPress-Website interaktive Karten hinzu

Inhalt-Short

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

Jetzt müssen Sie nur noch Ihre Inhalte veröffentlichen und eine Vorschau anzeigen.

Entdecken Sie auch einige Premium-WordPress-Plugins  

Sie können andere WordPress-Plugins verwenden, um ein modernes Erscheinungsbild zu erhalten und den Grip Ihres Blogs oder Ihrer Website zu optimieren.

Wir bieten Ihnen hier einige Premium-WordPress-Plugins an, die Ihnen dabei helfen werden.

1. ChimpMate Pro

Chimpmate ist das Premium-WordPress-Popup-Plugin von MailChimp, mit dem Sie Ihre Leser in Abonnenten umwandeln können. Es wurde entwickelt, um Ihre E-Mail-Liste zu erweitern, ohne die Besucher zu irritieren, mit nervigen Popups.ChimpMate Pro

Es ist vollständig anpassbar und Sie werden beherrschen, wann und wo Popups angezeigt werden sollen. Die anderen Funktionen sind: Unterstützung von mehreren Browsern und hat pmehrere Planungsoptionen, ein vollständig anpassbares Layout, areaktionsschnelle Kundenunterstützung, ichperfekte Integration mit WooCommerceein excellente Cache-Verwaltung, perfekte Integration mit mehreren WordPress-Themes, mehrsprachige Unterstützung danke zum WPML-Plugin, znicht mehr viel.

DownloadDemo | Web-Hosting

2. WooCommerce Cardstream Zahlungsgateway

CardStream ist der einzige unabhängige Zahlungsgateway-Anbieter. Mit diesem Premium-WordPress-Plugin können Sie Zahlungen direkt in Ihrem WooCommerce-Onlineshop über Cardstream akzeptieren.

WooCommerce Cardstream Payment Gateway

Sie können damit auch Zahlungen mit der von Cardstream gehosteten Lösung akzeptieren.

DownloadDemo | Web-Hosting

3. Datenquelle

DataSource ist ein Premium-WordPress-Plugin, das sich darauf konzentriert, Ihre Daten auf jeder Seite Ihrer Website visuell darzustellen. Sie können Daten aus CSV, XML, Excel, Google Spreadsheets, MySQL-Datenbanken oder benutzerdefinierten Beitragstypen als sortierbare und filterbare Tabelle, verschiedene Diagramme, Karten und mehr darstellen.Datenquelle WordPress-Plugins fügen grafische Tabellen Website-Blog-Formular ein

Unter seinen Merkmalen finden Sie unter anderem: ein iintuitive Schnittstelle, tAbleaux basierend auf dem Modell Ihrer Daten, tsortierbar, filterbar und reaktionsfähig, dieUnterstützung von Google Maps und mehrsprachigareaktionsschnelle Kundenbetreuung, ein mBenutzerhandbuch, ein ischnelle Installation, et mehr

Download Demo | Web-Hosting

Empfohlene Ressourcen

Informieren Sie sich über andere empfohlene Ressourcen, die Sie beim Erstellen und Verwalten Ihrer Website unterstützen.

Erstellen Sie einfach Ihren Online-Shop

Laden Sie kostenlos WooCommerce herunter, die besten E-Commerce-Plugins, um Ihre physischen und digitalen Produkte auf WordPress zu verkaufen. [Empfohlen]

Fazit

Hier ! Wir hoffen, dass Sie damit lernen, wie Sie CSS-Animationen in WordPress integrieren. Zögere nicht zu Teile es mit deinen Freunden in deinen bevorzugten sozialen Netzwerken

Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung.

Wenn Sie Vorschläge oder Anmerkungen haben, hinterlassen Sie diese in unserer Rubrik commentaires.

...

Dieser Artikel enthält 1 Kommentar

Hinterlassen Sie einen Kommentar

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

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
12 Aktien
Aktie8
tweet2
Registrieren2