各種エディタ投稿確認

2025.08.13

お知らせ

ブロックエディタ表示テスト用サンプル

見出しブロック

見出し1（H1）- メインタイトル

見出し2（H2）- セクションタイトル

見出し3（H3）- サブセクション

見出し4（H4）- 小見出し

見出し5（H5）- 詳細見出し

見出し6（H6）- 最小見出し

段落ブロック

これは通常の段落テキストです。Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

太字のテキスト、斜体のテキスト、太字かつ斜体、~~取り消し線~~、インラインコードなどの装飾も含まれます。

リンクテキストの例

リストブロック

順序なしリスト

リストアイテム1
リストアイテム2
- ネストされたアイテム1
- ネストされたアイテム2
  - さらにネストされたアイテム
リストアイテム3

順序付きリスト

最初のアイテム
二番目のアイテム
1. ネストされた順序付きアイテム1
2. ネストされた順序付きアイテム2
三番目のアイテム

引用ブロック

これは引用ブロックの例です。重要な文章や、他の人の言葉を引用する際に使用します。

複数行にわたる引用も可能です。

— 引用元の著者名

ネストした引用

これは外側の引用です。

これは内側の引用です。二重引用として表示されます。

コードブロック

インラインコード

これは console.log('Hello World') のようなインラインコードです。

コードブロック（言語指定なし）

function sampleFunction() {
    console.log('Hello, World!');
    return true;
}

JavaScript

const greeting = 'Hello, World!';
const numbers = [1, 2, 3, 4, 5];

function calculateSum(arr) {
    return arr.reduce((sum, num) => sum + num, 0);
}

console.log(calculateSum(numbers));

CSS

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.button {
    background-color: #007cba;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.button:hover {
    background-color: #005a87;
}

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>サンプルページ</title>
</head>
<body>
    <header>
        <h1>ウェブサイトタイトル</h1>
    </header>
    <main>
        <p>メインコンテンツ</p>
    </main>
</body>
</html>

テーブルブロック

項目	説明	価格	在庫
商品A	高品質な商品A	¥1,000	在庫あり
商品B	人気の商品B	¥2,500	残りわずか
商品C	新発売の商品C	¥3,200	在庫あり
商品D	限定版商品D	¥5,000	売り切れ

左寄せ・中央寄せ・右寄せの例

左寄せ	中央寄せ	右寄せ
テキスト1	テキスト2	テキスト3
長いテキストの例	短い	¥1,000

セパレーター

上記はセパレーター（水平線）の例です。

画像ブロック（プレースホルダー）

画像のキャプション：これは画像のキャプションです。

ボタンブロック風の表現

メインボタン セカンダリボタン お問い合わせ

メディアと文字ブロック風のレイアウト

画像左・テキスト右

見出しテキスト

これは画像と文字を組み合わせたレイアウトの例です。画像の横にテキストが配置され、魅力的なコンテンツを作成できます。

詳細を見る

カラムレイアウト風

2カラム

左カラム こちらは左側のカラムです。製品情報や特徴などを記載できます。

右カラム こちらは右側のカラムです。補足情報や関連リンクなどを配置できます。

3カラム

カラム1 サービス1の説明

カラム2 サービス2の説明

カラム3 サービス3の説明

詳細/概要ブロック

<details> <summary>クリックして詳細を表示</summary>

ここに詳細な情報が表示されます。FAQやよくある質問などに活用できます。

詳細項目1
詳細項目2
詳細項目3

</details>

チェックリスト

[x] 完了済みのタスク
[x] これも完了
[ ] 未完了のタスク
[ ] まだやることがある項目

定義リスト

WordPress : オープンソースのコンテンツ管理システム

Gutenberg : WordPressの新しいブロックエディタ

PHP : WordPressで使用されているプログラミング言語

数式（LaTeX風）

数学的な表現例：

インライン数式: E = mc²
ブロック数式:

∫₀^∞ e^(-x²) dx = √π/2

脚注

これは脚注付きのテキストです^1。別の脚注も可能です^2。

警告/注意ブロック風

⚠️ 注意

これは重要な注意事項です。

ℹ️ 情報

これは参考情報です。

✅ 成功

処理が正常に完了しました。

❌ エラー

エラーが発生しました。

その他の特殊文字・絵文字

矢印

→ ← ↑ ↓ ⇒ ⇐ ⇑ ⇓

記号

★ ☆ ♪ ♫ ♥ ♦ ♣ ♠ ✓ ✗ ⚡ 🔥 💡

絵文字

😀 😃 😄 😁 🎉 🎊 👍 👎 💯 🚀 📱 💻

ファイルダウンロードリンク風

📄 サンプルPDFをダウンロード
📊 Excelファイルをダウンロード
🖼️ 画像ファイルをダウンロード

よくある質問（FAQ）風

Q: WordPressとは何ですか？
A: WordPressは世界で最も人気のあるコンテンツ管理システム（CMS）です。

Q: ブロックエディタの利点は？
A: 直感的な操作で、コードを書かずに美しいレイアウトを作成できます。

Q: カスタム投稿タイプとは？
A: 標準の投稿や固定ページ以外に、独自のコンテンツタイプを作成する機能です。

ページ終了

以上がブロックエディタの主要なブロックタイプの表示テスト用サンプルです。実際のWordPressサイトでこれらの表示を確認して、テーマのスタイリングを調整してください。