---
title: "X（Twitter）埋め込みが表示されないときの対処"
description: "X のポストを埋め込んだのに装飾されないリンクのままになってしまう。ほぼ全ての場合は widgets.js の読み込み漏れが原因です。仕組みを理解して確実に解決する方法を手順ごとに整理します。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/x-twitter-embed-not-showing"
markdown: "https://giga-site.com/articles/x-twitter-embed-not-showing/index.md"
category: "トラブルシュート"
publishedAt: "2026-06-24"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# X（Twitter）埋め込みが表示されないときの対処

X（旧Twitter）のポストをページに埋め込んだのに、装飾されないリンクやテキストのまま表示されてしまう。これはほとんどの場合、表示を整えるスクリプト widgets.js が読み込めていないことが原因です。この記事では、埋め込みの仕組みを押さえ、表示されないパターンを順に切り分けます。

> Source HTML: https://giga-site.com/articles/x-twitter-embed-not-showing
> Article index: https://giga-site.com/articles/index.md

## Xの埋め込みは2つの部品でできている

Xのポストを埋め込むと、コードは2つの部分に分かれます。1つはポストの内容を持つ blockquote(class が twitter-tweet)のHTML、もう1つは twitter.com 系の widgets.js を読み込む script タグです。

blockquoteだけがあってもスクリプトが動かなければ、リンク付きの引用テキストとして素朴に表示されるだけです。逆に言えば、装飾されない素のテキストで出ているなら、widgets.jsが読み込めていないと判断できます。

- blockquote(twitter-tweet): ポストの中身を持つHTML本体
- script(widgets.js): 見た目を整え、埋め込みカードに変換する
- 両方が揃って初めて整形された埋め込みになる

## widgets.jsが読み込めているか

公式の埋め込みコードをコピーしたとき、script タグごと貼れているかをまず確認します。AI生成HTMLや手作業の編集では、scriptタグだけ削られていることがよくあります。1ページに同じscriptを何度も書く必要はなく、1つあれば複数の埋め込みに効きます。

scriptのsrcは https から始まる形になっている必要があります。http のままだとブロックされます。また、scriptを head に置いても body の最後に置いても動きますが、blockquoteより前に読み込まれた場合に表示が遅れることがあります。

## 症状別チェック表

X（Twitter）埋め込みが表示されないは、症状を分けずに直そうとすると原因探しが長引きます。まず「自分だけで起きるのか」「全員で起きるのか」「特定ブラウザだけか」「差し替え後だけか」を切り分けます。

確認順序を固定すると、相対パス、ファイル名、キャッシュ、認証、外部読み込みのどこで止まっているかが見えます。修正後はローカル確認だけで終わらせず、実際の共有URLで再表示して、相手と同じ条件で直ったことを確認します。

- 自分だけ表示されない: キャッシュ、ログイン状態、ブラウザ拡張、端末幅を確認する
- 全員で表示されない: ファイル構成、相対パス、大文字小文字、アップロード漏れを見る
- 一部だけ崩れる: CSS/画像/JSごとに読み込みエラーを分ける
- 差し替え後だけ古い: URL、キャッシュ、更新対象ファイルの取り違えを確認する

## blockquoteの書き方と動的描画の注意

blockquoteのclassが twitter-tweet になっているか、中のポストURLが正しいかを確認します。AIが整形のためにclassを書き換えたり、URLを途中で切ってしまうと表示されません。

JavaScriptで後からポストを差し込む(動的にDOMへ追加する)構成だと、widgets.jsが最初の読み込み時にしか走らず、後から追加した分が描画されないことがあります。その場合はXが提供する再描画用の関数を呼ぶ必要がありますが、まずは静的にHTMLとして書いて表示されるかを試すのが切り分けの近道です。

## 切り分けの手順

素のテキストで表示される、あるいは何も出ないときは、次の順で確認してください。

1. 開発者ツールのコンソールとネットワークタブで widgets.js が読み込めているか確認する
2. 公式の埋め込みコード(blockquote と script の両方)を丸ごと貼り直す
3. scriptのsrcが https から始まっているか確認する
4. blockquoteのclassが twitter-tweet で、ポストURLが正しいか確認する
5. 動的に差し込んでいる場合は、静的なHTMLとして書いて表示されるか試す

## 確認用に共有するときのポイント

widgets.jsのような外部スクリプトは、httpsで配信されるページのほうが安定して読み込まれます。ローカルのファイルをそのまま開くと、混在コンテンツの扱いで弾かれることがあります。

ギガサイト便にHTMLをドロップすると 〇〇.giga-site.com のhttpsの共有URLが発行され、CDNのエッジ配信で素早く表示されます。外部スクリプトが本番に近い条件で動くか確かめやすく、レビュー用に関係者へ渡すのに向いています。コードを直したら同じURLのままファイルを差し替えられるので、リンクを送り直さずに再確認を依頼できます。

## よくある質問

### ポストがリンク付きの素のテキストで表示されます。

見た目を整えるスクリプト widgets.js が読み込めていない典型的な症状です。公式の埋め込みコードに含まれる script タグごと貼り直し、コンソールで読み込みエラーが出ていないか確認してください。

### scriptタグは1ページに何個必要ですか。

widgets.js は1つあればページ内の複数の埋め込みに効きます。重複して書く必要はありません。ただし1つも無いと装飾されないため、最低1つは残してください。

### JavaScriptで後から差し込んだポストが描画されません。

widgets.js は初回読み込み時に処理を行うため、後から動的に追加した分は再描画用の関数を呼ばないと反映されないことがあります。まずは静的なHTMLとして書いて表示されるか切り分けてください。

### ローカルでは崩れますが配信すれば直りますか。

ローカルファイルだと外部スクリプトが弾かれることがあります。ギガサイト便などでhttpsの共有URLとして配信すると、widgets.jsが本番に近い条件で読み込まれるか確認できます。

### 原因が分からないときはどこから確認すべきですか？

まず自分だけの問題か全員の問題かを分けます。次にシークレットウィンドウ、別ブラウザ、スマホで確認し、ファイル構成・相対パス・キャッシュ・認証設定を順に見ます。

## 関連記事

- [Instagramの投稿埋め込みが表示されないときの対処](https://giga-site.com/articles/instagram-embed-not-showing/index.md)
- [YouTube埋め込みが表示されないときの対処](https://giga-site.com/articles/youtube-embed-not-showing/index.md)
- [Googleマップ埋め込みが表示されないときの対処](https://giga-site.com/articles/google-maps-embed-not-showing/index.md)
- [Spotifyの埋め込みプレーヤーが表示されないときの対処](https://giga-site.com/articles/spotify-embed-not-showing/index.md)
- [iframeが表示されないときの原因と対処](https://giga-site.com/articles/iframe-not-showing/index.md)
- [SVG画像が表示されないときの原因と対処](https://giga-site.com/articles/svg-not-showing/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "X（Twitter）埋め込みが表示されないときの対処",
  "description": "X のポストを埋め込んだのに装飾されないリンクのままになってしまう。ほぼ全ての場合は widgets.js の読み込み漏れが原因です。仕組みを理解して確実に解決する方法を手順ごとに整理します。",
  "datePublished": "2026-06-24",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/x-twitter-embed-not-showing",
  "url": "https://giga-site.com/articles/x-twitter-embed-not-showing",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "トラブルシュート",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "ポストがリンク付きの素のテキストで表示されます。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "見た目を整えるスクリプト widgets.js が読み込めていない典型的な症状です。公式の埋め込みコードに含まれる script タグごと貼り直し、コンソールで読み込みエラーが出ていないか確認してください。"
      }
    },
    {
      "@type": "Question",
      "name": "scriptタグは1ページに何個必要ですか。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "widgets.js は1つあればページ内の複数の埋め込みに効きます。重複して書く必要はありません。ただし1つも無いと装飾されないため、最低1つは残してください。"
      }
    },
    {
      "@type": "Question",
      "name": "JavaScriptで後から差し込んだポストが描画されません。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "widgets.js は初回読み込み時に処理を行うため、後から動的に追加した分は再描画用の関数を呼ばないと反映されないことがあります。まずは静的なHTMLとして書いて表示されるか切り分けてください。"
      }
    },
    {
      "@type": "Question",
      "name": "ローカルでは崩れますが配信すれば直りますか。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "ローカルファイルだと外部スクリプトが弾かれることがあります。ギガサイト便などでhttpsの共有URLとして配信すると、widgets.jsが本番に近い条件で読み込まれるか確認できます。"
      }
    },
    {
      "@type": "Question",
      "name": "原因が分からないときはどこから確認すべきですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "まず自分だけの問題か全員の問題かを分けます。次にシークレットウィンドウ、別ブラウザ、スマホで確認し、ファイル構成・相対パス・キャッシュ・認証設定を順に見ます。"
      }
    }
  ]
}
```