# How does it work? 🧐

All websites are constructed with items called *elements* that are described using HTML. When collected together, they form your website and include all the text, images, and designs that are displayed on a user's screen when they visit your site. 

With DappHero, you add special attributes to each element you want to use with blockchain. When  DappHero runs, it will automatically replace your existing elements with super-powered blockchain-connected elements!

Take a quick look at the HTML example below, this is the HTML required to display the name of the currently connected ethereum network.  

```markup
<div 
    data-dh-feature="network"
    data-dh-property-name="true"
>
Network name will appear here! (Mainnet, Rinkeby, Ropsten, etc)
</div>
```

It's that easy

DappHero can do a wide range of things: get your user's Ethereum address, their 3Box profile name, even connect to Smart Contracts to read data from the blockchain or send money!&#x20;

### What if I don't know HTML?

No problem! We have been working hard to make DappHero easy to use for people who love no-code tools (just like we do!).&#x20;

Our first officially supported no-code platform is [WebFlow](https://docs.dapphero.io/integrations/using-weblow), a fantastic tool that lets you design brilliant websites AND uses DappHero without ever writing a line of code! We also have some [templates](https://docs.dapphero.io/integrations/using-weblow/start-from-a-template) that will help you get started quickly.&#x20;

We are working hard to support DappHero in other platforms, but generally anywhere that you can add a `<script/>` tag and `data` attributes to elements on your webpage, DappHero will work. Our users have been testing out DappHero on many platforms, you can see a [list of the latest](https://forum.dapphero.io/t/supported-platforms/16) on our forum.&#x20;

### Want us to support your favorite tool? [Let us know!](https://forum.dapphero.io/t/supported-platforms/16)