---
metadata:
  - name: generator
    content: Diplodoc Platform v5.44.0
alternate:
  - https://yandex.com/dev/id/doc/en/suggest/but-const.md
  - https://yandex.com/dev/id/doc/ru/suggest/but-const.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/dev/id/doc/en/llms.txt

# Button generator

The interactive button generator below lets you customize the login button to match your website's design. Select parameter values that suit your needs. The generator will render the button and produce the code with these parameters.

<!-- source: en/_mdx/button-constructor.mdx -->
<!-- markdownlint-disable -->

<div class="ypd-preview">
    <a href="https://autofill.yandex.ru/suggest/button/constructor" target="_blank">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M18 19H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h5c.55 0 1-.45 1-1s-.45-1-1-1H5c-1.11 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-6c0-.55-.45-1-1-1s-1 .45-1 1v5c0 .55-.45 1-1 1zM14 4c0 .55.45 1 1 1h2.59l-9.13 9.13c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L19 6.41V9c0 .55.45 1 1 1s1-.45 1-1V3h-6c-.55 0-1 .45-1 1z"></path></svg>
    </a>
    <iframe src="https://autofill.yandex.ru/suggest/button/constructor" style="height: 500px"></iframe>
</div>
<!-- endsource: en/_mdx/button-constructor.mdx -->

Copy the generated code and paste it into the [authorization page](https://yandex.com/dev/id/doc/en/suggest/script-sdk-suggest.md). In the code, substitute:

* `oauthQueryParams` with the strings below.
   
   ```javascript
   {
      client_id: 'c46f0c53093440c39f12eff95a9f2f93',
      response_type: 'token',
      redirect_uri: 'https://examplesite.com/suggest/token'
   }
   ```

   Use the following parameter values in these strings:
   
   * For `client_id` — the ID of the OAuth app registered in [Step 1](https://yandex.com/dev/id/doc/en/register-client.md).
   * For `redirect_uri` — the URL of the callback page you entered in the **Redirect URI** field for the OAuth app that has this `client_id` (if you don't specify any URL, the first value from the **Redirect URI** field will be used).

* `tokenPageOrigin` with the "origin" of the [auxiliary page](https://yandex.com/dev/id/doc/en/suggest/script-sdk-suggest-token.md) that receives the token.