ろぼいんブログ
更新:

【PC・スマホ】Discordへのリンクの貼り方:基本から応用まで

Discordはゲームコミュニティや小規模なビジネスチームで広く使われているコミュニケーションツールですが、リンクを適切に貼るには知識が必要です。

この記事では、Discordにリンクを効果的に貼るためのいくつかの方法と、それがどのように表示されるかについて詳しく解説します。ここで紹介する方法は、PCとスマホのどちらでも利用できます。また、この記事には、Discordにリンクを貼る際に便利なツールも付けてありますので、ぜひご利用ください。

Discordでリンクを共有する際の注意点

Discordでリンクを貼るときには、いくつかの注意点があります。

まず、リンクを貼る際は、常に安全なサイトからのものであることを確認してください。危険なサイトのリンクを貼ると、そのリンクを踏んでしまった人たちが何らかの被害を受ける可能性があります。不審なサイトや危険なサイトのリンクは、いたずら目的でも貼らないようにしましょう。

また、詳しくは後述しますが、DiscordにURLを貼ると、プレビューが表示される場合があります。不要にプレビューが大きい場合や重要な情報が隠れてしまう場合は、プレビューを無効にする方法を利用してみてください。

一度に複数のリンク含むメッセージでプレビューが有効になっていると、かなりのスペースを取ってしまうので、そういった場合もリンクのプレビューを無効化することをオススメします。リンクのプレビューを無効化する方法は、あとで詳しく解説します。

Discordでリンクを貼る基本

Discordでリンクを共有する最も簡単な方法は、テキストチャットにURLをそのまま貼り付けることです。URLを含むメッセージを送信すると、Discordは自動的にリンクを認識し、ほとんどの場合はリンクのプレビューを表示します。この方法は技術的な知識がなくても誰でも使えます。

リンクのテキストをカスタマイズする

より高度なリンク共有を目指す場合、DiscordはMarkdownという記法を部分的にサポートしており、この記法を使ってリンクテキストをカスタマイズできます。

Markdownでは、[表示するテキスト](リンク先のURL)という形式を使用します。たとえば、「Google」というテキストにGoogleのURL(https://google.com)を貼り付ける場合は、次のようにします。

try{(()=>{function a(e){if(!e)return;let t=e.getAttribute("tabindex")!==null,n=e.scrollWidth>e.clientWidth;n&&!t?e.setAttribute("tabindex","0"):!n&&t&&e.removeAttribute("tabindex")}var u=window.requestIdleCallback||(e=>setTimeout(e,1)),i=window.cancelIdleCallback||clearTimeout;function l(e){let t=new Set,n,r;return new ResizeObserver(c=>{c.forEach(o=>t.add(o.target)),n&&clearTimeout(n),r&&i(r),n=setTimeout(()=>{r&&i(r),r=u(()=>{t.forEach(o=>e(o)),t.clear()})},250)})}function d(e,t){e.querySelectorAll?.(".expressive-code pre > code").forEach(n=>{let r=n.parentElement;r&&t.observe(r)})}var s=l(a);d(document,s);var b=new MutationObserver(e=>e.forEach(t=>t.addedNodes.forEach(n=>{d(n,s)})));b.observe(document.body,{childList:!0,subtree:!0});document.addEventListener("astro:page-load",()=>{d(document,s)});})();}catch(e){console.error("[EC] tabindex-js-module failed:",e)}try{(()=>{function i(o){let e=document.createElement("pre");Object.assign(e.style,{opacity:"0",pointerEvents:"none",position:"absolute",overflow:"hidden",left:"0",top:"0",width:"20px",height:"20px",webkitUserSelect:"auto",userSelect:"all"}),e.ariaHidden="true",e.textContent=o,document.body.appendChild(e);let a=document.createRange();a.selectNode(e);let n=getSelection();if(!n)return!1;n.removeAllRanges(),n.addRange(a);let r=!1;try{r=document.execCommand("copy")}finally{n.removeAllRanges(),document.body.removeChild(e)}return r}async function l(o){let e=o.currentTarget,a=e.dataset,n=!1,r=a.code.replace(/\u007f/g,` `);try{await navigator.clipboard.writeText(r),n=!0}catch{n=i(r)}if(!n||e.parentNode?.querySelector(".feedback"))return;let t=document.createElement("div");t.classList.add("feedback"),t.append(a.copied),e.before(t),t.offsetWidth,requestAnimationFrame(()=>t?.classList.add("show"));let c=()=>!t||t.classList.remove("show"),d=()=>{!t||parseFloat(getComputedStyle(t).opacity)>0||(t.remove(),t=void 0)};setTimeout(c,1500),setTimeout(d,2500),e.addEventListener("blur",c),t.addEventListener("transitioncancel",d),t.addEventListener("transitionend",d)}function s(o){o.querySelectorAll?.(".expressive-code .copy button").forEach(e=>e.addEventListener("click",l))}s(document);var u=new MutationObserver(o=>o.forEach(e=>e.addedNodes.forEach(a=>{s(a)})));u.observe(document.body,{childList:!0,subtree:!0});document.addEventListener("astro:page-load",()=>{s(document)});})();}catch(e){console.error("[EC] copy-js-module failed:",e)}
[Google](https://google.com)

このとき、[ ]( )といった記号は、必ず半角を用いてください。また、これらの記号の間にスペースや改行を入れないように注意してください。

次のフォームを使うと、Markdownを使ったリンクのテキストを簡単に生成できます。リンクのテキストとURLを入力すると、Markdown形式のリンクが生成されます。

変換後のテキスト:

const isValidURL = (url) => { try { new URL(url); return true; } catch { return false; } }; const displayText = document.querySelector("#display-text"); const urlText = document.querySelector("#url-text"); const convertButton = document.querySelector("#convert-button"); const convertedText = document.querySelector("#converted-text"); convertButton.addEventListener("click", () => { if (!isValidURL(urlText.value)) { convertedText.textContent = "URLの形式が正しくありません。http:// または https:// から始まるURLを入力してください。"; return; } convertedText.textContent = `[${displayText.value}](${encodeURI(urlText.value)})`; });

Discordのメッセージ内でMarkdownを使うことで、テキストをクリックするだけでリンク先にジャンプできるようになります。これにより、より整理されたメッセージを作成できます。

他のMarkdown機能

DiscordのMarkdown記法は、文字サイズの変更の挿入や強調表示など、他にもさまざまな機能があります。

メッセージの文字を大きくする方法の詳細については、こちらの記事で解説しています。

Discordでプレビュー表示される条件とその管理

Discordにリンクを貼ると、一部のURLではリンク先のWebページのプレビューが表示されることがあります。

リンクのプレビューは、Open Graph Protocol (OGP) と呼ばれる、Webページのメタデータを利用して生成されます。OGPは、Webページのタイトル、説明、画像などを定義し、これらがSNS上でどのように表示されるかを制御します。Discordもこれを利用してリンクのプレビューを生成しています。

OGPはWebサイト側の設定のため、Discordに表示されるプレビューをカスタマイズすることはできません。また、OGPが設定されていないWebページのプレビューは表示されません。

一方で、OGPが設定されているWebページのプレビューを非表示にすることは可能です。

リンクのプレビューを非表示にする方法

リンクのプレビューを表示させたくない場合は、リンクを <ここにURL> という形で括ってください。この方法でリンクを送信すると、Discordはプレビューを無効化し、ただのテキストリンクとして表示されます。

たとえば、Googleのトップページ( https://google.com )の場合は、次のようになります。

<https://google.com>

Markdown形式を使う場合は、[表示するテキスト](<リンク先のURL>)という形式を使います。

[Google](<https://google.com>)

まとめ

Discordでリンクを共有する方法は多岐にわたりますが、基本的なURLの貼り付けから、Markdownを使用した高度なカスタマイズまで、しっかりと理解しておくことでコミュニケーションの質を高められます。安全に注意しながら、これらのテクニックを活用してみてください。

おすすめアイテム

※このリンクを経由して商品を購入すると、当サイトの運営者が報酬を得ることがあります。詳細はこちら

このサイトを支援する

Buy Me a CoffeeまたはGitHub Sponsorsで支援していただけると、サイトの運営やコンテンツ制作の励みになります。定期的な支援と一度限りの支援がありますので、お間違いのないようにお願いします。

Buy me a coffee

著者のアイコン画像

生まれた時から、母国語よりも先にJavaScriptを使っていました。ネットの海のどこにもいなくてどこにでもいます。

Webフロントエンドプログラマーで、テクノロジーに関する話題を追いかけています。動画編集やプログラミングが趣味で、たまにデザインなどもやっています。主にTypeScriptを使用したWebフロントエンド開発を専門とし、便利で実用的なブラウザー拡張機能を作成しています。また、個人ブログを通じて、IT関連のニュースやハウツー、技術的なプログラミング情報を発信しています。

最新記事