Custom code in the head and body tags

If you have a premium Webflow account or if your project has an active Webflow hosting plan, you can add custom code and scripts that are applied to your entire site or to individual pages in your site. This can be useful for adding additional HTML, CSS, Javascript and more.

Add Custom HTML & CSS

<link>: The <link> tag defines a link between a document and an external resource and always goes in the <head> element.

<meta>: The <meta> tag provides metadata about your site and always goes in the <head> element.

<style></style>: The <style> tag defines CSS styles in your site and always goes in the <head> element.

<script></script>: The <script> tag allows you to embed Javascript in your site and can go in the <head> or <body> element. However, adding your <script> tags just before the closing <body> tag will ensure that your webpages load all content before the JavaScript is processed. This helps with page load speed and provides a better user experience. Learn more about embedding javascripts.

Starting on March 1st, 2018, newly published Webflow sites will include the latest version of jQuery (v3.3.1). Previously, Webflow sites were published using jQuery v2.2.0.

Head code - insert code before the closing head tag of your Webflow project

Code that is entered in the Head tag is applied to your entire site and is a way to link external resources, add meta data, and use custom styles in your document.

From your Project Settings, go to the Custom Code tab, enter your code in the Head Code section, and Save the Changes.

Learn more about the HTML Head element.

Footer code - insert code before the closing body tag of your Webflow project

Code that is entered in the Body tag is applied to your entire site and is a way to add things like scripts to your site.

From your Project Settings, go to the Custom Code tab, add your code into the Body Code section, and Save the Changes.

Custom code in your Page Settings

The code included in the custom code section of any page will only apply to that page, and will appear after any site-wide custom code.

Custom scripts will only appear on the published site. 

Insert code inside the < head > tag of a page

From inside the Designer, open a Page's settings, enter your code in the Head Code section, and Save the settings.

<link>: The <link> tag defines a link between a document and an external resource and always goes in the <head> element.

<meta>: The <meta> tag provides metadata about your site and always goes in the <head> element.

<style>: The <style> tag defines CSS styles in your site and always goes in the <head> element.

Insert code before the < / body > tag of a page

From inside the Designer, open a Page's settings, enter your code in the Body Code section, and Save the settings.