Ein Formular zu Tumblr hinzufügen

Tumblr ist der einfachste Weg, um im Internet zu bloggen und Inhalte zu teilen. Jotform ist der einfachste Weg, um Webformulare zu erstellen, zu gestalten und zu teilen. Zwei Dienste mit der gleichen Mission: Dinge zu erleichtern. Lassen Sie uns diese beiden zusammenarbeiten lassen.

Tumblr ermöglicht es Ihnen, eine benutzerdefinierte Seite für Ihren Blog zu erstellen. Auf dieser Seite können Sie das Formular einbetten. Sie können ein Formular auch in Ihren Beiträgen einbetten, allerdings erfordert die Anzeige des Formulars einen kleinen Trick. Lesen Sie weiter, um zu erfahren, wie Sie ein Formular auf Tumblr einbetten können.

Watch on youtube

How to Add a Form to Tumblr

Abrufen des Einbettungscodes

Befolgen Sie diese Schritte, um den Einbettungscode für Ihren Blog oder Beitrag auf Tumblr zu kopieren.

1. Klicken Sie im Formular-Generator auf Veröffentlichen.
2. Klicken Sie anschließend auf Plattformen.

3. Wählen Sie dann Tumblr aus. Sie können die Suchleiste verwenden, um es einfach zu finden.

4. Klicken Sie im nächsten Bildschirm auf Code kopieren.

Ein Formular auf benutzerdefinierten Seiten einbetten

Tumblr unterstützt das Einbetten von HTML in benutzerdefinierte Blog-Seiten. Sie können Ihr Jotform Formular auf einer neuen oder bestehenden Seite mit dieser Methode einbetten. Um zu beginnen:

1. Gehe in deinem Tumblr-Dashboard auf die Konten-Registerkarte links auf der Seite.
2. Klicken Sie als Nächstes auf den Blog, in dem Sie das Formular anzeigen möchten.

3. Klicken Sie dann auf der rechten Seite der Seite auf Blog-Einstellungen.

4. Gehe zu Benutzerdefiniertes Theme und klicke auf Theme bearbeiten.

5. Im Theme-Editor scrollen Sie im linken Menü nach unten und klicken auf die Seite, auf der Sie Ihr Formular einbetten möchten. Wenn Sie es zu einer neuen Seite hinzufügen, klicken Sie einfach auf Seite hinzufügen und fahren Sie von dort fort.

6. Wählen Sie im nächsten Bildschirm ein Layout für Ihre Seite aus. Für das Standardlayout Standard Layout klicken Sie in der Bearbeitungsleiste auf die HTML-Schaltfläche und fügen Sie dann Ihren Einbettungscode des Formulars ein.

Wenn Sie ein individuelles Layout verwenden möchten, können Sie den Einbettungscode direkt in den Quellcode-Editor einfügen.

7. Klicken Sie oben auf Speichern, um Ihre Änderungen zu sichern. Wenn Sie sehen möchten, wie das eingebettete Formular aussieht, bevor Sie speichern, klicken Sie auf die Schaltfläche Vorschau aktualisieren, um die Änderungen zuerst auf der rechten Seite des Theme-Editors anzusehen.

Sie können eine Demo-Tumblr-Seite mit einem Formular hier ansehen.

Hinzufügen des Formulars zu Beiträgen mit der neuen Editor-Methode

Tumblr erlaubt im neuen Editor keine benutzerdefinierte HTML-Einbettung mehr, daher ist das Einbetten von Formularen nicht mehr möglich. Weitere Informationen zu diesem Update finden Sie hier. Derzeit können Sie das Formular nur als Link posten. Wenn der Legacy-Editor für Ihr Tumblr-Konto noch funktioniert, scrollen Sie nach unten, um die Schritte zum Einbetten eines Formulars zu erfahren.

Lassen Sie uns nun damit beginnen, den Link zu Ihrem Formular in einen Tumblr-Beitrag einzufügen:

1. In deinem Tumblr-Dashboard klicke auf die Option Text oder Link, um einen Beitrag zu erstellen.

1. Kopieren Sie den direkten Link zu Ihrem Formular und fügen Sie ihn in Ihren Beitrag ein.

3. Klicken Sie dann auf die Schaltfläche Jetzt posten.

Hinzufügen des Formulars zu Beiträgen mit der Legacy-Editor-Methode

Im Legacy-Editor von Tumblr können Sie beim Erstellen eines Beitrags einen HTML-Editor verwenden. Mit einer kleinen Anpassung im IFrame-Code können Sie Ihr Formular in einen Beitrag einbetten und anzeigen. So geht’s:

1. Holen Sie sich den iFrame-Einbettungscode des Formulars, das Sie in einen Beitrag einbetten möchten.
2. Entfernen Sie den Skriptteil des Einbettungscodes, sodass der verbleibende Code wie folgt aussieht:

<iframe id="JotFormIFrame-240890694020051" title="Contact Form" onload="window.parent.scrollTo(0,0)" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://form.jotform.com/240890694020051" frameborder="0" style=" min-width: 100%; height:539px; border:none;" scrolling="no" > </iframe>

3. Ändern Sie den Höhenwert auf die tatsächliche Höhe des Formulars (siehe hervorgehobenen Text unten). Der endgültige IFrame-Code sollte folgendermaßen aussehen:

<iframe id="JotFormIFrame-240890694020051" title="Contact Form" onload="window.parent.scrollTo(0,0)" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://form.jotform.com/240890694020051" frameborder="0" style=" min-width: 100%; height:850px; border:none;" scrolling="no" > </iframe>

Wenn Sie ein längeres Formular einbetten, empfehlen wir, den Scroll-Parameter auf Ja zu setzen.

4. Gehe zu deinem Tumblr-Dashboard und klicke auf die Schaltfläche Erstellen, um einen neuen Beitrag zu erstellen.
5. Wählen Sie Text aus der Liste der Optionen.

6. Klicken Sie im Beitragsfenster auf Einstellungen.
7. Wählen Sie HTML aus den Optionen des Texteditors.

8. Fügen Sie den angepassten IFrame-Code ein.
9. Klicken Sie auf die Schaltfläche Posten, und das war’s.