TroubleChute Logo
DISCORDS

Discord Custom Widgets Assistant | EASY Custom Widget Setup + Automation!


Published: Jun 27, 2026
Last Edit: Jun 27, 2026
Discord
1,699 Words, 8 Minutes.

What are Discord Custom Widgets?

Discord Custom Widgets are a new feature - More things for your profile! Spruce it up with images, GIFs and more.

This site/tool improves on Chloe Cinder’s - How to make Discord widgets guide

Jump to:

Create new application

1. Setup an Application in the Discord Developer Portal

Sign in on the Discord Developer Portal .

You should be on the Applications section (in the sidebar). Hit New Application and give it any name, tick the checkbox and click Create.

The name WILL appear at the top of the widget.

Fill out the form

Head to Social SDK under Games on the sidebar

Then fill in the form. You can put anything here.

Fill in Company Name, Team Location, Full Name, Work Email, Role, check the Consent checkbox at the bottom, and click Submit.

Now, copy the code below using the Copy button in the top-right.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
let _mods = webpackChunkdiscord_developers.push([[Symbol()],{},r=>r.c]);
webpackChunkdiscord_developers.pop();

let findByProps = (...props) => {
    for (let m of Object.values(_mods)) {
        try {
            if (!m.exports || m.exports === window) continue;
            if (props.every((x) => m.exports?.[x])) return m.exports;

            for (let ex in m.exports) {
                if (props.every((x) => m.exports?.[ex]?.[x]) && m.exports[ex][Symbol.toStringTag] !== 'IntlMessagesProxy') return m.exports[ex];
            }
        } catch {}
    }
}

findByProps("getAll").getAll().find(e=>e.getName() === "ApexExperimentStore").createOverride("2026-03-widget-config-editor", 1)
Go to the Widget tab

Press Ctrl+Shift+I or F12, and head to the Console tab. Paste in the code you copied and press Enter to run it.

You may be prompted to type allow pasting or something similar. Do so, then paste and press Enter if it didn’t work previously.

Refresh the page and under the Games sidebar you should see Widget.

If not, go back to Applications and then back into your Application.

Click then + Create Widget button once you see it.

Customization

Customization

Now comes the fun part. In the top-left you can choose which part of the widget you want to work on. Customize everything as you see fit.

If you want to set an image next to the app title, do so on the previous page under Overview > General Information

title image

Uploading images

Uploading Images 1

There are a few places you can upload images. Under Widget Top, on the Content tab you can set a title for your widget - As well as an image.

To upload, choose Image, and on the far-right you will see a Value Type and Asset Key.

Image upload 2

Select Application Asset under Value Type, and then click the image button next to Asset Key. This lets you upload an image from your system.

In the pop-up window choose + Add Asset or you can choose an image you have already uploaded.

Make public

After choosing Upload Asset you can select it on the list, then make sure to hit Make Public right under the Asset Key input.

This will need to be done for all images to be seen by others in Discord.

Setting text

Title heading
Entering text is simple, but you have a few options. For the simplest explanation; head into the required Title section.
Title heading

Under Presentation Type you can choose Number, or preferrably Text.

Then, under Value Type choose Custom String for simpler text. User Data is something else entirely. We’ll skip it here.

We now have a slightly improved widget, with text! You can do the same under Subtitle 1 and so on.

Text in image!

Subtitle

Subtitles

The Subtitle option lets you enter Text for a Label which you can turn on with a checkbox. This text appears before the normal Text, followed by a : colon.

You can also turn on and set an Icon exactly the same way we set an image. You can even upload GIFs!

Widget Top designs

For Widget Top there are 2 designs:

Hero
Hero image
Contained
Contained image

Widget Bottom

You are required to customize the Widget Bottom.

Stats Grid
Stats Grid
This requires that ALL 6 blocks are set with a Value, Label and optoinally an Icon
Progress
Progress bar image
Set the name, description, as well as the values for the progress bar!
Collection
Collection image
Collection is more of the same. Set 4 images, Names and descriptions to be displayed in a grid.

Progress widget

Variable 1

The Progress widget requires the use of User Data.

Enter any text here. This is a placeholder, or variable. What you name it doesn’t matter. The text you enter here doesn’t show on the widget.

Click the pencil icon next to it.

Setting variables

A new section will open at the bottom - In here under Sample Data you can fill in the same key we set if it’s not there already.

The text you enter on the right side under Value is what appears on your widget.

For the progress bar we’ll choose Number, and enter something like 50.

Now under Max Value on the sidebar you can set the max size of the progress bar. If we enter another key, and set the value to 100 the progress bar will be half full!

Wide progress bar

We now have a customized progress bar!

Finalizing

We’re basically done, but if you still have the Sample Data section open you can also find a Validation tab.

We still need to “Add Widget Preview” and “Mini Profile”.

Widget Preview

The Widget Preview is seen by you only.

Under Add Widget Preview choose Hero and under Content add any image you already uploaded.

Mini Profile

This one is seen by people when they click your profile in a chat or on the sidebar. The full thing is seen in your full-size profile.

Choose either Hero Stat or Contained Stat - The hero has the image fade on the left, the contained has it within a square.

Mini profile

Saving everything

Assuming the Validation tab at the bottom says No validation errors hit Save Changes in the top-right, followed by Publish right next to it.

Validation

Applying

Click the Back button at the top-left of the page.

OAuth
Select OAuth under Overview

Under Redirects choose Add and enter: https://discord.com or any other https website, then press Save Changes in the prompt that popped up.

Redirects

Further down under OAuth2 URL Generator. Make sure both openid and sdk.social_layer are checked. Select https://google.com under Select redirect URI and then copy the generated URL.

Full OAuth screenshot

Paste this link into a new tab BUT you need to change response_type=code to response_type=token – Change “code” to “token”

Press Authorize and you’ll be taken to Google, or the address you entered.

Equipping your new widget

Thanks to the Discord Previews server, and this thread ’s code from user .dziurwa:

1
2
3
4
5
let _mods=webpackChunkdiscord_app.push([[Symbol()],{},e=>e.c]);webpackChunkdiscord_app.pop();
let findByProps=(...e)=>{for(let t of Object.values(_mods))try{if(!t.exports||t.exports===window)continue;if(e.every(e=>t.exports?.[e]))return t.exports;for(let r in t.exports)if(e.every(e=>t.exports?.[r]?.[e])&&"IntlMessagesProxy"!==t.exports[r][Symbol.toStringTag])return t.exports[r]}catch{}};

// Usage
findByProps("getFeaturedApplicationIds").getFeaturedApplicationIds().push("APPLICATION_ID");

Head back to the Overview > General Information tab in the Discord Developers website.

Then find Application ID and click Copy.

Then click Copy next to the code above (as we’ve replaced APPLICATION_ID with the code you put in).

You will need to open the same Ctrl+Shift+I or F12 window in Discord itself on your desktop, or on the web. As long as you see your servers or channels you’re in the right place to run the code. Again on the Console tab paste in the code and hit Enter.

Nothing should happen once the code runs.

However: Head to User Settings by clicking the cogwheel next to your name in the bottom-left.

Click Edit Profiles right under your username in the top-left.

Under Profile Widgets choose Add Widgets, then + Add Widget and now you can choose your widget.

If you’re like me and it’s not there – It might already be suggested under Board on your profile! Just click the Check button and Save.

Widget

Finally:

Your game stats are still syncing. Keep playing! will appear forever, as there’s no game or app providing this info. If you’re using a Progress bar that will also be stuck as loading until we do this.

To do so we need PATCH some information to Discord’s API. A normal website cannot make this request directly because browsers block it with CORS, so the form above generates a terminal command instead. Your info and token do not leave this page until you paste and run one of the commands.

Copy Application ID

Application ID

This we copied earlier from Overview > General Information under Application ID.

Copy Discord User ID

Your Discord User ID

Click your username in the bottom-left of Discord and choose Copy User ID at the bottom of the popup.

If this is missing head to User Settings by clicking the cogwheel next to your name. Under the Developer tab turn on Developer Mode.

Copy Bot Token

Bot Token

Under Overview > Bot scroll down and press Reset Token.

Click Yes, do it! then you might need to verify with your password or 2-factor.

Finally you can click Copy under Token where the bot token is now visible!

Copy JSON

JSON string

Under Games > Widget.

At the bottom of your screen on the Sample Data tab you should see a <> Generate JSON button on the right-side. Click this and paste the value here:

Generate JSON button

Enter your values here:

Copy the generated command below and paste it into your terminal.

Due to User-Agent not being possible to set in browsers, you need to run the API command from somewhere that’s not a browser (That includes what you’re reading this in, as well as Discord itself).

PowerShell

On Windows hit Start or Windows and open a PowerShell window where you can paste the following command and hit Enter.

1
2
3
4
5
Invoke-RestMethod -Uri 'https://discord.com/api/v9/applications/APPLICATION_ID/users/DISCORD_USER_ID/identities/0/profile' -Method PATCH -Headers @{
  'Content-Type' = 'application/json'
  'Authorization' = 'Bot BOT_TOKEN'
  'User-Agent' = 'DiscordBot (https://github.com/discord/discord-api-docs, 1.0.0)'
} -Body 'JSONHERE'

curl

On Linux/Mac you can use this instead in a terminal there

1
2
3
4
5
6
7
curl -X PATCH 'https://discord.com/api/v9/applications/APPLICATION_ID/users/DISCORD_USER_ID/identities/0/profile' \
  -H 'Content-Type: application/json' \
  -H 'Authorization: Bot BOT_TOKEN' \
  -H 'User-Agent: DiscordBot (https://github.com/discord/discord-api-docs, 1.0.0)' \
  --data-binary @- <<'JSON'
JSONHERE
JSON

Just like that; you’re done! Your brand-new widget is set on your profile.

You can repeat this process just about as many times as you want, with one new Application per widget.

It’s a lot of steps, but there’s a LOT of functionality you can get from this.

TroubleChute © Wesley Pyburn (TroubleChute)
Support Me Privacy Policy Cookies Policy Terms of Service Contact