โœ…Apply with Devfolio Integration

Quick steps for Apply with Devfolio Integration button

Step 1: Add the script

  • 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);
    }
}, []);

Step 2: Specify button element(s)

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>

Button Settings

Name

Description

Value

data-hackathon-slug

The slug/key of your hackathon. Refer to the Links Tab for more details

String

data-button-theme

Controls the appearance of the button. Refer to the screenshot below!

"light", "dark", "dark-inverted"

Customisation via the data-button-theme attribute

Themes for Apply with Devfolio Button

Debugging

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 updated

Was this helpful?