# Getting Started with Webflow

DappHero is fully equipped to work with [Webflow](https://webflow.com/), a popular drag-and-drop no-code tool for building websites. After adding a Script tag to your Webflow project, you can access all the power of DappHero by adding tags to your elements directly in the Webflow interface.&#x20;

To get started on Webflow:

* Signup to Webflow and [create an account](https://webflow.com/discover/popular)
* (Quick Start) Clone a pre-made template from the [DappHero team page](https://webflow.com/team/DappHero) and change the script tag
* (Clean Start) Create a new project and add a script tag (requires a paid Webflow plan)&#x20;
* Start building your site, using DappHero tags

### Signup To Webflow

![Getting started from a DappHero Template](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oPrdBUlITrdfFM-A9%2FgetSTarted.png?alt=media\&token=06825292-423a-4371-bcc5-556c6a4115de)

### Clone a template

Once you are signed into Webflow, you can revisit the [DappHero team page](https://webflow.com/team/DappHero) and choose a template to start with. Click "clone" to create a copy of the template to your account.&#x20;

![](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oQ2mo84_KD6yNPKe_%2Fclone%20project.jpg?alt=media\&token=d26711b2-b0c6-4f12-b864-2e713197c0eb)

### Create your Project

After you the template to your account, you can click "Create" to start editing.&#x20;

![](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oQZGbXjqJ4k95aNyK%2Fcreate%20project.jpg?alt=media\&token=7f3854df-7eaa-4484-9f9f-27307f4e3fa9)

### Change the Script tag

Each template comes with a script tag already added. If you have added custom smart contracts to your project, you will want to change the script tag for the one in your DappHero Project.&#x20;

#### Edit your page settings

{% hint style="info" %}
Note: the DappHero script tag needs to be added to each page you wish to enable DappHero.
{% endhint %}

![Click the small gear that appears when you hover over your page name](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oRDcWCWlMpVTcSQV_%2FAddTagToPage.jpg?alt=media\&token=0b3a188b-9ab8-476c-add5-f9895299a040)

#### Copy the script tag from your project

![Copy your script tag from your project](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oR6etmbmAhH4Mmb3w%2FScreen%20Shot%202020-02-11%20at%208.28.17%20AM.png?alt=media\&token=b8e4071e-dc3a-4b45-8917-ddc34ef79468)

#### Paste or Edit your Script Tag

![Scroll to the bottom of your Page settings, and paste/edit your script tag. ](https://3099038747-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lz7dd08wQiNE0Pjzqhz%2F-M-oOf_4S-AjkeeAp7iM%2F-M-oReVV_eSqwZmbFADH%2FAddScriptTag.jpg?alt=media\&token=4147e6ca-261c-49ab-adfa-a20d6e9d84b6)
