Ravi Soni

Younes

Custom Connect Button Block for Discord adds a flexible Gutenberg block that allows users to connect or disconnect their Discord accounts from any page or post.
The block is fully customizable (text, colors, text, styles) and can display each user’s connection status, including the Discord roles they will be assigned (via the integration add-on).
Unlike shortcodes, this block supports unique design variations per page and offers a real-time preview toggle directly in the editor, so you can instantly view the exact frontend output without publishing.
<h3>Features</h3>
– Add a fully customizable “Connect to Discord” button. 
– Display a “Disconnect” button for already connected users. 
– Show assigned Discord roles dynamically. 
– Real-time live preview in the editor with Play/Stop toggle. 
– No coding required – all options are visual in the block editor.
<h3>Supported Add-ons</h3>
This block requires one of the following plugins for the actual Discord integration (authentication and role sync): 
– <a href="https://wordpress.org/plugins/pmpro-discord-add-on/" rel="ugc">PMPro Discord Add-on</a> 
– <a href="https://wordpress.org/plugins/expresstechsoftwares-memberpress-discord-add-on/" rel="ugc">ExpressTech MemberPress Discord Add-on</a> 
– <a href="https://wordpress.org/plugins/ultimate-member-discord-add-on/" rel="ugc">Connect Ultimate Member to Discord</a> 
– <a href="https://wordpress.org/plugins/connect-tutorlms-to-discord/" rel="ugc">Connect Tutor LMS to Discord</a>
This plugin’s source code is <a href="https://github.com/younes-dro/custom-connect-button-block-for-discord" rel="nofollow ugc">available on GitHub</a>. 
Contributions and bug reports are welcome.
<h3>External services</h3>
This plugin does not connect to external APIs directly. 
Instead, supported add-ons (listed above) handle all communication with the Discord API.
Optional external call used by this plugin: 
– Discord CDN (https://cdn.discordapp.com/) — to display a connected user’s avatar image, if provided by the add-on. 
– Data sent: None. 
– Data retrieved: Avatar image. 
– When: Only when the user is already connected to Discord through a supported add-on.
For more details: 
– <a href="https://discord.com/terms" rel="nofollow ugc">Discord Terms of Service</a> 
– <a href="https://discord.com/privacy" rel="nofollow ugc">Discord Privacy Policy</a>

Custom connect button block for Discord

A Gutenberg block that provides a customizable "Connect to Discord" button, designed to work with supported Discord integration add-ons.

Sarvesh M Rao

Transform your long, forgettable Discord invite links into branded, professional vanity URLs on your own domain. Perfect for communities, gaming servers, content creators, and businesses.
<h4>🎯 Key Features</h4>
🔗 Branded Vanity URLs 
* Create custom short links: <code>yoursite.com/discord</code>, <code>yoursite.com/community</code>, or any path you choose 
* Professional and memorable – perfect for marketing materials, social media, and verbal sharing 
* No external URL shorteners needed – everything on your domain
📊 Real-Time Analytics 
* Track total clicks with beautiful visual stats dashboard 
* Monitor last click timestamp 
* Reset counters anytime for new campaigns 
* Modern card-based analytics interface
🎨 Social Media Previews 
* Customize rich embeds for Discord, Twitter, Facebook, WhatsApp, and more 
* Upload server icons directly from WordPress media library 
* Custom colors matching your brand (Discord blue #5865f2 by default) 
* Live preview – see exactly how your embed will look before publishing 
* Professional first impression when sharing your invite
🔔 Discord Webhook Notifications 
* Get instant notifications in Discord when someone clicks your invite 
* Easy OAuth integration – login with Discord to select channels 
* Alternative manual webhook URL input 
* Perfect for tracking engagement in real-time
💎 Modern Admin Interface 
* Complete UI overhaul in version 2.6.0 
* Clean card-based design matching WordPress standards 
* Intuitive help toggles for every setting 
* Responsive layout works perfectly on mobile 
* WordPress media library integration for images
<h4>📸 Visual Examples</h4>
When you share your vanity URL, people see: 
* Your server icon/logo 
* Custom invitation message 
* Server name and description 
* Branded colors 
* Professional, trustworthy appearance
Perfect for: 
* Gaming communities and Discord servers 
* Content creators and streamers 
* Educational communities 
* Business team coordination 
* Open source projects 
* NFT and crypto communities
<h4>🚀 How It Works</h4>
<ol>
<li>Install & Activate – One-click installation from WordPress</li>
<li>Configure Your Link – Set your Discord invite code and choose your vanity path</li>
<li>Customize Appearance – Upload your server icon, write compelling descriptions</li>
<li>Share Everywhere – Use your branded link in videos, social media, websites</li>
<li>Track Performance – Monitor clicks and engagement from your WordPress dashboard</li>
</ol>
<h4>🔒 Privacy & Security</h4>
<ul>
<li>No data sent to external servers (except Discord OAuth for webhooks)</li>
<li>All analytics stored in your WordPress database</li>
<li>Open source – inspect the code anytime</li>
<li>Regular security updates</li>
<li>Follows WordPress coding standards</li>
</ul>
<h4>📚 Documentation & Support</h4>
<ul>
<li><a href="https://docs.sarveshmrao.in/en/wp-discord-invite" rel="nofollow ugc">Complete Documentation</a></li>
<li><a href="https://wordpress.org/support/plugin/wp-discord-invite/" rel="ugc">Support Forum</a></li>
<li><a href="https://github.com/sarveshmrao/wp-discord-invite" rel="nofollow ugc">GitHub Repository</a></li>
<li><a href="https://github.com/sarveshmrao/wp-discord-invite/issues" rel="nofollow ugc">Report Bugs</a></li>
</ul>
Disclaimer: This plugin is not affiliated with Discord Inc. Discord and related logos are trademarks of Discord Inc.
Credits: 
* Logo crafted with love by <a href="http://dawn-s-portfolio.firebaseapp.com/" rel="nofollow ugc">Dawn Saju</a> 
* Developed by <a href="https://sarveshmrao.in" rel="nofollow ugc">Sarvesh M Rao</a>
<h3>Support</h3>
Need help? Here’s how to get support:
<ol>
<li>Documentation: Check our <a href="https://docs.sarveshmrao.in/en/wp-discord-invite" rel="nofollow ugc">comprehensive docs</a> first</li>
<li>Forum: Ask questions in the <a href="https://wordpress.org/support/plugin/wp-discord-invite/" rel="ugc">WordPress support forum</a></li>
<li>GitHub: Report bugs or request features on <a href="https://github.com/sarveshmrao/wp-discord-invite/issues" rel="nofollow ugc">GitHub</a></li>
<li>Reviews: Love the plugin? <a href="https://wordpress.org/support/plugin/wp-discord-invite/reviews/" rel="ugc">Leave a review</a> ❤️</li>
</ol>
<h3>Contribute</h3>
WP Discord Invite is open source! Contribute on <a href="https://github.com/sarveshmrao/wp-discord-invite" rel="nofollow ugc">GitHub</a>:
<ul>
<li>Submit bug reports</li>
<li>Suggest new features </li>
<li>Contribute code</li>
<li>Translate the plugin</li>
<li>Improve documentation</li>
</ul>
Support Development: If this plugin helps your community, consider <a href="https://buymeacoffee.com/sarveshmrao" rel="nofollow ugc">buying me a coffee</a> ☕

WP Discord Invite

Create memorable Discord invite links (yoursite.com/discord) with tracking, webhooks, and social previews.

Custom connect button block for Discord vs WP Discord Invite