# Quickstart

Add a class-locked talent selector to your site.

Source: https://warcraftforever.com/developers/quickstart/

Add one script and choose where the calculator appears. Each mount renders directly into your page with isolated Shadow DOM styles. Definitions, images and translations load from Warcraft Forever. Your site only needs to store the class, code and layout revision.

## Mount the calculator

```html
<div id="talents"></div>
<script src="https://warcraftforever.com/talents/latest.js"></script>
<script>
  const talents = WarcraftForever.Talents.mount(
    document.getElementById('talents'),
    { class: 'paladin', maxLevel: 30 }
  );
  talents.on('submit', ({ class: classSlug, revision }) => {
    const code = talents.exportBuild('blizzard');
    // Persist these values in your application.
    console.log({ class: classSlug, code, revision });
  });
  talents.ready.catch(console.error);
</script>
```

The script leaves your links and other page content alone. Open the [interactive demo](https://warcraftforever.com/embed/talents/native-demo.html) to try every option and see received events. See [Content Security Policy](https://warcraftforever.com/developers/reference/security/) for host setup.

## Short namespace

`$WF` is an alias for `WarcraftForever` when the page has no existing `$WF` value. For example, `$WF.Talents.mount(...)` uses the same API. Both capabilities extend the same object, regardless of load order.

To avoid creating the alias, add `?alias=0` to every Warcraft Forever library script:

```html
<script src="https://warcraftforever.com/talents/latest.js?alias=0"></script>
<script src="https://warcraftforever.com/tooltips/latest.js?alias=0"></script>
```

This option also works on pinned release URLs. It does not remove an alias already created by another script. Existing `$WF` values, including `null`, are preserved. `WarcraftForever` remains available in all cases.
