<aside> 💡 *Elevator pitch

*one unique, AI-generated t-shirt every day for a year.

</aside>

Steps for P5.js sketch on webflow

To embed a p5.js sketch on Webflow, you will need to follow these steps:

  1. Create your p5.js sketch in the p5.js editor or in your preferred code editor.
  2. Export your p5.js sketch as an HTML file by selecting "File" > "Export" > "Export as HTML" in the p5.js editor or by manually saving your code as an HTML file in your code editor.
  3. Upload your HTML file to a web hosting service or to a file sharing service such as Dropbox or Google Drive.
  4. In Webflow, go to the page where you want to embed your p5.js sketch and add a new "Embed" element to the page by clicking on the "+" icon in the left-hand sidebar and selecting "Embed" from the menu.
  5. Paste the URL of your uploaded HTML file into the "Embed Code" field of the Embed element.
  6. Adjust the size and position of the Embed element to fit your p5.js sketch on the page.
  7. Save and publish your changes to see your p5.js sketch embedded on the Webflow page.

Note that if you want to make changes to your p5.js sketch after embedding it on Webflow, you will need to make those changes in your original code editor and re-upload the updated HTML file to your web hosting or file sharing service.

HOW TO add p5.js code to webflow

STEPS:

(find the libary for p5.js under - https://cdnjs.com/libraries/p5.js)

<script src= “https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/p5.js” ><script>

<script>

CODEEE

</script>