{"id":880485,"date":"2023-10-21T14:37:25","date_gmt":"2023-10-21T19:37:25","guid":{"rendered":"https:\/\/blogging-techies.com\/ge\/so-erstellen-sie-einen-benutzerdefinierten-formteiler-in-wordpress\/"},"modified":"2023-10-21T14:37:25","modified_gmt":"2023-10-21T19:37:25","slug":"so-erstellen-sie-einen-benutzerdefinierten-formteiler-in-wordpress","status":"publish","type":"post","link":"https:\/\/blogging-techies.com\/ge\/so-erstellen-sie-einen-benutzerdefinierten-formteiler-in-wordpress\/","title":{"rendered":"So erstellen Sie einen benutzerdefinierten Formteiler in WordPress"},"content":{"rendered":"<p>M\u00f6chten Sie benutzerdefinierte Formteiler zu Ihrer WordPress-Website hinzuf\u00fcgen?<\/p>\n<p>Formteiler k\u00f6nnen Ihre Inhalte auf attraktive und auff\u00e4llige Weise organisieren.  Sie k\u00f6nnen auch die wichtigsten Inhalte Ihrer Website hervorheben, damit Besuchern und Kunden keine wichtigen Informationen entgehen. <\/p>\n<p>In diesem Artikel zeigen wir Ihnen, wie Sie in WordPress einen benutzerdefinierten Formteiler erstellen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<h4 class=\"wp-block-heading\">Warum einen benutzerdefinierten Formteiler in WordPress erstellen? <\/h4>\n<p>Ein Formteiler ist eine Art Abschnittstrenner, der zwischen Inhaltsbl\u00f6cken hinzugef\u00fcgt wird.<\/p>\n<p>Diese Trennlinien k\u00f6nnen einfach sein, beispielsweise eine horizontale Linie, die mit integrierten WordPress-Bl\u00f6cken erstellt wird.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Mit diesen einfachen Trennw\u00e4nden k\u00f6nnen Sie Inhalte organisieren und trennen, was besonders auf Seiten n\u00fctzlich ist, die viele verschiedene Themen abdecken. <\/p>\n<p>Sie k\u00f6nnen auch erweiterte Formteiler erstellen, indem Sie Plugins f\u00fcr den Seitenersteller und andere Webdesign-Software verwenden.  Diese k\u00f6nnen die wichtigsten Inhalte Ihrer Website hervorheben, sodass sie f\u00fcr Besucher und Kunden hervorstechen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Ein professionell aussehender Formteiler kann eine Seite auch interessanter und attraktiver machen.<\/p>\n<p>Sie k\u00f6nnen sie beispielsweise verwenden, um einen einzigartigen Hintergrund f\u00fcr Ihr E-Mail-Newsletter-Anmeldeformular zu erstellen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Schauen wir uns nun an, wie Sie in WordPress einen benutzerdefinierten Formteiler erstellen k\u00f6nnen.  Nutzen Sie einfach die folgenden Quicklinks, um direkt zu der Methode zu gelangen, die Sie verwenden m\u00f6chten.<\/p>\n<h4 class=\"wp-block-heading\" id=\"aioseo-method-1-create-a-custom-shape-divider-without-a-wordpress-plugin-easy\">Methode 1. Erstellen Sie einen einfachen Formteiler (kein Plugin erforderlich)<\/h4>\n<p>Der einfachste Weg, einen benutzerdefinierten Formteiler zu WordPress hinzuzuf\u00fcgen, ist die Verwendung des integrierten Separator-Blocks. <\/p>\n<p>Mit dieser Methode k\u00f6nnen Sie einen horizontalen Linientrenner zwischen jedem WordPress-Block hinzuf\u00fcgen und dann die Farbe und den Stil der Linie anpassen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Mit dieser Methode k\u00f6nnen Sie keine verschiedenen Formulare zu WordPress hinzuf\u00fcgen und die Anpassungseinstellungen sind begrenzt.  Da Sie jedoch kein zus\u00e4tzliches WordPress-Plugin installieren m\u00fcssen, ist dies die einfachste M\u00f6glichkeit, einfach einen Splitter zu Ihrer Website hinzuzuf\u00fcgen.<\/p>\n<p>\u00d6ffnen Sie zun\u00e4chst einfach den Beitrag oder die Seite, auf der Sie eine horizontale Trennlinie hinzuf\u00fcgen m\u00f6chten, im Inhaltseditor.  Klicken Sie dann auf die Schaltfl\u00e4che \u201e+\u201c an der Stelle, an der Sie die Trennlinie platzieren m\u00f6chten.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Geben Sie im Popup-Fenster \u201eTrennzeichen\u201c ein.<\/p>\n<p>Wenn der richtige Block erscheint, klicken Sie, um ihn der Seite oder dem Beitrag hinzuzuf\u00fcgen. <\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Um den Standard-Trennblock anzupassen, klicken Sie darauf und verwenden Sie dann die Einstellungen im Men\u00fc rechts.<\/p>\n<p>Mit den Schaltfl\u00e4chen im Abschnitt \u201eStile\u201c k\u00f6nnen Sie zwischen Standard, breiter Linie und Punkten wechseln.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie k\u00f6nnen auch die Farbe der Linie \u00e4ndern, um sie an den Rest Ihres Themas oder Brandings anzupassen.<\/p>\n<p>Klicken Sie dazu auf \u201eHintergrund\u201c und w\u00e4hlen Sie dann im erscheinenden Popup eine Farbe aus.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Wenn Sie mit dem Aussehen des Teilers zufrieden sind, k\u00f6nnen Sie auf die Schaltfl\u00e4che \u201eVer\u00f6ffentlichen\u201c oder \u201eAktualisieren\u201c klicken, um den Formteiler zu aktivieren. <\/p>\n<h4 class=\"wp-block-heading\" id=\"aioseo-method-2-create-a-custom-shape-divider-in-wordpress-using-a-page-builder-recommended\">Methode 2. Erstellen Sie einen benutzerdefinierten Formteiler in WordPress mit einem Page Builder (empfohlen)<\/h4>\n<p>Wenn Sie unterschiedliche Formen verwenden und jeden Teil Ihrer Trennw\u00e4nde individuell gestalten m\u00f6chten, empfehlen wir die Verwendung von <a href=\"https:\/\/www.seedprod.com\" target=\"_blank\" title=\"SeedProd - Best Drag &#038; Drop WordPress Website Builder\" rel=\"noopener nofollow\">SemillaProd<\/a> Stecker. <\/p>\n<p>SeedProd ist das beste WordPress-Seitenerstellungs-Plugin auf dem Markt und erm\u00f6glicht es Ihnen, mit einem einfachen Drag-and-Drop-Editor einen benutzerdefinierten Formteiler zu jedem Abschnitt, jeder Zeile oder jeder Spalte hinzuzuf\u00fcgen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Es enth\u00e4lt au\u00dferdem \u00fcber 180 professionell gestaltete Vorlagen und \u00fcber 90 Bl\u00f6cke, mit denen Sie wundersch\u00f6ne benutzerdefinierte Homepages, Landingpages und mehr erstellen k\u00f6nnen.<\/p>\n<p><strong>Notiz:<\/strong> Da ist ein <a href=\"https:\/\/wordpress.org\/plugins\/coming-soon\/\" target=\"_blank\" rel=\"noopener nofollow\" title=\"The free SeedProd page builder plugin \">kostenlose Version von SeedProd<\/a> Es ist auf WordPress.org verf\u00fcgbar, wir werden jedoch die Pro-Version verwenden, da diese \u00fcber eine gro\u00dfe Auswahl an Formteilern verf\u00fcgt.<\/p>\n<p>Als Erstes m\u00fcssen Sie das SeedProd-Plugin installieren und aktivieren.  Weitere Einzelheiten finden Sie in unserer Schritt-f\u00fcr-Schritt-Anleitung zur Installation eines WordPress-Plugins.<\/p>\n<p>Bei der Aktivierung m\u00fcssen Sie Ihren Lizenzschl\u00fcssel eingeben.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Diese Informationen finden Sie unter <a href=\"https:\/\/app.seedprod.com\/login\" target=\"_blank\" rel=\"noopener nofollow\" title=\"Your SeedProd account\">ihr Konto<\/a> auf der SeedProd-Website.  Klicken Sie nach Eingabe des Lizenzschl\u00fcssels auf die Schaltfl\u00e4che \u201eSchl\u00fcssel \u00fcberpr\u00fcfen\u201c.<\/p>\n<p>Sobald dies erledigt ist, gehen Sie zu <strong>SeedProd \u00bb Seiten<\/strong> und klicken Sie auf die Schaltfl\u00e4che \u201eNeue Zielseite hinzuf\u00fcgen\u201c.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Danach ist es an der Zeit, eine Seitenlayoutvorlage auszuw\u00e4hlen.  SeedProd verf\u00fcgt \u00fcber eine Vielzahl professionell gestalteter Vorlagen, die Sie perfekt an Ihre WordPress-Website anpassen k\u00f6nnen. <\/p>\n<p>Um eine Vorlage auszuw\u00e4hlen, fahren Sie einfach mit der Maus dar\u00fcber und klicken Sie dann auf das \u201eH\u00e4kchen\u201c-Symbol.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Geben Sie als N\u00e4chstes einen Namen f\u00fcr die Seite ein.  SeedProd erstellt automatisch eine URL basierend auf dem Seitentitel, Sie k\u00f6nnen die URL jedoch beliebig \u00e4ndern. <\/p>\n<p>Beispielsweise m\u00f6chten Sie m\u00f6glicherweise einige relevante Schl\u00fcsselw\u00f6rter hinzuf\u00fcgen, die Suchmaschinen helfen, zu verstehen, worum es auf der Seite geht, und Ihre WordPress-SEO verbessern k\u00f6nnen. <\/p>\n<p>Wenn Sie mit den eingegebenen Informationen zufrieden sind, klicken Sie auf die Schaltfl\u00e4che \u201eSpeichern und mit der Bearbeitung der Seite beginnen\u201c.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie werden dann zum Drag-and-Drop-Seitenersteller weitergeleitet und k\u00f6nnen die Vorlage anpassen. <\/p>\n<p>Der SeedProd-Editor zeigt rechts eine Live-Vorschau Ihres Designs und links einige Blockkonfigurationen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Das linke Men\u00fc enth\u00e4lt auch Bl\u00f6cke, die Sie in Ihr Layout ziehen k\u00f6nnen.<\/p>\n<p>Sie k\u00f6nnen beispielsweise Standardbl\u00f6cke wie Schaltfl\u00e4chen und Bilder per Drag-and-Drop verschieben oder erweiterte Bl\u00f6cke wie Countdown-Timer, Kontaktformular, Social-Sharing-Schaltfl\u00e4chen und mehr verwenden.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Um einen Block anzupassen, klicken Sie einfach darauf, um ihn in Ihrem Layout auszuw\u00e4hlen.<\/p>\n<p>Das Men\u00fc auf der linken Seite zeigt alle Einstellungen an, mit denen Sie diesen Block konfigurieren k\u00f6nnen.  Sie k\u00f6nnen auch die Hintergrundfarben der Seite \u00e4ndern, Hintergrundbilder hinzuf\u00fcgen oder das Farbschema und die Schriftarten \u00e4ndern, um sie besser an Ihre Marke anzupassen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>SeedProd verf\u00fcgt au\u00dferdem \u00fcber \u201eAbschnitte\u201c, bei denen es sich um Sammlungen von Bl\u00f6cken handelt, die h\u00e4ufig zusammen verwendet werden.  SeedProd verf\u00fcgt beispielsweise \u00fcber einen Kopfzeilenbereich, ein hervorgehobenes Bild, einen Call-to-Action, Kundenstimmen, FAQs, Funktionen, Fu\u00dfzeilenbereiche und mehr.<\/p>\n<p>Um die verschiedenen Abschnitte anzuzeigen, klicken Sie einfach auf die Registerkarte \u201eAbschnitte\u201c.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie k\u00f6nnen Abschnitte und Bl\u00f6cke durch Ziehen und Ablegen in Ihrem Layout verschieben. <\/p>\n<p>Wenn Sie einen Block l\u00f6schen m\u00f6chten, bewegen Sie einfach den Mauszeiger dar\u00fcber und klicken Sie dann auf das Papierkorbsymbol, wenn es angezeigt wird.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Unabh\u00e4ngig davon, ob Sie einen SeedProd-Abschnitt verwenden oder nicht, k\u00f6nnen Sie jetzt einen benutzerdefinierten Formteiler erstellen.  Klicken Sie einfach auf den Abschnitt, die Zeile oder die Spalte, in der Sie die Trennlinie hinzuf\u00fcgen m\u00f6chten. <\/p>\n<p>Klicken Sie dann im linken Men\u00fc auf die Registerkarte \u201eErweitert\u201c.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Klicken Sie nun, um den Abschnitt \u201eFormteiler\u201c zu erweitern.<\/p>\n<p>Um zu beginnen, k\u00f6nnen Sie ausw\u00e4hlen, wo der Formteiler angezeigt werden soll, indem Sie die Schaltfl\u00e4che \u201eNach oben\u201c oder \u201eNach unten\u201c ausw\u00e4hlen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie k\u00f6nnen nun das Men\u00fc \u201eTyp\u201c \u00f6ffnen und den Formteiler ausw\u00e4hlen, den Sie verwenden m\u00f6chten. <\/p>\n<p>Wenn Sie verschiedene Formen ausw\u00e4hlen, wird die Live-Vorschau automatisch aktualisiert, sodass Sie verschiedene Stile ausprobieren und sehen k\u00f6nnen, welcher am besten aussieht. <\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Nachdem Sie einen Formteiler ausgew\u00e4hlt haben, k\u00f6nnen Sie ihn mit den neuen Einstellungen gestalten. <\/p>\n<p>Um zu beginnen, k\u00f6nnen Sie auf \u201eFarbe\u201c klicken und dann im angezeigten Popup eine neue Farbe ausw\u00e4hlen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sobald dies erledigt ist, k\u00f6nnen Sie die Trennlinie vergr\u00f6\u00dfern oder verkleinern, indem Sie die Schieberegler \u201eBreite\u201c und \u201eH\u00f6he\u201c ziehen.<\/p>\n<p>Wenn Sie bereits eine bestimmte Gr\u00f6\u00dfe im Auge haben, k\u00f6nnen Sie diese Zahlen in die Felder eintragen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie k\u00f6nnen auch versuchen, den Splitter umzudrehen, indem Sie auf den \u201eFlip\u201c-Schalter klicken, um ihn zu aktivieren oder zu deaktivieren.<\/p>\n<p>Standardm\u00e4\u00dfig wird die Trennlinie hinter dem Rest des Inhalts angezeigt, sodass Benutzer Text, Bilder oder andere Inhalte, die die Trennlinie \u00fcberlappen, deutlich erkennen k\u00f6nnen. <\/p>\n<p>Durch das Verschieben der Form nach vorne k\u00f6nnen jedoch einige interessante Effekte erzielt werden.  Wenn Sie sehen m\u00f6chten, wie das aussieht, aktivieren Sie einfach den Schalter \u201eNach vorne bringen\u201c.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Um weitere Teiler hinzuzuf\u00fcgen, befolgen Sie einfach den oben beschriebenen Vorgang.<\/p>\n<p>Sie k\u00f6nnen sogar einen Formteiler oben und unten in einem Bereich anbringen und so oft beeindruckende, auff\u00e4llige Ergebnisse erzielen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Sie k\u00f6nnen mit der Arbeit an der Seite fortfahren, indem Sie im Men\u00fc auf der linken Seite weitere Bl\u00f6cke hinzuf\u00fcgen und diese anpassen.<\/p>\n<p>Wenn Sie mit dem Aussehen der Seite zufrieden sind, klicken Sie auf die Schaltfl\u00e4che \u201eSpeichern\u201c.  Anschlie\u00dfend k\u00f6nnen Sie \u201eVer\u00f6ffentlichen\u201c ausw\u00e4hlen, um diese Seite zu ver\u00f6ffentlichen.<\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p><strong>So f\u00fcgen Sie Formteiler zu einem WordPress-Theme hinzu<\/strong><\/p>\n<p>Der Drag-and-Drop-Editor von SeedProd gibt Ihnen die Freiheit, jeder Seite einen einzigartigen Formteiler hinzuzuf\u00fcgen.  Manchmal m\u00f6chten Sie jedoch m\u00f6glicherweise dieselben Formteiler auf mehreren Seiten oder sogar Ihrem gesamten WordPress-Blog oder Ihrer gesamten WordPress-Website verwenden. <\/p>\n<p>Dies hilft Ihnen dabei, ein zusammenh\u00e4ngendes Design zu erstellen und kann Ihnen au\u00dferdem viel Zeit sparen.  In diesem Fall empfehlen wir, mit dem Theme Builder von SeedProd einen Formteiler zu Ihrem Theme hinzuzuf\u00fcgen.<\/p>\n<p>Mit SeedProd k\u00f6nnen Sie ein benutzerdefiniertes WordPress-Theme erstellen, ohne Code schreiben zu m\u00fcssen.  Erstellen Sie alle Dateien, aus denen Ihr Thema besteht, einschlie\u00dflich Seitenleiste, Kopfzeile, Fu\u00dfzeile, einzelne Beitr\u00e4ge und mehr. <\/p>\n<figure class=\"wp-block-image size-full\"><\/figure>\n<p>Anschlie\u00dfend k\u00f6nnen Sie diese Dateien mit dem bekannten Drag-and-Drop-Builder anpassen.  Dazu geh\u00f6rt auch das Hinzuf\u00fcgen von Formteilern nach demselben oben beschriebenen Verfahren.<\/p>\n<p>Wenn Sie das neue Theme mit SeedProd aktivieren, \u00fcberschreibt es Ihr bestehendes WordPress-Theme, daher sollten Sie diese Methode nur verwenden, wenn Sie Ihr aktuelles Theme ersetzen m\u00f6chten.<\/p>\n<p>Eine detaillierte Schritt-f\u00fcr-Schritt-Anleitung finden Sie in unserer Anleitung zum einfachen Erstellen eines benutzerdefinierten WordPress-Themes. <\/p>\n<p>Wir hoffen, dass Ihnen dieses Tutorial dabei geholfen hat, zu lernen, wie Sie in WordPress einen benutzerdefinierten Formteiler erstellen.  Vielleicht m\u00f6chten Sie auch erfahren, wie Sie Ihren Blog-Traffic steigern k\u00f6nnen, oder sich unsere Expertenauswahl der besten Social-Proof-Plugins f\u00fcr WordPress ansehen.<\/p>\n   ","protected":false},"excerpt":{"rendered":"<p>M\u00f6chten Sie benutzerdefinierte Formteiler zu Ihrer WordPress-Website hinzuf\u00fcgen? Formteiler k\u00f6nnen Ihre Inhalte auf attraktive und auff\u00e4llige Weise organisieren. Sie k\u00f6nnen auch die wichtigsten Inhalte Ihrer Website hervorheben, damit Besuchern und Kunden keine wichtigen Informationen entgehen. In diesem Artikel zeigen wir Ihnen, wie Sie in WordPress einen benutzerdefinierten Formteiler erstellen. Warum einen benutzerdefinierten Formteiler in WordPress [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":880486,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","fifu_image_url":"https:\/\/blogging-techies.com\/wp-content\/uploads\/2023\/06\/2.png","fifu_image_alt":""},"categories":[7],"tags":[],"_links":{"self":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts\/880485"}],"collection":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/comments?post=880485"}],"version-history":[{"count":0,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts\/880485\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/media\/880486"}],"wp:attachment":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/media?parent=880485"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/categories?post=880485"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/tags?post=880485"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}