ハコブネブログ

AIの記事をWordPressに貼ると見出しや表が崩れるとき

※本記事にはプロモーションが含まれています。

AIの記事をWordPressへ貼って見出しや表にならないときは、原稿がMarkdownかHTMLかと、貼り付け先がコードエディターか通常の編集画面かを確認すると切り分けやすくなります。記号がそのまま出る場合は、文章の内容より形式の違いが原因かもしれません。

今回はハコブネログのWordPress下書きで、同じ内容をMarkdownとHTMLにして比べました。コードエディターへMarkdownを入れた場合と、HTMLへ変えた場合の表示を確認しています。すべてのエディターや貼り付け方法で同じ症状が起きる、とする記事ではありません。

目次

MarkdownとHTMLは、見出しの書き方が違う

Markdownでは見出しを「## 見出し」、表を縦棒とハイフンで表すことがあります。一方、HTMLでは見出しにh2、表にtableなどのタグを使います。Markdownの記号を、どの入力欄でも自動変換してくれるとは限りません。

原稿の見え方 確認すること
## が見出しの前にある Markdownとして作られた文章か
<h2>や<table>がある HTMLとして貼る場所か
表が縦棒で並んでいる その入力方法が表のMarkdownに対応しているか
三連のバッククォートで囲まれている 説明用のコード枠までコピーしていないか

下書きで、コードエディターへの貼り付けを比較した

2026年10月19日、WordPress 7.1.3、テーマTHE THORのサイトで、説明用の小さなサンプルを下書きへ保存しました。見出しは「無料枠の確認」、表は「項目・記録」の2列で、「残量100」「期限未確認」の2行です。100は検証用の値で、実際のサービス残量ではありません。

最初に、次のMarkdownをコードエディターへ入れました。

## 無料枠の確認

| 項目 | 記録 |
| --- | --- |
| 残量 | 100 |
| 期限 | 未確認 |

保存後のプレビューでは、##や縦棒が本文に残り、対象のh2見出しとtable要素は作られていませんでした。画面全体にあった「関連する記事」の見出しは、検証対象には数えていません。

WordPress下書きのプレビューで、Markdownの見出し記号と表の縦棒がそのまま本文に表示された画面
コードエディターにMarkdownをそのまま保存した結果。一般公開していない下書きの画面です。

次に、同じ内容をHTMLへ変えて、同じ下書きのコードエディターに保存しました。

<h2>無料枠の確認</h2>
<table>
  <thead><tr><th>項目</th><th>記録</th></tr></thead>
  <tbody>
    <tr><td>残量</td><td>100</td></tr>
    <tr><td>期限</td><td>未確認</td></tr>
  </tbody>
</table>

再読込したプレビューでは、「無料枠の確認」がh2として、表がtableとして表示されました。表の見出し行と2行の値も確認できました。

同じWordPress下書きをHTMLへ変え、見出しと2列の表が表示されたプレビュー画面
同じ内容をHTMLで保存した結果。今回確認したのは、このサイトとコードエディターでの挙動です。

直すときは、元原稿を残してから小さく試す

  1. 元の本文を別ファイルやリビジョンに残します。
  2. 原稿がMarkdownかHTMLかを確かめます。
  3. 見出し1個と表数行だけを下書きで試します。
  4. プレビューで記号が残らず、見出し・行・列が意図どおりかを見ます。
  5. 確認できてから残りを移し、全文を見直します。

HTMLをAIに作ってもらう場合は、「WordPressの本文へ入れるHTMLだけ」「h2・h3・p・tableなど必要な要素のみ」「JavaScriptや外部の読込を追加しない」「コードを囲む記号は不要」と範囲を絞れます。変換後も数字やリンクが変わっていないかは照合します。

通常のブロック編集を使いたい場合は、見出しブロックやテーブルブロックで作り直す方法もあります。HTMLを細かく扱う必要があるときはカスタムHTMLブロックが選択肢になります。ただし、今回の比較はコードエディターで行ったもので、これらの貼り付け操作をすべて再現した検証ではありません。

表は表示幅と行・列も確かめる

表ができた後も、列の対応がずれていたり、長い文章で横へはみ出したりする場合があります。パソコンで見えるだけで終えず、スマホ相当の幅でも、項目名と値の関係が分かるかを確認します。列が多すぎるなら表を分ける、長い説明を本文へ移す方法もあります。

WordPress公式にはテーブルブロックとカスタムHTMLの案内があります。バージョンや権限によって扱える内容が異なるため、外部スクリプトを追加して直そうとする前に、標準の編集方法で形をそろえるほうが進めやすくなります。

形式を直した後に、記事の中身を確認する

見出しと表が表示できても、出典や体験が正しいとは限りません。HTML変換の際に、勝手な説明や存在しないリンクが足されていないかも確認します。全体の確認手順は、AI記事を公開前に直す手順に、出典の照合はAI記事の出典を確認する方法にまとめています。

今回の症状は、Markdownをコードエディターへ入れた条件で再現し、HTMLでの表示を確認できました。新しい有料プラグインは導入していません。別の症状が出る場合は、利用環境と貼り付け先を記録し、同じ手順で小さな下書きから確かめるのがよいと思います。

検証日：2026年10月19日。参考：WordPress公式「Table block」、「Custom HTML」（同日確認）。