Hi guys,
I’m trying to reproduce a button hover effect inspired by a codepen I discovered which looks amazing 
I’ve tried to reproduce the codepen code into a webflow custom embed code but it seems I must be missing something as I do not get the final “goo” effect…
Here is my simplified read-only link.
Here is the codepen I would like to simulate within webflow
Thank you for your help
Anthony
HTML code goes into the HTML embed.
CSS code goes inside the Head section wrapped in <style> </style> tags.
The JS code goes in the Before Body wrapped in <script> </script> tags
You’ve currently got everything in the embed.
Hi @magicmark, thank you for getting back at me !
You were right, I had everything on the embed component.
I tried to put the css in the head tag and js before the body tag but I’m still unsuccessful.
I have to do more digging, not sure where but I’ll dig
I’m playing with this right now as I’m not 100% sure either. I know you need to add some elements and give them the appropriate class names. So far I have the button with colours flashing.
I think it’s something like adding a container, a button, a few other div blocks, and the code will animate them accordingly.
This could be useful too… Creative Gooey Effects | Codrops
Ho thank you !
Well interesting because I did actually copied everything from the codepen.
I also compiled the CSS as it was displayed in a “weird” format SCSS (not sure why)
Should you find something somedays, let me know 
Cheers !
EDIT:
Awesome, I’ll have a look at your gooey effect link ! Looks so beautiful !!!
Ho my god this gooey effect is so amazing !
Can’t stop watching thos demo animation !
Thank you for sharing, looks like magic !
I found the solution and feel abit ashamed of myself.
I simply forgot to put the src=""to define the path of the scripts links
The goo effect works as expected now ! I can start to play around 
Where, where?! I want to play! 
There you go @magicmark !
I’m don’t know how to make the project “cloneable” though, so that you could save whatever you’re playing with Any idea ?
To make it cloneable - you will need to publicly showcase it on your profile and choose the cloneable option.
Or if you have a Pro plan you could privately transfer a copy to @magicmark account email address…and mine maybe too 
haha @StuM , I’m not yet on pro plan unfortunately. Hope to get more clients one day for that !
I just made “my” gooey project cloneable, thank you for sharing the how to link. All credit goes to Adrien Grsmto who wrote the codepen though I could not possibly EVER write magic code like this myself.
Link to the cloneable project: here
Link to the original codepen: there
Let me know if you could build something cool in webflow with it !
Thank you so much for sharing this Anthony! That’s a great CTA button which I will keep in my vault until the time comes to unleash it! A great fun button to share with the community if you’re happy to.
Well done for figuring it out too!
@magicmark you’re welcome ! I dug quite a bit on codepen to find some inspiration. I didn’t suspect it would’be actually so “easy” to implement someon’s work within webflow ! Custom code component trully is amazing Feel free to share it with the community yes !
I found a magicslider on codepen a while ago which is cloneable too, I edited it very slightly to make it dynamic so links in with CMS for clients before and after pics… Cloneable link is in my profile.
Some great finds on there once you figure out how to add them!
omg this is so cool !!
I definitely can use that on my own portfolio to show raw pictures and final postproduction result !
Really interesting, thanks for sharing !
