Recommended Free Tools
Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
To embed a Discord server widget in WordPress, enable the widget in Discord’s server settings, copy the generated iframe HTML, then paste it into a WordPress Custom HTML block. Preview the page to check its size and appearance. The widget is a public snapshot of server information—not an embedded Discord chat client.
Get the official widget code from Discord
-
Open the Discord server you want to display and go to Server Settings → Widget.
# Preview Product Price 1 
WordPress For Dummies (For Dummies (Computer/Tech)) $16.59 Buy on Amazon 2 
WordPress All-in-One For Dummies $25.51 Buy on Amazon 3 
Wordpress for Dummies $26.94 Buy on Amazon 4 
WordPress Web Design For Dummies $16.48 Buy on Amazon 5 
WordPress Web Design For Dummies $29.30 Buy on Amazon -
Enable the server widget. Review the invite settings if you want the widget to offer an invite.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy. -
Copy the premade HTML from Discord. Use the code Discord generates for your server rather than substituting an ID from another source. Discord describes the Widget tab as the place to enable the widget, adjust invite settings, and copy HTML or JSON code (Discord’s widget announcement).
#1 Best Overall
The generated code is an iframe. It may look like this, but treat your server’s generated code as authoritative:
<iframe src="https://discord.com/widget?id=YOUR_SERVER_ID&theme=dark"
width="350" height="500" allowtransparency="true" frameborder="0"
sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>The URL’s id identifies the server, and the theme parameter can be light or dark when supported by the generated code. Width and height set the iframe’s dimensions (example implementation guide).
Add the iframe to WordPress
-
Edit the page or post where the widget should appear. For a sitewide location, use a sidebar, footer, or another widget or template area supported by your theme.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.Rank #2
-
Add a Custom HTML block, then paste the complete iframe code into it.
-
Preview the page, adjust dimensions if needed, and publish when it displays as intended.
WordPress’s generic Embed block is designed for a third-party URL: you paste a URL and select Embed. Discord supplies iframe markup, so Custom HTML is the dependable choice. WordPress’s developer guidance recommends Custom HTML when a service does not support URL-based embedding (WordPress oEmbed guidance).
Rank #3
Fit the widget to your layout
Change the iframe’s width and height to fit its column, or use the block’s dimensions and site CSS for layout and spacing. WordPress documents additional CSS controls for blocks (WordPress Embed block support). On phones and narrow screens, preview the page and make sure the iframe does not cause horizontal overflow; avoid a fixed width larger than the available content area.
For a sitewide display, place the same generated iframe in a Custom HTML widget, sidebar, footer, or theme-supported template area. A theme or block editor may provide its own controls for width and placement.
What visitors can see in the widget
Discord’s Guild Widget data can include the server ID and name, an optional instant invite, accessible voice or stage channels, widget member objects, and a presence count. The documented member structure is limited to 100 widget users (Discord Guild Widget API documentation). This is a public, read-only server snapshot. It does not let visitors read or send messages in Discord text channels from your WordPress page.
Rank #4
Official iframe or WordPress plugin?
| Option | Setup and control | What to consider |
|---|---|---|
| Discord-generated iframe | Copy the code from Server Settings → Widget and add it to a Custom HTML block. Adjust dimensions and, where supported, the theme. | Uses Discord’s public widget; WordPress must allow the iframe to be saved. It displays the public widget snapshot. |
| Discord Display plugin | The WordPress.org listing describes a native widget for displaying a Discord server. | Check the listing’s update history and compatibility before installing. Older user reviews report issues such as missing buttons, non-clickable channels, or a zero online count; these are historical reports, not a guarantee of current behavior (WordPress.org listing). |
| TAL Server Widget for Discord plugin | The listing describes member counts and lists, avatars, status indicators, server branding, and an invitation button. | The listing says it uses Discord’s public Server Widget API and does not require a bot token or Discord application. Check its update history, WordPress and PHP compatibility, privacy policy, and permissions before use (WordPress.org listing). |
For most sites, start with the official iframe. Consider a plugin if you need a native widget or additional presentation controls, and evaluate its maintenance and compatibility as part of that choice.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Fix common display problems
-
Nothing appears: Confirm the server widget is enabled and the iframe’s
idmatches the intended server. Re-copy the generated code if necessary.Free tools Windows power users keep installed
One-click scans. No signup required.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy. -
The iframe disappears after saving: Use a Custom HTML block and check that your account can save unfiltered HTML. User permissions, the editor, security plugins, or hosting restrictions can filter iframe markup. WordPress.com notes that adding advanced iframe or script code with Custom HTML may require a plugin-enabled plan (WordPress.com Custom HTML block support).
Best Value
-
The widget is too wide or short: Adjust its width and height, then preview at desktop and narrow-screen sizes. Use block dimensions or CSS when you need the display to respond to the layout.
-
The invite or member details are missing: Check the server’s widget and invite settings. The widget only exposes the fields documented by Discord’s public endpoint.
-
You pasted an invite page URL: A Discord invite link is not the live server widget. Use the iframe code generated in the server’s Widget settings.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Scan for outdated or missing drivers - takes under a minuteDriver Scan →Clear out junk files and repair common Windows errorsFree Scan →Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Use an invite button instead of a live widget
If you only want a compact, branded call to action, add a normal WordPress button that links to a Discord invite. That is simpler to fit into a small space, but it is separate from embedding the official server widget and will not display its server snapshot.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
