Webflow wird weithin als No-Code-Entwicklungsplattform vermarktet, was als sein größter Vorteil gilt. Dies bedeutet jedoch nicht, dass Sie Ihrem Design keine Codes hinzufügen können.
Während Webflow eine große Auswahl an Designoptionen bietet, möchten Sie Ihre Website möglicherweise noch weiter anpassen. Hier kommen benutzerdefinierte Codes ins Spiel, da das Hinzufügen dieser Codes eine größere Funktionalität ermöglicht.
Lesen Sie weiter, um zu erfahren, wie Sie benutzerdefinierten Code in Webflow hinzufügen.
Einschränkungen beim Hinzufügen von benutzerdefiniertem Code
Bevor Sie lernen, wie Sie benutzerdefinierten Code in Webflow hinzufügen, ist es wichtig, einige Grundregeln durchzugehen.
Bitte beachten Sie, dass es sich bei benutzerdefinierten Codes um erweiterte Modifikationen handelt. Daher können sie Konflikte mit der Webflow-Funktionalität verursachen, was zu unerwartetem Verhalten auf Ihrer Website führen kann. Daher gibt es keine Garantie dafür, dass jeder benutzerdefinierte Code vollständig kompatibel oder funktionsfähig ist.
Im Allgemeinen unterstützt Webflow die folgenden Codetypen:
Durch das Hinzufügen benutzerdefinierter JavaScript-Codes können Sie Ihrer Website viele Funktionen hinzufügen. Aus diesem Grund ist Webflow auch mit einer einfacheren Version von JavaScript namens jQuery ausgestattet. Sie können es in Verbindung mit JavaScript verwenden, um den Schreibvorgang zu erleichtern.
Beim Import von jQuery ist unbedingt auf dessen Version zu achten. Die Version muss mit der aktuell importierten Webflow-Version übereinstimmen, um Konflikte und unerwartetes Verhalten zu vermeiden. Darüber hinaus können Skripte wie onClick und onHover, die sich auf DOM-Ereignisse auswirken, auch zu unerwartetem Verhalten auf Ihrer Website führen.
Bei der Integration von benutzerdefiniertem Code können Sie keine serverseitigen Sprachen verwenden, einschließlich:
Ein weiterer wichtiger Aspekt, den es zu berücksichtigen gilt, ist die Länge des benutzerdefinierten Codes. Webflow erlegt die folgenden Zeichenbeschränkungen auf:
- 10.000 Zeichen für eingebettete Elemente
- 10.000 Zeichen für Codes auf einer Seite
- 20.000 Zeichen für Codes auf der gesamten Website
Wenn der Code, den Sie einbetten möchten, diese Zeichenbegrenzungen überschreitet, können Sie ihn nicht direkt einbetten. Sie können den Code jedoch auf einem anderen Server speichern und dann in Ihrem Code auf das Skript verweisen. Alternativ können Sie ein Drittanbieter-Tool verwenden, um Ihren benutzerdefinierten Code zu minimieren.
Der meiste benutzerdefinierte Code wirkt sich nicht auf Elemente im Designer-Modus aus, um unerwartetes Verhalten zu vermeiden. Daher sehen Sie die Ergebnisse erst nach der Veröffentlichung Ihrer Website.
Wenn Ihr benutzerdefinierter Code nicht funktioniert, kann Ihnen das Webflow-Supportteam leider nicht viel weiterhelfen, da benutzerdefiniertes Codieren nicht in deren Zuständigkeitsbereich fällt. Kundendienstrichtlinie. Versuchen Sie, Ihren Code noch einmal zu überprüfen und die zu besuchen Webflow-Forum für weitere Hilfe, falls erforderlich.
Webflow So fügen Sie benutzerdefinierten Code hinzu
Mit benutzerdefinierten Codes können Sie Ihre Website an Ihre spezifischen Bedürfnisse anpassen. Webflow stellte sicher, dass es sich an eine Vielzahl von Szenarien anpassen lässt, sodass Benutzer der gesamten Website oder nur einzelnen Seiten benutzerdefinierten Code hinzufügen können. Darüber hinaus können Sie auch bestimmte Beiträge anpassen. Das Beste daran ist, dass Sie Ihren benutzerdefinierten Code mit wenigen Klicks hinzufügen können, unabhängig vom Standort.
So fügen Sie benutzerdefinierten Code zu einer gesamten Website hinzu
Wenn Ihr benutzerdefinierter Code auf alle Seiten Ihrer Website angewendet werden muss, sind „Site-Einstellungen“ der richtige Ort. Durch das Hinzufügen des benutzerdefinierten Codes wird ein nahtloses Erlebnis über alle Elemente Ihrer Website hinweg gewährleistet.
Websiteweite Codes können in den Kopf- oder Fußzeilencode-Bereich eingefügt werden. Gehen Sie wie folgt vor, um im Abschnitt „Header-Code“ einen benutzerdefinierten Code hinzuzufügen:
- Öffnen Sie „Site-Einstellungen“.
- Gehen Sie zur Registerkarte „Benutzerdefinierter Code“.
- Fügen Sie den benutzerdefinierten Code zum Feld „Primärcode“ hinzu.
- Klicken Sie auf „Änderungen speichern“.
In diesem Abschnitt können Sie benutzerdefinierte Stile verwenden, auf externe Ressourcen verlinken und Metadaten hinzufügen.
Wenn Sie dem Abschnitt mit dem Fußzeilencode einen benutzerdefinierten Code hinzufügen möchten, gehen Sie erneut zur Registerkarte „Benutzerdefinierter Code“ und führen Sie dann die folgenden Schritte aus:
- Fügen Sie den benutzerdefinierten Code zum Feld „Fußzeilencode“ hinzu.
- Tippen Sie auf „Änderungen speichern“.
So fügen Sie benutzerdefinierten Code zu einer einzelnen Seite hinzu
Manchmal möchten Sie möglicherweise nur eine oder einige bestimmte Seiten Ihrer Website anpassen. Webflow hat diesen Prozess relativ einfach gemacht. Nachdem Sie den Code hinzugefügt haben, folgt er jedem Site-weiten Code in Ihrem Website-Markup.
Wenn Sie benutzerdefinierten Code zu einer einzelnen Seite hinzufügen, können Sie auswählen, wo er platziert werden soll.
Sie sollten immer HTML- und CSS-Codes innerhalb des Tags platzieren
. Allerdings müssen JavaScript-Codes im Tag-Bereich vor dem Tag stehen. Dies verbessert in der Regel die Leistung der Website als Links
