Getting Started
Role Manager
Topbar
Elements Panel
Form Builder
Media Manager
Style Panel
Page Settings
AI Generator
Dynamic Data Basics
Content Manager
Figma to Droip
API Integrations
Let's Learn
Getting Started
Role Manager
Topbar
Elements Panel
Form Builder
Media Manager
Style Panel
Page Settings
AI Generator
Dynamic Data Basics
Content Manager
Figma to Droip
API Integrations
Apart from the plethora of elements and the various styling options on Droip, you can also add Custom Code. This is useful if you wish to customize your page further and make it your own using HTML, CSS & Javascript.
📝 Note: There may be cases where your Custom Code interferes with Droip’s performance and thus we cannot promise complete compatibility.
Compatible Code
As mentioned earlier, the compatible code that you can use is HTML, CSS & Javascript.
In the case of HTML Tags, make sure to use the appropriate opening and closing tags to ensure your code will work as it should. And, keep in mind not to include the tags <html>, <body>, or <head> in your custom code as it will cause your site/page to break.
Adding Custom Code
To add your Custom Code, head over to Pages > Settings > Custom Code. Here, you’ll find the following two text boxes:
- Inside
<head>Tag: Enter code inside the<head>tag. - Before
</body>Tag: Enter code that’ll be placed before the</body>tag.
Inside Tag
Inside <head> Tag
Code added here will be placed after <head> and before </head> tags. HTML tags like <link>, <meta>, and <style></style> must be placed here. You can also add the <script></script> tags but that will slow down your page’s load speed.
Before </body> Tag
Code added here will be placed before closing </body> tag. One thing to note is that adding <script></script> tags here instead of inside <head> tag usually helps to improve the site’s performance.
