View source for DiscordIntegrator

<noinclude>{{LangSelect}}</noinclude><includeonly>{{Languages}}
{{Infobox JavaScript
| Image file  = {{{image|Discordwidget.png}}}
| Description = {{{description|Allows embedding Discord server widgets into content and sidebar}}}
| Scope       = s
| Author      = [[User:KockaAdmiralac|KockaAdmiralac]]
| Code        = [[MediaWiki:DiscordIntegrator/code.js|code.js]]
| Updated     = {{Updated|MediaWiki:DiscordIntegrator/code.js}}
| Languages   = auto
| Status      = stable
| Type        = integration
}}

{{{intro|'''DiscordIntegrator''' allows integrating a [https://discord.com Discord] widget into your sidebar or content. The [https://discord.com/blog/add-the-discord-widget-to-your-site Discord widget] is able to show all online users in a server, the users game activity, anyone in a voice channel and etc.}}}

'''{{{note|If, after reading the documentation, you still don't understand how to set DiscordIntegrator up, read [[DiscordIntegrator/instructions|the step-by-step manual]] or watch the video below.}}}'''

{{{outdated-video|The video is a little outdated, make sure to read the below instructions for finding the widget setting in discord.}}}

{{#ev:youtube|6yPXMZKBUek}}

== {{I18n|getMsg|Documentation|installation}} ==
{{Script Install
| Use = S
| codepage = MediaWiki:DiscordIntegrator/code.js
}}
{{Clear}}
== {{I18n|getMsg|Documentation|configuration}} ==
=== {{{etw|Enabling the widget}}} ===
{{{etw-info|The widget can be enabled by Discord server administrators by going through the settings screen of their Discord server and going to the "Engagement" settings section. To enable embedding a widget to your server, tick the "Enable Server Widget" box. If you wish for users to be able to connect to your server through the widget, you should also select a chat room in the "Invite Channel" option.}}}
{{#tag:gallery|
DiscordIntegrator-1.png{{!}}{{{DiscordIntegrator-1|You can find the Server Settings when clicking on your server title}}}
DiscordIntegrator-2.png{{!}}{{{DiscordIntegrator-2|Once you're in Server Settings, enter the "Engagement" section}}}
DiscordIntegrator-3.png{{!}}{{{DiscordIntegrator-3|In the Engagement section, you will see the option to enable the server widget (in <span style="color: red;">red</span>), the Invite Channel option (in <span style="color: yellow;">yellow</span>) and your server ID (in <span style="color: green;">green</span>)}}}
DiscordIntegrator-4.png|{{{DiscordIntegrator-4|You might want to set that section to something like this}}}
|position="center" widths="300" captionalign="center"
}}
{{{important|'''Important''': The server ID that can be found in the widget settings section is very important for setting up the widget, which is explained in sections below and in the template.}}}

=== {{{content|Content}}} ===
{{{content-info|After the script is installed through the methods explained [[#Installation|above]], it is possible to make the widget show up in the page content. It is advised to create a template on your wiki and copy the contents of {{t|DiscordIntegrator}} to it. After that, the template can be used as:}}}
<pre>
{{DiscordIntegrator
| id = 402223976375517194
| theme = light
| width = 300px
| height = 500px
}}
</pre>
{{{gives|which gives:}}}
{{Clear}}
<div style="text-align: center; margin: auto">
{{DiscordIntegrator
|id = 246075715714416641
|theme = light
|width = 300px
|height = 500px
}}
</div>

{{{note-usage|'''Note:''' DiscordIntegrator does not work on the mobile skin, which will display an error message instead of the Discord widget. To prevent the widget from displaying on the mobile skin, you can set the [[w:Help:Template types|template type]] of the widget to a template type that doesn't display on mobile (such as Navbox).

For more complicated usage you can check the [[Template:DiscordIntegrator|DiscordIntegrator template documentation]] itself.}}}

=== {{{sidebar|Sidebar}}} ===
{{{sidebar-info|The script can be configured to add the widget to the sidebar of the wiki on the FandomDesktop skin through editing several MediaWiki pages. Any MediaWiki page relating to the configuration of DiscordIntegrator starts with <code>MediaWiki:Custom-DiscordIntegrator-config-</code> and after it goes the name of the configuration option. For example, to configure the ID of the server, you'd need to go to <code>MediaWiki:Custom-DiscordIntegrator-config-id</code>.

The widget will appear in the siderail, ''only'' if the ID of the server is set in configuration options. Configuration options have same names as configuration options when adding the widget to content, except with the addition of a few parameters:}}}
{| class="wikitable" style="width: 100%; text-align: center;"
! {{{option|Option}}}
! {{{type|Type}}}
! {{{wic|What it changes}}}
! {{{default|Default}}}
|-
! <code>id</code>
| {{{number|Number}}}
| {{{id-wic|ID of your Discord server to embed}}}
| {{{none|None}}}
|-
! <code>title</code>
| {{{string|String}}}
| {{{title-wic|Title of the module on the sidebar}}}
| {{{none|None}}}
|-
! <code>moduleHeight</code>
| {{{number|Number}}}
| {{{moduleHeight-wic|Height of the module in the sidebar, in pixels}}}
| {{{none|None}}}
|-
! <code>text</code>
| {{{string|String}}}
| {{{text-wic|Text above the widget}}}
| {{{none|None}}}
|-
! <code>footer</code>
| {{{string|String}}}
| {{{footer-wic|Text below the widget}}}
| {{{none|None}}}
|-
! <code>theme</code>
| <code>dark</code> {{{or|or}}} <code>light</code>
| {{{theme-wic|Theme of the widget in the sidebar}}}
| {{{theme-default|Inherits the theme on FandomDesktop.}}}
|-
! <code>width</code>
| {{{width-type|Number of pixels (<code>Xpx</code>) or percent (<code>Y%</code>)}}}
| {{{width-wic|Width of the Discord widget}}}
| <code>100%</code>
|-
! <code>height</code>
| {{{height-type|Number of pixels (<code>Xpx</code>) or percent (<code>Y%</code>)}}}
| {{{height-wic|Height of the Discord widget}}}
| {{{height-default|<code>400px</code> for sidebar, <code>90%</code> for template}}}
|-
! <code>logged-in</code>
| {{{boolean|Boolean}}}
| {{{logged-in-wic|If the widget should be displayed only to logged-in users}}}
| <code>false</code>
|}
{{{sidebar-info-1|An example of the widget can be seen on this page.}}}

== {{{faq|Frequently Asked Questions}}} ==
; {{{faq-title-1|Can I change the colors on the widget?}}}
: {{{faq-description-1|Currently, no. The widget is an [https://developer.mozilla.org/docs/Web/HTML/Element/iframe iframe], therefore its style cannot be changed.}}}
; {{{faq-title-2|The widget is loading infinitely.}}}
: {{{faq-description-2|That means you didn't enable the widget in your server settings.}}}
: {{{faq-description-3|Enable the widget as said in the [[#Enabling the widget|Enabling the widget]] section and refresh the page.}}}
: {{{faq-description-4|Sometimes it might take a minute or two for the widget to register it's enabled.}}}
: {{{faq-description-5|If the widget is enabled, you probably pasted the whole DiscordIntegrator template into the '''MediaWiki:Custom-DiscordIntegrator-config-id''' page. If that's the case, replace that template with '''only''' the server ID.}}}
; {{{faq-title-3|The widget in the sidebar is still loading infinitely!}}}
: {{{faq-description-6|Wait a bit for Discord's cache to refresh}}}
: {{{faq-description-7|While you wait, check if you posted the '''server ID''' into '''MediaWiki:Custom-DiscordIntegrator-config-id'''.}}}
: {{{faq-description-8|If you put the whole DiscordIntegrator template there, that won't work. Make sure it's '''only''' the server ID there.}}}
; {{{faq-title-4|I see "Template loop detected<nowiki>:</nowiki> Template<nowiki>:</nowiki>DiscordIntegrator"!}}}
: {{{faq-description-9|Then you didn't copy the template correctly.}}}
: {{{faq-description-10|You need to copy the '''[{{fullurl:Template:DiscordIntegrator|action=raw}} template]''' onto the template page of the same name on your wiki.}}}
: {{{faq-description-11|As an example, on [[w:c:diepio|Diep.io Wiki]] that template would be located [[w:c:diepio:Template:DiscordIntegrator|here]].}}}
: {{{faq-description-12|After copying the template contents, you would have to use that template to make the Discord widget display on wiki pages. General information about template usage can be found [[w:Help:Templates|here]].}}}
</includeonly>