Comment on page
✅
Apply with Devfolio Integration
Quick steps for Apply with Devfolio Integration button
- Include the script once, right before the closing </body> tag.
<script defer async src="https://apply.devfolio.co/v2/sdk.js"></script>
- Usage with React
If you're using React, load the SDK script dynamically for every page that has the 'Apply with Devfolio' button.
React.useEffect(() => {
const script = document.createElement('script');
script.src = 'https://apply.devfolio.co/v2/sdk.js';
script.async = true;
script.defer = true;
document.body.appendChild(script);
return () => {
document.body.removeChild(script);
}
}, []);
Copy and paste this code where you want the 'Apply with Devfolio' button to appear on your website.
Don't forget to replace YOUR-HACKATHON-SLUG with your hackathon's actual slug.
<div
class="apply-button"
data-hackathon-slug="YOUR-HACKATHON-SLUG"
data-button-theme="light"
style="height: 44px; width: 312px"
></div>
Even after adding the code, the button won't be visible right away. For it to be visible, your hackathon must be verified on Devfolio.
Name | Description | Value |
data-hackathon-slug | String | |
data-button-theme | Controls the appearance of the button. Refer to the screenshot below! | "light", "dark", "dark-inverted" |
Themes for Apply with Devfolio Button
As a security measure, we disable the button's functionality over website addresses other than the one you specify in the hackathon's setup.
In case your website is not being verified, you can check for the following:
- 1.You've added an
https://before your website URL - 2.Your slug value for the button is correct
- 3.The sponsor
<img>has the correct ALT tags
Last modified 3mo ago