{"id":371805,"date":"2023-03-27T18:12:00","date_gmt":"2023-03-27T15:12:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=371805"},"modified":"2023-03-27T18:18:24","modified_gmt":"2023-03-27T15:18:24","slug":"so-fuegen-sie-vorher-nachher-fotos-zu-ihrer-wordpress-site-hinzu","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/de\/so-fuegen-sie-vorher-nachher-fotos-zu-ihrer-wordpress-site-hinzu\/","title":{"rendered":"So f\u00fcgen Sie Vorher-Nachher-Fotos zu Ihrer WordPress-Site hinzu"},"content":{"rendered":"\n

Vorher-Nachher-Fotos sind eine der effektivsten Marketing-Taktiken. Der Weg zum endg\u00fcltigen Ergebnis ist oft lang und m\u00fchsam. Den Leuten zu zeigen, was am Ende dieses Weges steht, sorgt f\u00fcr ein sehr \u00fcberzeugendes Verkaufsgespr\u00e4ch.<\/p>\n

Wenn du Vorher-Nachher-Fotos auf deiner WordPress-Seite zeigen m\u00f6chtest, ben\u00f6tigst du weder Photoshop noch irgendwelche Designkenntnisse. In diesem kurzen Tutorial zeigen wir Ihnen, wie Sie schicke Vorher-Nachher-Fotos erstellen<\/strong>.<\/p>\n

Wie funktioniert der Vorher-Nachher-Fotoeffekt?<\/h2>\n

Es gibt viele M\u00f6glichkeiten, ein Vorher-Nachher-Bild zu erstellen, aber wenn Sie es schnell und gleichzeitig gut gestaltet<\/strong> haben m\u00f6chten, installieren Sie das Twenty20 Image Before-After-<\/a> Plugin. Wenn Sie dieses Plugin haben, k\u00f6nnen Sie jederzeit neue Vorher-Nachher-Fotos erstellen und sie auf jeder Seite Ihrer Website platzieren.<\/p>\n

Anstelle eines statischen Bildes erhalten Ihre Website-Besucher einen interaktiven Slider<\/strong>. Nat\u00fcrlich kann dieses Plugin f\u00fcr Vergleiche oder die Darstellung zweier Seiten desselben Produkts verwendet werden<\/strong>.<\/p>\n

Jetzt f\u00fchren wir Sie durch den Prozess der Einrichtung des Plugins und des Hinzuf\u00fcgens von Vorher- und Nachher-Fotos zu Ihrer WordPress-Website.<\/p>\n

Anzeigen des Vorher-Nachher-Fotos in WordPress<\/h2>\n

Da das Twenty20 Image Before-After-Plugin Open Source ist, finden Sie es im WordPress-Plugin-Verzeichnis. Gehen Sie einfach zum Admin-Panel und klicken Sie auf Plugins>Add New<\/strong>. Sie finden das ben\u00f6tigte Plugin, indem Sie seinen Namen in die Suchleiste eingeben.<\/p>\n

W\u00e4hlen Sie das Plugin aus und klicken Sie auf die Schaltfl\u00e4che \u201eInstallieren“. Sobald WordPress das Plugin heruntergeladen und installiert hat, wird eine Nachricht mit einem Aktivierungslink angezeigt. Klicken Sie darauf, um das Plugin zu aktivieren. Jetzt k\u00f6nnen Sie es verwenden eine Videoanleitung zur Plugin-Installation ben\u00f6tigen, finden Sie hier eine detaillierte Anleitung zur Installation von WordPress-Plugins<\/a>.<\/p>\n

\"So<\/a><\/p>\n

Wenn Sie sich entscheiden, ein Vorher-Nachher-Slider-Bild zu erstellen, gehen Sie zum Seiten-Backend. Sie sehen den Shortcode Twenty20.<\/p>\n

\"So<\/a><\/p>\n

Klicken Sie darauf, um die WordPress-Medienbibliothek zu \u00f6ffnen oder die gew\u00fcnschten Fotos hochzuladen. W\u00e4hlen Sie zwei Fotos aus und klicken Sie auf die Schaltfl\u00e4che Einf\u00fcgen.<\/p>\n

\"So<\/a><\/p>\n

Wenn Sie das tun, sehen Sie ein Popup mit Feldern, in denen Sie Text hinzuf\u00fcgen und die Breite, den Versatzwert, die Ausrichtung, die Triggeraktion, die Schiebereglerrichtung usw. anpassen k\u00f6nnen<\/strong>. Wenn Sie Ihr Vorher-Nachher-Foto anpassen, klicken Sie auf die Schaltfl\u00e4che Shortcode einf\u00fcgen.<\/p>\n

\"So<\/a><\/p>\n

Sehen Sie sich die Seite in der Vorschau an und pr\u00fcfen Sie, wie Ihr Vorher-Nachher-Bild aussieht. Wenn Sie den Griff zur Seite schieben, wird das andere Bild angezeigt.<\/p>\n

\"So<\/a><\/p>\n

Dieses WordPress-Plug-in f\u00fcr Vorher-Nachher-Fotos reagiert und funktioniert auf allen Ger\u00e4ten<\/strong>. Wie Sie sehen k\u00f6nnen, verf\u00fcgt es \u00fcber eine einfache und \u00fcbersichtliche Benutzeroberfl\u00e4che. Es unterst\u00fctzt WP Bakery Visual Composer, Elementor Page Builder und UX Builder von UXThemes<\/strong>.<\/p>\n

Jetzt sind Sie fertig. Mit diesem Plugin k\u00f6nnen Sie eine unbegrenzte Anzahl von Vorher- und Nachher-Bildern erstellen! Wenn Sie Ihre Website mit weiteren tollen Fotoeffekten bereichern m\u00f6chten, fahren Sie mit dieser Liste der besten WordPress-Slider-Plugins<\/a> fort .<\/p>\n

Aufnahmequelle: wpklik.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"

Hier ist eine Anleitung zum Hinzuf\u00fcgen von Vorher- und Nachher-Fotos mit einem einfachen WordPress-Plugin. Zeigen Sie Ihren Website-Besuchern die Kraft der Transformation!<\/p>\n","protected":false},"author":1,"featured_media":363616,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[567],"tags":[845],"class_list":["post-371805","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-grundlagen","tag-affiai-de"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/371805","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/comments?post=371805"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/371805\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media\/363616"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media?parent=371805"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/categories?post=371805"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/tags?post=371805"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}