> ## Documentation Index
> Fetch the complete documentation index at: https://docs.x.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Follow Button JavaScript Factory Function

> Use twttr.widgets.createFollowButton to dynamically insert a Follow button on your page with a username, target element, custom options, and a promise callback.

The X for Websites JavaScript library supports dynamic insertion of a follow button using the `twttr.widgets.createFollowButton` function. Pass X username, target parent element, and any custom options.

The code snippets on this page assume `widgets.js` has successfully loaded on your page. Include an asynchronous script loader on your page while initializing `window.twttr` as described in our [JavaScript loader documentation](/x-for-websites/javascript-api/guides/set-up-x-for-websites). All JavaScript code depending on `widgets.js` should execute on or after `twttr.ready`.

## Arguments

| Parameter  | Description                            | Example value                          |
| ---------- | -------------------------------------- | -------------------------------------- |
| `username` | A X username                           | `'XDevelopers'`                        |
| `targetEl` | DOM node of the desired parent element | `document.getElementById('container')` |
| `options`  | Override default widget options        | `{ size: 'large' }`                    |

## Example

An element with a DOM ID of `container` exists on the page.

```html theme={null}
<div id="container"></div>
```

The code snippet below will create a new Follow button for the X username “XDevelopers” inserted into a page inside an element with a unique ID of `container`.

```javascript theme={null}
twttr.widgets.createFollowButton(
  'XDevelopers',
  document.getElementById('container'),
  {
    size: 'large'
  }
);
```

## Promises

The `twttr.widgets.createFollowButton` function returns a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise). You can execute code after a widget has been inserted onto your page by passing a callback to the resulting promise’s `then` function.

```javascript theme={null}
twttr.widgets.createFollowButton(...)
.then( function( el ) {
  console.log('Follow button added.');
});
```