{"id":57473,"date":"2023-01-04T07:00:18","date_gmt":"2023-01-04T15:00:18","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=57473"},"modified":"2025-01-16T11:31:11","modified_gmt":"2025-01-16T19:31:11","slug":"hinzufugen-von-lottie-animationen","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/","title":{"rendered":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt"},"content":{"rendered":"\n<p>Auff\u00e4llige Bilder und Videos sind eine gro\u00dfartige M\u00f6glichkeit, Online-Besucher zu beeindrucken. Jedoch verwenden nahezu alle Websites diese, um die <a href=\"https:\/\/www.dreamhost.com\/blog\/de\/was-ist-benutzererfahrung\/\" target=\"_blank\" rel=\"noopener\">Benutzererfahrung (UX)<\/a> zu verbessern. Daher reicht das Hinzuf\u00fcgen dieser Standardvisuals auf Ihren Seiten nicht mehr aus, um Ihre Website von der Masse abzuheben.<\/p>\n\n\n\n<p>Gl\u00fccklicherweise k\u00f6nnen Sie Ihrer Website Lottie-Animationen hinzuf\u00fcgen, um Ihnen einen Wettbewerbsvorteil zu verschaffen. <a href=\"https:\/\/lottiefiles.com\/\" target=\"_blank\" rel=\"noopener\">LottieFiles<\/a> bietet eine kostenlose Bibliothek von Animationen, die Sie leicht zu Ihrer Website hinzuf\u00fcgen k\u00f6nnen. Anschlie\u00dfend k\u00f6nnen Sie diese nutzen, um das Benutzerengagement zu steigern und das <a href=\"https:\/\/www.dreamhost.com\/blog\/how-to-design-a-website\/\" target=\"_blank\" rel=\"noopener\">Design Ihrer Website<\/a> zu verbessern.<\/p>\n\n\n\n<p>In diesem Beitrag werfen wir einen genaueren Blick auf einige wichtige Vorteile der Verwendung von Lottie-Animationen auf Ihrer Website. Anschlie\u00dfend zeigen wir Ihnen drei einfache Methoden, um diese visuellen Elemente hinzuzuf\u00fcgen. Jetzt starten!<\/p>\n\n\n\n<h2 id=\"h-the-benefits-of-adding-lottie-animations-to-your-site\" class=\"wp-block-heading\"><b>Die Vorteile von Lottie-Animationen auf Ihrer Website<\/b><\/h2>\n\n\n\n<p>W\u00e4hrend Videos und Bilder Ihre Website ansprechender machen k\u00f6nnen, sind solche visuellen Inhalte \u00fcberall im Internet zu sehen. Animationen hingegen k\u00f6nnen Ihnen einen einzigartigen Vorteil verschaffen.<\/p>\n\n\n\n<p>Zudem wird erwartet, dass der <a href=\"https:\/\/www.statista.com\/topics\/9725\/animation-industry\/#dossierKeyfigures\" target=\"_blank\" rel=\"noopener\">globale Markt f\u00fcr die Animationsindustrie<\/a> in den n\u00e4chsten neun Jahren um 60% steigen wird. Das bedeutet, wenn Sie jetzt damit beginnen, k\u00f6nnen Sie sich einen Vorsprung vor einem wachsenden Trend verschaffen.<\/p>\n\n\n\n<p>Tats\u00e4chlich haben letztes Jahr 61% der Vermarkter interaktive Inhalte als digitale Engagementtaktik verwendet. Zu den weiteren Strategien geh\u00f6rten GIFs, die auch zur Darstellung von Animationen verwendet werden k\u00f6nnen.<\/p>\n\n\n\n<p><a href=\"https:\/\/lottiefiles.com\/\" target=\"_blank\" rel=\"noopener\">Lottie Animationen<\/a> sind eine ausgezeichnete Wahl, vor allem wegen ihrer kleinen Dateigr\u00f6\u00dfen:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"954\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-website-homepage.png\" alt=\"LottieFiles Website-Startseite\" class=\"wp-image-38495 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-website-homepage-300x143.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-website-homepage-1024x489.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-website-homepage-768x367.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-website-homepage-1536x733.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-600x286.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-1200x573.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-730x348.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-1460x697.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-784x374.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-1568x748.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-877x419.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-website-homepage-1754x837.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/954;\" \/><\/figure><\/div>\n\n\n<p>Tats\u00e4chlich sind diese Dateien <i>600%<\/i> kleiner als GIFs \u2013 Sie k\u00f6nnen sie Ihrer Website hinzuf\u00fcgen, ohne etwas zu beschweren. Dies kann Ihnen helfen, eine positive Benutzererfahrung zu bewahren.<\/p>\n\n\n\n<p>Besser noch, Lottie-Animationen k\u00f6nnen vollst\u00e4ndig angepasst werden, um <a href=\"https:\/\/www.dreamhost.com\/blog\/de\/wie-man-einen-markenstil-guide-fur-eine-website-erstellt\/\" target=\"_blank\" rel=\"noopener\">Ihre Markenidentit\u00e4t<\/a> zu entsprechen. Dar\u00fcber hinaus ist es eine erschwingliche L\u00f6sung, da LottieFiles die umfangreichste, kostenlose Animationsbibliothek bereitstellt. Sie erhalten Zugang zu Tausenden von UI-Elementen, Charakteren und Illustrationen.<\/p>\n\n\n\n<div class=\"article-newsletter article-newsletter--gradient\">\n\n\n<h2>Get Content Delivered Straight to Your Inbox<\/h2><p>Subscribe now to receive all the latest updates, delivered directly to your inbox.<\/p><form class=\"nwsl-form\" id=\"newsletter_block_\" novalidate><div class=\"messages\"><\/div><div class=\"form-group\"><label for=\"input_newsletter_block_\"><input type=\"email\"name=\"email\"id=\"input_newsletter_block_\"placeholder=\"Enter your email address\"novalidatedisabled=\"disabled\"\/><\/label><button type=\"submit\"class=\"btn btn--brand\"disabled=\"disabled\"><span>Sign Me Up!<\/span><svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<path d=\"M13.8523 0.42524L12.9323 1.34521C12.7095 1.56801 12.7132 1.9304 12.9404 2.14865L16.7241 5.7823H0.5625C0.251859 5.7823 0 6.03416 0 6.3448V7.6573C0 7.96794 0.251859 8.2198 0.5625 8.2198H16.7241L12.9405 11.8535C12.7132 12.0717 12.7095 12.4341 12.9323 12.6569L13.8523 13.5769C14.072 13.7965 14.4281 13.7965 14.6478 13.5769L20.8259 7.39879C21.0456 7.17913 21.0456 6.82298 20.8259 6.60327L14.6477 0.42524C14.4281 0.205584 14.0719 0.205584 13.8523 0.42524Z\" fill=\"white\"\/>\n<\/svg>\n<\/button><\/div><\/form><\/div>\n\n\n<h2 id=\"h-how-to-add-lottie-animations-to-your-site-3-ways\" class=\"wp-block-heading\"><b>Wie man Lottie-Animationen auf Ihrer Website hinzuf\u00fcgt (3 Methoden)<\/b><\/h2>\n\n\n\n<p>Jetzt, da Sie die Vorteile von Lottie-Animationen kennen, lassen Sie uns drei M\u00f6glichkeiten betrachten, wie Sie sie zu Ihrer Website hinzuf\u00fcgen k\u00f6nnen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-method-1-add-your-animation-with-oembed\"><b>Methode 1: F\u00fcgen Sie Ihre Animation mit oEmbed hinzu<\/b><\/h3>\n\n\n\n<p>Ihre Lottie-Animationen \u00fcber oEmbed hinzuzuf\u00fcgen, ist die einfachste Methode in dieser Anleitung. Der einzige Nachteil ist, dass Sie die Animationseinstellungen nicht bearbeiten k\u00f6nnen oder sie so einrichten, dass sie auf Benutzerinteraktionen reagieren.<\/p>\n\n\n\n<p>Um mit dieser Methode zu beginnen, durchsuchen Sie die <a href=\"https:\/\/lottiefiles.com\/featured\" target=\"_blank\" rel=\"noopener\">LottieFiles Animationsbibliothek<\/a>, um die perfekte Animation f\u00fcr Ihre Seite zu finden. Sobald Sie ein Design gefunden haben, das Ihnen gef\u00e4llt, klicken Sie auf die Animation und kopieren Sie einfach die oEmbed-URL (Sie m\u00fcssen dazu in einem kostenlosen Konto angemeldet sein):<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"1002\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-copy-oembed-url.jpg\" alt=\"Finde die oEmbed-URL in LottieFiles\" class=\"wp-image-38493 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url.jpg.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-copy-oembed-url-300x150.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-copy-oembed-url-1024x513.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-copy-oembed-url-768x385.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-copy-oembed-url-1536x770.jpg 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-600x301.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-1200x602.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-730x366.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-1460x732.jpg.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-784x393.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-1568x786.jpg.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-877x440.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-copy-oembed-url-1754x879.jpg.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/1002;\" \/><\/figure><\/div>\n\n\n<p>Dann gehen Sie zu WordPress und \u00f6ffnen Sie die Seite oder den Beitrag, in dem Sie Ihre Animation einbinden m\u00f6chten. F\u00fcgen Sie anschlie\u00dfend einfach einen neuen <i>Embed<\/i> Gutenberg-Block hinzu:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"828\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-block-in-wordpress.png\" alt=\"Einbettungsblock in WordPress\" class=\"wp-image-38485 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-block-in-wordpress-300x124.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-block-in-wordpress-1024x424.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-block-in-wordpress-768x318.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-block-in-wordpress-1536x636.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-600x249.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-1200x497.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-730x302.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-1460x605.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-784x325.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-1568x649.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-877x363.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-block-in-wordpress-1754x727.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/828;\" \/><\/figure><\/div>\n\n\n<p>F\u00fcgen Sie nun die oEmbed-URL ein, die Sie von der Lottie-Website kopiert haben:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"616\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block.png\" alt=\"F\u00fcgen Sie die oEmbed Lottie-URL in den Embed WordPress-Block ein\" class=\"wp-image-38496 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-300x92.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1024x316.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-768x237.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1536x473.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-600x185.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1200x370.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-730x225.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1460x450.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-784x242.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1568x483.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-877x270.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-lottie-html-code-into-custom-html-wordpress-block-1754x541.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/616;\" \/><\/figure><\/div>\n\n\n<p>Klicken Sie auf den <i>Embed<\/i>-Button, um die Aktion zu best\u00e4tigen.<\/p>\n\n\n\n<p>An dieser Stelle sollten Sie die Animation auf Ihrer Seite sehen:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"838\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-in-wordpress.jpg\" alt=\"Binden Sie Ihre Lottie-Animation in WordPress ein\" class=\"wp-image-38486 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress.jpg.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-in-wordpress-300x126.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-in-wordpress-1024x429.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-in-wordpress-768x322.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-in-wordpress-1536x644.jpg 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-600x252.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-1200x503.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-730x306.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-1460x612.jpg.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-784x329.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-1568x657.jpg.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-877x368.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-in-wordpress-1754x735.jpg.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/838;\" \/><\/figure><\/div>\n\n\n<p>Wie wir zuvor erw\u00e4hnt haben, k\u00f6nnen Sie die Animation nicht anpassen, nachdem Sie sie zu Ihrer WordPress-Seite oder Ihrem Beitrag hinzugef\u00fcgt haben. Daher ist es entscheidend, dass Sie alle gew\u00fcnschten Bearbeitungen vornehmen, w\u00e4hrend Sie noch auf der Lottie-Website sind.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-method-2-add-your-animation-using-the-lottie-block-for-gutenberg-plugin\"><b>Methode 2: F\u00fcgen Sie Ihre Animation mit dem <\/b><a href=\"https:\/\/wordpress.org\/plugins\/lottiefiles\/\" target=\"_blank\" rel=\"noopener\"><b>Lottie block for Gutenberg<\/b><\/a><b> Plugin hinzu<\/b><\/h3>\n\n\n\n<p>Obwohl die oEmbed-Methode die einfachste ist, ist die Verwendung des Lottie-Blocks f\u00fcr das Gutenberg-Plugin ebenfalls sehr einfach. Au\u00dferdem erm\u00f6glicht es Ihnen, \u00c4nderungen an Ihren Designs sofort zu \u00fcberpr\u00fcfen.<\/p>\n\n\n\n<p>Zun\u00e4chst gehen Sie zu <i>Plugins <\/i>&gt; <i>Add New <\/i>um das <a href=\"https:\/\/wordpress.org\/plugins\/lottiefiles\/\" target=\"_blank\" rel=\"noopener\">Lottie-Block f\u00fcr Gutenberg<\/a> Plugin in WordPress zu installieren und zu aktivieren:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1857\" height=\"602\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-blocks-for-gutenberg-plugin.png\" alt=\"Lottie Block f\u00fcr Gutenberg Plugin\" class=\"wp-image-38490 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin.png.webp 1857w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-blocks-for-gutenberg-plugin-300x97.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1024x332.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-blocks-for-gutenberg-plugin-768x249.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1536x498.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-600x195.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1200x389.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-730x237.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1460x473.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-784x254.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1568x508.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-877x284.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-blocks-for-gutenberg-plugin-1754x569.png.webp 1754w\" data-sizes=\"(max-width: 1857px) 100vw, 1857px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1857px; --smush-placeholder-aspect-ratio: 1857\/602;\" \/><\/figure><\/div>\n\n\n<p>Sie k\u00f6nnen sich dann in Ihr LottieFiles-Konto einloggen oder kostenlos ein Konto erstellen.<\/p>\n\n\n\n<p>Als N\u00e4chstes f\u00fcgen Sie einen neuen Block im Gutenberg-Editor hinzu. Suchen Sie nach dem <i>Lottie<\/i> Block und f\u00fcgen Sie ihn Ihrer Seite hinzu:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"776\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/wordpress-lottie-block.png\" alt=\"Suche nach dem Lottie-Block in WordPress\" class=\"wp-image-38500 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/wordpress-lottie-block-300x116.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/wordpress-lottie-block-1024x398.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/wordpress-lottie-block-768x298.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/wordpress-lottie-block-1536x596.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-600x233.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-1200x466.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-730x283.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-1460x567.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-784x304.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-1568x609.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-877x340.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/wordpress-lottie-block-1754x681.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/776;\" \/><\/figure><\/div>\n\n\n<p>Hier finden Sie drei M\u00f6glichkeiten, eine Lottie-Animation in WordPress einzuf\u00fcgen:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Klicken Sie auf <i>Discover animation <\/i>, um die LottieFiles-Bibliothek zu durchsuchen (Sie ben\u00f6tigen ein Konto daf\u00fcr).<\/li>\n\n\n\n<li>W\u00e4hlen Sie <i>Media Library <\/i>, um eine Animation zu finden, die Sie zuvor hochgeladen haben.<\/li>\n\n\n\n<li>Dr\u00fccken Sie <i>Insert from url<\/i>, um einen JSON-Link einzuf\u00fcgen.<\/li>\n\n\n<\/ul>\n\n\n\n<p>Wenn Sie die letzte Methode w\u00e4hlen, finden Sie den JSON-Link auf der Lottie-Website:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"1127\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url.jpg\" alt=\"Lottie JSON URL\" class=\"wp-image-38491 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url.jpg.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-300x169.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-1024x577.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-768x433.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-1536x866.jpg 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-600x338.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1200x677.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-730x412.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1460x823.jpg.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-784x442.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1568x884.jpg.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-877x494.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1754x989.jpg.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/1127;\" \/><\/figure><\/div>\n\n\n<p>Nachdem Sie die Animation zu Ihrer Seite hinzugef\u00fcgt haben, k\u00f6nnen Sie das Design in Gutenberg vorschauen:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"836\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/preview-lottie-animation-in-gutenberg.png\" alt=\"Vorschau der lila Eulen-Animation in Gutenberg\" class=\"wp-image-38498 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/preview-lottie-animation-in-gutenberg-300x125.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/preview-lottie-animation-in-gutenberg-1024x428.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/preview-lottie-animation-in-gutenberg-768x321.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/preview-lottie-animation-in-gutenberg-1536x642.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-600x251.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-1200x502.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-730x305.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-1460x611.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-784x328.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-1568x656.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-877x367.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/preview-lottie-animation-in-gutenberg-1754x734.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/836;\" \/><\/figure><\/div>\n\n\n<p>Jetzt k\u00f6nnen Sie in den <i>Block<\/i>-Einstellungen Ihre Animation anpassen. Zum Beispiel k\u00f6nnen Sie einen transparenten Hintergrund einstellen, die Abmessungen \u00e4ndern oder die Animation mit verschiedenen Aktionen ausl\u00f6sen. Sie k\u00f6nnen das Plugin auch verwenden, um <a href=\"https:\/\/www.youtube.com\/watch?v=i2LP34t__Yc\" target=\"_blank\" rel=\"noopener\">eine Lottie-Animation als WordPress-Hintergrund hinzuzuf\u00fcgen<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-method-3-add-your-animation-with-html-and-javascript\"><b>Methode 3: F\u00fcgen Sie Ihre Animation mit HTML und JavaScript hinzu<\/b><\/h3>\n\n\n\n<p>Ihre Lottie-Animation mit HTML und JavaScript hinzuzuf\u00fcgen ist immer noch recht einfach, aber es ist die komplexeste Methode. Au\u00dferdem k\u00f6nnen Sie Aktualisierungen nicht in Echtzeit sehen.<\/p>\n\n\n\n<p>Stattdessen m\u00fcssen Sie zwischen Gutenberg und Ihrer Website wechseln, um Ihre \u00c4nderungen zu \u00fcberpr\u00fcfen. Dennoch m\u00f6chten Sie vielleicht diese Methode verwenden, wenn Sie mit <a href=\"https:\/\/www.dreamhost.com\/blog\/de\/html-lernen\/\" target=\"_blank\" rel=\"noopener\">HTML vertraut sind<\/a> und erweiterte Anpassungsoptionen suchen.<\/p>\n\n\n\n<p>Um mit diesem Ansatz zu beginnen, klicken Sie auf die Animation in der LottieFiles-Bibliothek und kopieren Sie den Lottie JSON-Dateilink:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"1127\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url.jpg\" alt=\"Lottie JSON URL\" class=\"wp-image-38491 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url.jpg.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-300x169.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-1024x577.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-768x433.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-json-url-1536x866.jpg 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-600x338.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1200x677.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-730x412.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1460x823.jpg.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-784x442.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1568x884.jpg.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-877x494.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-json-url-1754x989.jpg.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/1127;\" \/><\/figure><\/div>\n\n\n<p>Als n\u00e4chstes scrollen Sie nach unten, bis Sie \u201eUse animation in\u2026\u201c sehen und w\u00e4hlen Sie <i>&lt;html&gt;<\/i>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"852\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-using-html.jpg\" alt=\"Lottie-Animation mittels HTML einbetten\" class=\"wp-image-38487 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html.jpg.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-using-html-300x128.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-using-html-1024x436.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-using-html-768x327.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/embed-lottie-animation-using-html-1536x655.jpg 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-600x256.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-1200x511.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-730x311.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-1460x622.jpg.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-784x334.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-1568x668.jpg.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-877x374.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/embed-lottie-animation-using-html-1754x748.jpg.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/852;\" \/><\/figure><\/div>\n\n\n<p>Dies f\u00fchrt Sie zum LottieFiles Web Player:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"1016\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-web-player-preview.png\" alt=\"Die LottieFiles Web Player Vorschau\" class=\"wp-image-38494 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-web-player-preview-300x152.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-web-player-preview-1024x520.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-web-player-preview-768x390.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottiefiles-web-player-preview-1536x781.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-600x305.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-1200x610.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-730x371.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-1460x742.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-784x398.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-1568x797.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-877x446.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottiefiles-web-player-preview-1754x891.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/1016;\" \/><\/figure><\/div>\n\n\n<p>Hier k\u00f6nnen Sie eine Hintergrundfarbe w\u00e4hlen, die Gr\u00f6\u00dfe und Geschwindigkeit der Animation bestimmen und mehr.<\/p>\n\n\n\n<p>Deselektieren Sie nun das <i>Controls <\/i>Kontrollk\u00e4stchen und Sie werden sehen, dass am unteren Bildschirmrand etwas HTML-Code generiert wurde:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"1082\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/html-code-for-lottiefiles-animation.png\" alt=\"HTML-Code f\u00fcr Ihre LottieFiles-Animation\" class=\"wp-image-38488 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/html-code-for-lottiefiles-animation-300x162.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/html-code-for-lottiefiles-animation-1024x554.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/html-code-for-lottiefiles-animation-768x416.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/html-code-for-lottiefiles-animation-1536x831.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-600x325.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-1200x650.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-730x395.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-1460x790.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-784x424.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-1568x849.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-877x475.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/html-code-for-lottiefiles-animation-1754x949.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/1082;\" \/><\/figure><\/div>\n\n\n<p>Kopieren Sie die Zeile des Codes, die mit \u201e<span style=\"font-family: 'courier new', courier, monospace;\">&lt;lottie-player&gt;<\/span>\u201c beginnt und mit \u201e<span style=\"font-family: 'courier new', courier, monospace;\">&lt;\/lottie-player&gt;<\/span>\u201c endet. F\u00fcgen Sie dann in WordPress einen neuen <i>Custom HTML<\/i> Block hinzu:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"858\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-custom-html-block-wordpress-editor.png\" alt=\"Hinzuf\u00fcgen eines neuen benutzerdefinierten HTML-Blocks im WordPress-Editor\" class=\"wp-image-38482 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-custom-html-block-wordpress-editor-300x129.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-custom-html-block-wordpress-editor-1024x440.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-custom-html-block-wordpress-editor-768x330.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-custom-html-block-wordpress-editor-1536x659.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-600x258.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-1200x515.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-730x313.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-1460x627.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-784x337.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-1568x673.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-877x376.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-custom-html-block-wordpress-editor-1754x753.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/858;\" \/><\/figure><\/div>\n\n\n<p>F\u00fcgen Sie das HTML ein, das Sie von LottieFiles kopiert haben, und klicken Sie oben rechts auf <i>Entwurf speichern<\/i>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"483\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block.png\" alt=\"F\u00fcgen Sie den Lottie HTML-Code in den Custom HTML WordPress-Block ein\" class=\"wp-image-38497 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-300x72.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1024x247.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-768x186.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1536x371.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-600x145.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1200x290.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-730x176.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1460x353.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-784x189.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1568x379.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-877x212.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/paste-oembed-lottie-url-into-wordpress-block-1754x424.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/483;\" \/><\/figure><\/div>\n\n\n<p>Ihre Animation wird noch nicht funktionieren. Zuerst m\u00fcssen Sie die Lottie Player JavaScript-Datei in WordPress laden.<\/p>\n\n\n\n<p>Um dies zu tun, kehren Sie zum LottieFiles Web Player zur\u00fcck und kopieren Sie den Skript-Tag, der mit \u201c<span style=\"font-family: 'courier new', courier, monospace;\">&lt;script&gt;<\/span>\u201d beginnt und mit \u201c<span style=\"font-family: 'courier new', courier, monospace;\">&lt;\/script&gt;<\/span>\u201d endet:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"925\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-player-javascript-file.png\" alt=\"Lottie Player JavaScript-Datei\" class=\"wp-image-38492 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-player-javascript-file-300x139.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-player-javascript-file-1024x474.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-player-javascript-file-768x355.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-player-javascript-file-1536x711.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-600x278.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-1200x555.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-730x338.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-1460x676.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-784x363.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-1568x726.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-877x406.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-player-javascript-file-1754x812.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/925;\" \/><\/figure><\/div>\n\n\n<p>Jetzt gehen Sie zu WordPress und installieren Sie das <a href=\"https:\/\/wordpress.org\/plugins\/custom-css-js\/\" target=\"_blank\" rel=\"noopener\">Simple Custom CSS and JS Plugin<\/a>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"585\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/simple-custom-css-js-plugin.png\" alt=\"Installieren Sie das Simple Custom CSS und JS Plugin\" class=\"wp-image-38499 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/simple-custom-css-js-plugin-300x88.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/simple-custom-css-js-plugin-1024x300.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/simple-custom-css-js-plugin-768x225.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/simple-custom-css-js-plugin-1536x450.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-600x176.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-1200x351.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-730x214.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-1460x427.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-784x229.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-1568x459.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-877x257.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/simple-custom-css-js-plugin-1754x513.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/585;\" \/><\/figure><\/div>\n\n\n<p>Nach der Aktivierung gehen Sie zum Armaturenbrett des Plugins und w\u00e4hlen <i>HTML-Code hinzuf\u00fcgen<\/i>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"573\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin.png\" alt=\"HTML-Code mit dem Simple Custom CSS and JS Plugin hinzuf\u00fcgen\" class=\"wp-image-38483 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-300x86.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1024x294.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-768x220.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1536x440.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-600x172.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1200x344.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-730x209.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1460x418.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-784x225.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1568x449.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-877x251.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-html-code-with-simple-custom-css-and-js-plugin-1754x503.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/573;\" \/><\/figure><\/div>\n\n\n<p>Sie k\u00f6nnen Ihrem Code einen Titel wie \u201eAdds Lottie Player\u201c geben. F\u00fcgen Sie dann das Script-Tag im Editor ein und klicken Sie auf <i>Ver\u00f6ffentlichen<\/i>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"662\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-lottie-players-to-wordpress-custom-html.png\" alt=\"F\u00fcgen Sie den Lottie Player zu WordPress mit angepasstem HTML hinzu\" class=\"wp-image-38484 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-lottie-players-to-wordpress-custom-html-300x99.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1024x339.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-lottie-players-to-wordpress-custom-html-768x254.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1536x509.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-600x199.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1200x397.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-730x242.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1460x484.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-784x260.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1568x519.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-877x290.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/add-lottie-players-to-wordpress-custom-html-1754x581.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/662;\" \/><\/figure><\/div>\n\n\n<p>Kehren Sie nun zur Seite zur\u00fcck, auf der Sie Ihren HTML-Code eingef\u00fcgt haben. Sie sollten Ihre Lottie-Animation sehen, wenn Sie zur Vorschau wechseln:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1999\" height=\"846\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-animation-added-to-wordpress.png\" alt=\"Lottie-Animation zu WordPress via HTML und JavaScript hinzugef\u00fcgt\" class=\"wp-image-38489 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress.png.webp 1999w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-animation-added-to-wordpress-300x127.png 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-animation-added-to-wordpress-1024x433.png 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-animation-added-to-wordpress-768x325.png 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/lottie-animation-added-to-wordpress-1536x650.png 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-600x254.png.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-1200x508.png.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-730x309.png.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-1460x618.png.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-784x332.png.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-1568x664.png.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-877x371.png.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2023\/01\/lottie-animation-added-to-wordpress-1754x742.png.webp 1754w\" data-sizes=\"(max-width: 1999px) 100vw, 1999px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1999px; --smush-placeholder-aspect-ratio: 1999\/846;\" \/><\/figure><\/div>\n\n\n<p>Wenn die Animation zu gro\u00df oder zu klein ist, k\u00f6nnen Sie die Standardparameter im HTML-Code \u00e4ndern, wo es hei\u00dft <i><span style=\"font-family: 'courier new', courier, monospace;\">style= \u201cwidth: X; height: X;\u201d<\/span>.<\/i><\/p>\n\n\n\n<h2 id=\"h-add-lottie-animations-to-your-site-today\" class=\"wp-block-heading\"><b>F\u00fcgen Sie Ihrer Website noch heute Lottie-Animationen hinzu<\/b><\/h2>\n\n\n\n<p>Da Bilder und Videos auf fast jeder Webseite erscheinen, wird deren Einbindung in Ihre Seiten wahrscheinlich nicht dazu f\u00fchren, dass Ihre Designs hervorstechen. Sie k\u00f6nnen jedoch Lottie-Animationen auf Ihrer Seite hinzuf\u00fcgen, um Besucher zu beeindrucken, Ihre Markenidentit\u00e4t widerzuspiegeln und das Engagement zu verbessern.<\/p>\n\n\n\n<p>Zusammenfassend gibt es hier drei M\u00f6glichkeiten, <a href=\"https:\/\/lottiefiles.com\/\" target=\"_blank\" rel=\"noopener\">Lottie-Animationen<\/a> zu Ihrer Website hinzuzuf\u00fcgen:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Lottie-Animationen mit oEmbed hinzuf\u00fcgen.<\/li>\n\n\n\n<li>Lottie-Animationen mit dem <a href=\"https:\/\/wordpress.org\/plugins\/lottiefiles\/\" target=\"_blank\" rel=\"noopener\">Lottie-Block f\u00fcr Gutenberg<\/a> Plugin hinzuf\u00fcgen.<\/li>\n\n\n\n<li>Lottie-Animationen mit HTML und JavaScript hinzuf\u00fcgen.<\/li>\n\n\n<\/ol>\n\n\n\n<p>Eine weitere M\u00f6glichkeit, Ihre Website von den anderen abzuheben, besteht darin, benutzerdefinierte Seiten zu entwerfen, die einzigartig f\u00fcr Ihre Marke sind. Bei DreamHost k\u00f6nnen wir Ihnen eine Website erstellen, die einmalig ist, <a href=\"https:\/\/www.dreamhost.com\/blog\/de\/wie-sie-ihre-website-fur-mobile-gerate-optimieren\/\" target=\"_blank\" rel=\"noopener\">mobilfreundlich<\/a> und f\u00fcr Suchmaschinen optimiert. Schauen Sie sich heute <a href=\"https:\/\/www.dreamhost.com\/de\/professionelle-dienste\/design\/individuelles-webdesign\/\" target=\"_blank\" rel=\"noopener\">unsere Webdesign-Pl\u00e4ne<\/a> an!<\/p>\n\n\n\n\n<div\n\tclass=\"article-cta-shared article-cta-small\"\n>\n    <div class=\"tr-img-wrap-outer jsLoading\"><img decoding=\"async\" class=\"js-img-lazy \" src=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/lazy-loading-transparent.webp\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder.webp 1x, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder-x2.webp 2x\"  alt=\"Ad background image\" \/><\/div>\n\n\n\n\n  <div class=\"content-btm\">\n    <h2\n      class=\"h2--md\"\n    >\n      Erstellen Sie eine sch\u00f6ne Website, auf die Sie stolz sein k\u00f6nnen\n    <\/h2>\n    <p\n      class=\"p--md\"\n    >\n      Unsere Designer werden eine wundersch\u00f6ne Website von Grund auf neu erstellen, die perfekt zu Ihrer Marke passt.\n    <\/p>\n\n            <a\n            href=\"https:\/\/www.dreamhost.com\/de\/professionelle-dienste\/design\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            Mehr erfahren                    <\/a>\n\n  <\/div>\n<\/div>\n\n\n<p><script src=\"https:\/\/unpkg.com\/@lottiefiles\/lottie-player@latest\/dist\/lottie-player.js\"><\/script><\/p>\n\n\n\n","protected":false},"excerpt":{"rendered":"<p>Auff\u00e4llige Bilder und Videos sind eine gro\u00dfartige M\u00f6glichkeit, Online-Besucher zu beeindrucken. Jedoch verwenden fast alle Websites diese, um das Benutzererlebnis (UX) zu verbessern. Daher reicht es nicht mehr aus, diese Standardvisuals Ihren Seiten hinzuzuf\u00fcgen, um Ihre Website von der Masse abzuheben. Gl\u00fccklicherweise k\u00f6nnen Sie Ihrer Website Lottie-Animationen hinzuf\u00fcgen, um [\u2026]<\/p>\n","protected":false},"author":1058,"featured_media":38502,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_metadesc":"","toc_headlines":"[[\"h-the-benefits-of-adding-lottie-animations-to-your-site\",\"Die Vorteile von Lottie-Animationen auf Ihrer Website\"],[\"h-how-to-add-lottie-animations-to-your-site-3-ways\",\"Wie man Lottie-Animationen auf Ihrer Website hinzuf\u00fcgt (3 Methoden)\"],[\"h-add-lottie-animations-to-your-site-today\",\"F\u00fcgen Sie Ihrer Website noch heute Lottie-Animationen hinzu\"]]","hide_toc":false,"footnotes":""},"categories":[14515,14509,14511],"tags":[],"class_list":["post-57473","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-entwicklerzentrum-de","category-webdesign-de","category-wordpress-de"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.3 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt - DreamHost Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt\" \/>\n<meta property=\"og:description\" content=\"Auff\u00e4llige Bilder und Videos sind eine gro\u00dfartige M\u00f6glichkeit, Online-Besucher zu beeindrucken. Jedoch verwenden fast alle Websites diese, um das Benutzererlebnis (UX) zu verbessern. Daher reicht es nicht mehr aus, diese Standardvisuals Ihren Seiten hinzuzuf\u00fcgen, um Ihre Website von der Masse abzuheben. Gl\u00fccklicherweise k\u00f6nnen Sie Ihrer Website Lottie-Animationen hinzuf\u00fcgen, um [\u2026]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/\" \/>\n<meta property=\"og:site_name\" content=\"DreamHost Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DreamHost\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-01-04T15:00:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-01-16T19:31:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"900\" \/>\n\t<meta property=\"og:image:height\" content=\"598\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Ian Hernandez\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:site\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ian Hernandez\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt - DreamHost Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/","og_locale":"en_US","og_type":"article","og_title":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt","og_description":"Auff\u00e4llige Bilder und Videos sind eine gro\u00dfartige M\u00f6glichkeit, Online-Besucher zu beeindrucken. Jedoch verwenden fast alle Websites diese, um das Benutzererlebnis (UX) zu verbessern. Daher reicht es nicht mehr aus, diese Standardvisuals Ihren Seiten hinzuzuf\u00fcgen, um Ihre Website von der Masse abzuheben. Gl\u00fccklicherweise k\u00f6nnen Sie Ihrer Website Lottie-Animationen hinzuf\u00fcgen, um [\u2026]","og_url":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/","og_site_name":"DreamHost Blog","article_publisher":"https:\/\/www.facebook.com\/DreamHost\/","article_published_time":"2023-01-04T15:00:18+00:00","article_modified_time":"2025-01-16T19:31:11+00:00","og_image":[{"width":900,"height":598,"url":"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg","type":"image\/jpeg"}],"author":"Ian Hernandez","twitter_card":"summary_large_image","twitter_creator":"@dreamhost","twitter_site":"@dreamhost","twitter_misc":{"Written by":"Ian Hernandez","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#article","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/"},"author":{"name":"Ian Hernandez","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/220faf2464d5ae08e41cf5f3b28fdc96"},"headline":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt","datePublished":"2023-01-04T15:00:18+00:00","dateModified":"2025-01-16T19:31:11+00:00","mainEntityOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/"},"wordCount":1312,"publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg","articleSection":["Entwicklerzentrum","Webdesign","WordPress"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/","name":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt - DreamHost Blog","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#primaryimage"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg","datePublished":"2023-01-04T15:00:18+00:00","dateModified":"2025-01-16T19:31:11+00:00","breadcrumb":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#primaryimage","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2023\/01\/Adding-Lottie-Animations-Feature.jpg","width":900,"height":598,"caption":"How to Add Lottie Animations to Your Site"},{"@type":"BreadcrumbList","@id":"https:\/\/www-dev.dreamhost.com\/blog\/de\/hinzufugen-von-lottie-animationen\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dhblog.dream.press\/blog\/"},{"@type":"ListItem","position":2,"name":"Wie man Lottie-Animationen zu Ihrer Seite hinzuf\u00fcgt"}]},{"@type":"WebSite","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website","url":"https:\/\/www-dev.dreamhost.com\/blog\/","name":"DreamHost Blog","description":"","publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-dev.dreamhost.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization","name":"DreamHost","url":"https:\/\/www-dev.dreamhost.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","contentUrl":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","width":1200,"height":168,"caption":"DreamHost"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DreamHost\/","https:\/\/x.com\/dreamhost","https:\/\/www.instagram.com\/dreamhost\/","https:\/\/www.linkedin.com\/company\/dreamhost\/","https:\/\/www.youtube.com\/user\/dreamhostusa"]},{"@type":"Person","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/220faf2464d5ae08e41cf5f3b28fdc96","name":"Ian Hernandez","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","caption":"Ian Hernandez"},"description":"Ian is a Product Designer based in Los Angeles, California. He is responsible for driving brand and product design at DreamHost, developing and maintaining our internal design system, and writing frontend code when he can. In his free time, he enjoys walking his dog, learning history, and discovering new music online and irl. Connect with him on LinkedIn: https:\/\/www.linkedin.com\/in\/ianhernandez23\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/author\/ianh\/"}]}},"lang":"de","translations":{"de":57473,"en":38481,"pt":57470,"es":38507,"pl":51785,"uk":57457,"ru":57494,"it":67915,"fr":69417,"nl":69439},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57473","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/users\/1058"}],"replies":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/comments?post=57473"}],"version-history":[{"count":4,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57473\/revisions"}],"predecessor-version":[{"id":62814,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57473\/revisions\/62814"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media\/38502"}],"wp:attachment":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media?parent=57473"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/categories?post=57473"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/tags?post=57473"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}