実装テンプレート

段落です。太字テキスト、文字色違いテキスト、マーカー付きテキスト、リンク付きテキストの表示例です。

目次

※ 目次ブロック（LuckyWP Table of Contents）。見出しから自動で作られます

H2見出しの表示確認

見出し直後の段落です。本文の行間、余白、リンクや装飾がない通常文の見え方の表示例です。

H3見出しの表示確認

• 順序なしリストの項目です。
• 本文量が増えた場合の折り返しの表示例です。
• リスト末尾の余白の表示例です。

1. 順序付きリストの項目です。
2. 数字ラベルの表示例です。
3. 複数行になった場合の配置の表示例です。

• チェックリストの項目です。
• 追加CSSクラス指定時のアイコンの表示例です。
• 複数項目の余白の表示例です。

※ 追加CSSクラスに「is-check」を指定

H4見出しの表示確認

H5見出しの表示確認

項目	内容A	内容B
通常行	Flexible Table Blockの素の表示です。	プラグイン標準の見た目の表示例です。
確認行	文字量と罫線の表示例です。	セル内の折り返しの表示例です。

項目A	左列見出しの表示例です。
項目B	追加CSSクラス指定時の背景色の表示例です。

※ 表の配色（見出し行・ストライプ・罫線）は 「設定 > Flexible Table Block」で設定します。テーマ側は角丸だけを足しています

引用元がない引用文です。本文の文字量、余白、装飾の表示例です。

引用元リンク付きの引用文です。引用元のリンク表示と配置の表示例です。

参考ページ

見出しの英字あしらい

英字は見出しタグの中に入れません。見出しの直前に「段落」ブロックを置き、追加CSSクラスに heading-en を指定して英字を入力します。文言は自由に変えられます。

英字あしらい付きのH2見出し

※ 英字は直前の段落ブロック。追加CSSクラスに「heading-en」を指定

見出しボックス

見出しボックス

注意

疑問

トグル

横並び

head-box–side 見出し空欄テスト

別デザインh4・2カラム表

h4タイトルがはいります。（別デザイン）

※ ブロックスタイル「線見出し」(is-style-line-heading) を適用した別デザイン版

上のh4はブロックスタイル「線見出し」（is-style-line-heading）を適用した別デザイン版です。既定のh4は左に緑の丸ドットが付きます。

tdテキストが入ります	thテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキスト
tdテキストが入ります	thテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキストthテキスト

表（プラグインの配色設定）

横スクロールする表

項目	月	火	水	木	金	土	日
午前	●	●	●	●	●	●	●
午後	●	●	●	●	●	／	／

※ ブロック設定の「モバイルでスクロール」をON。スクロールする表には角丸を付けません（角丸のクリップとスクロールは両立しないため）

※ 表の配色（見出し行・ストライプ・罫線）は 「設定 > Flexible Table Block」で設定します。テーマ側は角丸だけを足しています

光学部デザイン	中心から周辺まで連続的に度数が変化する累進屈折型です。
乱視矯正	乱視用（トーリック）レンズにも対応しています。
焦点の特性	遠方・中間・近方に自然につながる見え方です。
近見の焦点距離	手元30〜40cm程度にピントが合いやすい設計です。
得意な見え方と作業	デスクワークや読書、日常生活全般に適しています。

表の角丸

表の配色は「Flexible Table Block」の管理画面（設定 > Flexible Table Block）で設定したものが反映されます。角丸は既定では付きません。角丸を付けたい表だけ、追加CSSクラスに「is-rounded」を指定してください。

※ 追加CSSクラスに「is-rounded」を指定した表だけ角丸になります。SPの横スクロールはプラグインの設定に従います（テーマからは干渉しません）

項目	内容A	内容B
角丸あり	追加CSSクラス「is-rounded」を指定した表です。	四隅が角丸で表示されます。
確認行	デザイン再現用の角丸テーブルです。	既定の表には角丸は付きません。

ボタン

ネイティブの「ボタン」ブロックは既定で内部リンクの体裁になり、追加CSSクラスでページ内リンク・外部リンクを出し分けます。

内部リンク（既定）

※ 追加CSSクラスなしの既定デザイン（矢印：右）

ページ内リンク

※ 追加CSSクラスに「btn-anchor」を指定（矢印：下）

外部リンク

※ 追加CSSクラスに「btn-external」を指定（矢印：右上）

ページ内ナビ

カラムブロックの中にボタンを入れて並べます。カラム自体に追加CSSクラスを指定すると、ボタン同士の余白を詰められます。

標準

※ カラムブロックに追加CSSクラス「nav-columns」を指定

詰める

※ カラムブロックに追加CSSクラス「nav-columns is-tight」を指定（さらに余白を詰める）

アンカーリンク(小)5カラム・関連記事

あわせて読みたい関連記事

あわせて読みたい

ページタイトルがはいります。ページタイトルがはいります。

この文章はダミーです。文字の大きさや量、字間・行間の参考としてご覧ください。

CTAセクション（大）テスト

蒲田エリアで白内障・近視治療・目の不調にお悩みの方へ。
診療のご予約・お問い合わせは、WEB予約またはお電話にて承っております。

\ 準備中 / WEB予約はこちら お電話でのお問い合わせ 03-5942-8826 受付：月〜土 10:00〜13:00 /
14:30〜18:00
※日祝 〜17:00

CTAセクション（小）テスト

CONTACT お問い合わせ

気になる症状は、我慢せずご相談ください。
ご予約・お問い合わせはWEBまたはお電話にて承っております。

\ 準備中 / WEB予約はこちら お電話でのお問い合わせ 03-5942-8826 受付：月〜土 10:00〜13:00 /
14:30〜18:00
※日祝 〜17:00

カード

単体／全項目入り

単体／一部空欄

カラム横並び3つ

ワイドカード

全項目入り

あわせて読みたい

ワイドカード見出し

ワイドカード本文が入ります。改行も入ります。n画像と本文の横幅の表示例です。

一部空欄

吹き出し

全項目入り／左

一部空欄／右

関連記事

全項目入り

関連記事（3カラム）

関連記事（2カラム）

関連記事（1カラム）

関連記事見出し

一部空欄

ポイントコンテンツ

全項目入り／左

一部空欄／右

メリット

全項目入り／merit

一部空欄／demerit

メリット・デメリット 横並びテスト

流れコンテンツ

画像なしパターン

番号・見出し・本文だけのシンプルな流れコンテンツの表示例です。

画像ありパターン

各ステップに画像を添えた流れコンテンツの表示例です。

医師紹介カード

※ 資格・所属学会は1行1件で入力（行頭の「・」は自動で付きます）

監修者情報

全項目入り

一部空欄

監修者トグル

全項目入り

一部空欄

参考文献・関連情報

※ 参考リンクは1行1件。「ラベル|URL」の形式で入力（URLを省くとリンクなしの行になります）

名前

マーカーテスト：ツールバーのマーカーで付けたテキスト は黄色マーカー、文字色だけ変えたテキスト は背景なし、従来の素のmark は後方互換でマーカー表示。

よくある質問

全項目入り

一部空欄