Hi ,
I created a custom form and I uploaded it to github ,
How can I embed it on my site in webflow?
The form is a mix of HTML , js, CSS.
I can’t put it directly in webflow because of the 10,000 characters limit in the custom code.
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Hi @Maher you might link your site and your form so we see what you’re trying to do and can give some guidance. In general the answer is “probably yet” but the best approach depends on the specifics.
OPTION 1 - Use JSDELIVR. CSS and JS are easy. For the HTML, you’ll probably have to IFRAME it, or AJAX-embed it. You’ll need to handle your own form data capture.
OPTION 2 - Use JSDELVR for the CSS and JS only, then rebuild your form HTML in Webflow. That gives you far more styling control, breakpoints, etc. You get all your CSS and JS functionality, and you can also use Webflow’s built-in form data capture if you want to.
Here’s a read only link to my website Webflow - Master Class
Here’s how implemented the codes , my github reposit is also public.
For some reason it’s not working
I’m guessing you’re trying to implement your scripts here-
https://masterclass1.webflow.io/lead-page
However I don’t see your script references on staging or in your designer.
/test on this page I’m trying to add the custom code
I’m not sure what you’re trying to build or what I’m supposed to see.
I am also not familiar with the libraries you’re using, or how they are configured.
But for what it’s worth, I’m not seeing any script error, or 404 URLs, so there don’t seem to be obvious setup issues.
Also the <div> you’ve setup seems to have been expanded, I’m assuming by the animatedModal script. I’d assume everything is working exactly as you’ve set it up. Most likely you need some button to trigger the appearance of the modal.
You’ll want to dig into the library docs to figure out how that configuration should work.
Hi @Maher 
welcome to the forums.
I’ve gotten around this in the past by adding custom code on the page you want to use. The custom code is a Javascript tag with a source linking to the Github code you mentioned. I link to the “raw” code.
When the Webflow page loads, the Github hosted Javascript will load.
Thanks I fixed it! I used jsdeliver
Awesome @Maher!
I wanted to play with JS Deliver a bit myself so I did a quick build using it and screenshot’ed everything I did along the way.
Maybe it’ll help someone else who stumbles upon this thread 
Step 1
I create a tmp file with 20,000 characters. I wanted to really test the limits 
Step 2:
I create a Javascript file and added those 20k characters to a constant. Then added a simple JS alert popup after it.
Then I hosted it up on Github:
Step 3:
Went over to JS Deliver and looked up the URL I should use.
I love JS Deliver. I didn’t need to upload anything or link my Github account. It just snags the code for me when it’s called and distributes it across their CDN, nice!
This is what the URL looks like for me:
https://cdn.jsdelivr.net/gh/NoCodeQuest/webflow-10k-limit-bypassed/hello-20k.js
Step 4:
Bundled up the JS Deliver URL into a Javascript tag:
Step 5:
Added that JS tag to my Webflow page. I like to put these before the </body> tag so the rest of the site loads first.
You can see if I don’t use the JS tag and instead just paste the raw Javascript into Webflow I get the dreaded error:
Step 6:
Published my Webflow project, opened the live site:
Boom!
Worked soooooo well 
There’s a bunch more you could do to make development, better. But this is a great start! Thanks again Maher for prompting me to do this, hope it helps someone.
