THEME PATTERNS

テーマパターン

ONEstarテーマに含まれる27のパターンです。ヘッダー・フッター・ヒーロー・CTA・セクションなど、サイト制作の定番レイアウトを即座に配置できます。

ヘッダーパターン（9種）

header-centered

ロゴ中央配置のシンプルなヘッダーです。ポートフォリオや一枚物のLPに向いています

header-logo-left

ロゴ左 + ナビ右の定番レイアウトです。コーポレートサイトや汎用ビジネスサイトに向いています

header-split-nav

ナビをロゴの左右に分割配置するレイアウトです。メニュー項目が均等に見せたい場合に向いています

header-three-column

3カラム構成のヘッダーです。ロゴ・ナビ・SNSリンクを横並びに配置したい場合に便利です

header-transparent

背景透過ヘッダーです。ヒーロー画像との重ね合わせで、没入感のあるファーストビューに向いています

header-utility-bar

ユーティリティバー付きヘッダーです。SNSリンクや言語切替を上部バーに配置したい場合に便利です

header-with-cta

CTAボタン付きヘッダーです。問い合わせや購入へのコンバージョンを常に促したい場合に向いています

header-with-notification

お知らせバー付きヘッダーです。キャンペーン情報や重要なアナウンスを常時表示するのに便利です

header-with-phone

電話番号表示付きヘッダーです。問い合わせ電話番号を目立たせたいコーポレートサイトに向いています

適用方法

1. テンプレートパーツを開く

   外観 → エディター → テンプレートパーツ → ヘッダーを開きます

2. パターンを差し替える

   既存のヘッダーブロックを選択し、パターンと置き換えます

3. 保存して確認する

   保存してフロントエンドでヘッダーの表示を確認します

フッターパターン（3種）

footer-minimal

シンプルなコピーライトのみのフッターです。ランディングページや一枚物のサイトに向いています

footer-2col

2カラムフッターです。ナビリンクとコピーライトを横に並べたい場合に便利です

footer-3col

3カラムフッターです。会社情報・ナビゲーション・SNSリンクを3列に配置したい場合に向いています

ヒーローパターン（2種）

フルスクリーンヒーロー

スプリットヒーロー

CTAパターン（3種）

CTA シンプル

CTA 背景画像

CTA スプリット

セクションパターン（8種）

FAQセクション

実績数値セクション

その他のセクションパターン

section-features

特徴紹介（アイコン + テキストのグリッド配置）。サービスや機能の強みを整理して見せるのに向いています

section-features-horizontal

特徴紹介 横並び（画像 + テキストの交互配置）。ステップや特長を順番に説明したい場合に向いています

section-logo-cloud

ロゴクラウド（パートナー・クライアントロゴの一覧表示）。信頼性の訴求に便利です

section-team

チーム紹介（メンバー写真 + 名前 + 役職のグリッド）。会社紹介・チームページに向いています

section-testimonials

お客様の声（カルーセル/グリッドで複数の声を表示）。社会的証明として購買促進に向いています

section-pricing

料金プラン（3カラムの料金表 + CTA）。SaaSやサービス紹介ページのプランページに向いています

ページレイアウトパターン（2種）

page-gsap-showcase

GSAPアニメーションのデモページです。スクロールアニメーションやインタラクションの実装例を確認するのに向いています

page-data-visualization

データ可視化ブロックのデモページです。棒グラフ・ドーナツチャート・プログレスバーの組み合わせ例を確認できます