So fügen Sie animierte GIFs in WordPress hinzu (Der RICHTIGE Weg)

Ich habe einmal das perfekte GIF gefunden, um einen Beitrag ansprechender zu gestalten, aber es verwandelte sich sofort nach dem Hochladen in ein statisches, nicht animiertes Bild. Es war unglaublich ärgerlich zu sehen, wie die Animation verschwand, genau als ich meine Leser fesseln wollte.

Das passiert, weil WordPress beim automatischen Erstellen kleinerer Bildgrößen (wie Thumbnails) nur den ersten Frame der Animation verwendet. Die restlichen Animationsdaten sind in diesen generierten Größen nicht enthalten.

Glücklicherweise ist die Behebung dieses Problems einfach, sobald man weiß, welche Einstellung man ändern muss. Ich habe diese spezielle Methode auf meinen eigenen Websites verwendet, um Animationen reibungslos und ohne Code abzuspielen.

Hier erfahren Sie, wie Sie animierte GIFs in WordPress richtig hinzufügen.

Warum funktionieren WordPress-GIFs nicht richtig?

Jedes Mal, wenn Sie ein Bild in die Mediathek hochladen, erstellt WordPress automatisch mehrere Kopien dieses Bildes in verschiedenen Größen.

Es gibt 3 standardmäßige WordPress-Bildgrößen, die automatisch generiert werden: Thumbnail, Medium und Large. WordPress behält auch Ihr Original-Upload, der als 'Vollständige Größe' bezeichnet wird.

Das Problem ist, dass WordPress beim Erstellen dieser neuen Bildgrößen für animierte GIFs nur den ersten Frame der Animation erfasst.

Infolgedessen werden alle generierten Bildgrößen, die du zu deinem Beitrag oder deiner Seite hinzufügst, statische Bilder sein und dazu führen, dass WordPress GIF nicht funktioniert.

Nun schauen wir uns den richtigen Weg an, animierte GIFs in WordPress einzufügen, damit sie ihre Animation behalten.

Animierte GIFs in WordPress richtig hinzufügen

Zuerst müssen Sie einen neuen WordPress-Beitrag oder eine neue Seite im WordPress Gutenberg-Editor bearbeiten oder erstellen, um das animierte GIF hinzuzufügen.

Sobald du dich im WordPress-Inhaltseditor befindest, klicke auf die Schaltfläche '+' und füge einen Bildblock hinzu.

Als Nächstes finden Sie mehrere Möglichkeiten, Ihr animiertes GIF im Bildblock hochzuladen.

Klicken Sie zunächst einfach auf die Schaltfläche „Hochladen“ und wählen Sie Ihr animiertes GIF von Ihrem Computer aus. Oder Sie können auf die Schaltfläche „Mediathek“ klicken und Mediendateien hinzufügen, die bereits in Ihre Mediathek hochgeladen wurden.

Es gibt auch die Option, den Link zu Ihrem GIF einzugeben, indem Sie auf die Schaltfläche „Von URL einfügen“ klicken. Wir empfehlen dies jedoch nicht, da das Bild nicht auf Ihre Website hochgeladen wird.

Sobald Sie Ihr GIF hochgeladen haben, fügt der Block-Editor es in Ihren Inhalt ein und Sie können es anpassen.

Nachdem Sie das GIF hinzugefügt haben, müssen Sie unter „Bildgröße“ aus dem Menü auf Ihrer rechten Seite die Option „Vollständige Größe“ auswählen.

Es ist wichtig, ' Vollständige Größe ' auszuwählen, da dies WordPress anweist, das ursprüngliche, unveränderte animierte GIF zu verwenden, das Sie hochgeladen haben.

Die anderen Größen (wie „Thumbnail“, „Medium“ oder sogar „Large“) sind statische Kopien, die WordPress nur aus dem ersten Frame generiert hat. Durch die Wahl von „Full Size“ stellen Sie sicher, dass die Animation korrekt abgespielt wird. 👍

Du wirst die Animation sofort im Inhaltseditor sehen können.

Veröffentliche oder aktualisiere deinen Blogbeitrag, um die animierten GIFs in Aktion zu sehen.

Bonustipps für die Verwendung animierter GIFs in WordPress

Animierte GIF-Bilder sind normalerweise größer in der Dateigröße als andere Bilddateien. Das liegt daran, dass sie mehrere komprimierte Bilder enthalten, die als Frames zur Erstellung der Animation verwendet werden.

Die Verwendung großer GIFs oder das Hinzufügen zu vieler GIF-Bilder auf einer WordPress-Seite kann Ihre Website verlangsamen und Ihre Suchmaschinenoptimierung (SEO) beeinträchtigen. Sehen Sie sich unseren ultimativen Leitfaden an, wie Sie die Geschwindigkeit und Leistung von WordPress verbessern können, um weitere Details zu erfahren.

Wenn Sie Giphy.com verwenden, um animierte GIFs zu finden, dann ist das GIF Master Plugin möglicherweise sehr nützlich. Es ermöglicht Ihnen, die Giphy-Datenbank von Ihrem WordPress-Dashboard aus zu durchsuchen und GIFs hinzuzufügen, ohne Ihre WordPress-Website zu verlassen.

Wenn Sie einen Link zu einem GIF von Giphy haben, können Sie auch einfach die URL direkt in den WordPress-Editor auf einer eigenen Zeile einfügen. WordPress wird das animierte GIF automatisch für Sie einbetten, kein Plugin erforderlich.

Häufig gestellte Fragen zu GIFs in WordPress

Hier sind Antworten auf einige der häufigsten Fragen, die wir zum Thema animierte GIFs in WordPress erhalten.

Warum sind animierte GIFs so groß?

Animierte GIFs sind im Wesentlichen eine Reihe von statischen Bildern oder Frames, die in einer einzigen Datei verpackt sind. Je mehr Frames und Farben ein GIF hat, desto größer wird seine Dateigröße sein.

Deshalb sind sie oft viel größer als normale JPG- oder PNG-Bilder.

Wie kann ich GIFs optimieren, um sie kleiner zu machen?

Sie können kostenlose Online-Tools wie EZgif oder GIMP verwenden, um Ihre animierten GIFs zu optimieren. Diese Tools können die Dateigröße reduzieren, indem sie zusätzliche Frames entfernen oder die Anzahl der Farben verringern.

Is it bad to use many GIFs on a single page?

Ja, das Hinzufügen zu vieler großer GIF-Dateien zu einer einzigen Seite kann die Ladezeit Ihrer Website erheblich verlangsamen. Dies kann zu einer schlechten Benutzererfahrung führen und Ihre SEO-Rankings negativ beeinflussen.

It’s best to use them sparingly to highlight key points or add visual interest where it matters most.

Zusätzliche Ressourcen zur Verwaltung Ihrer Medien

Wir hoffen, dieser Leitfaden hat Ihnen geholfen, animierte GIFs korrekt zu Ihrer WordPress-Website hinzuzufügen. Jetzt, da Sie GIFs beherrschen, finden Sie diese anderen Artikel zur Medienverwaltung möglicherweise nützlich.

• Großartige WordPress-Plugins zur Verwaltung von Bildern – Entdecke Tools, die dir helfen, deine Bilder effektiver zu organisieren, zu optimieren und anzuzeigen.
• Warum Sie niemals ein Video auf WordPress hochladen sollten – Erfahren Sie, warum das Hosten eigener Videos die Leistung Ihrer Website beeinträchtigen kann und was Sie stattdessen tun sollten.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.