Elementorで編集を始める前の準備を、1つずつ確認しましょう。
すでにElementorで編集できる方へ：初期設定をやり直す必要はありません。今の設定を確認し、練習用ページの作成へ進めます。
【必須】は使える状態の確認、【任意】は必要な場合だけ変更する設定です。
【必須】は使える状態の確認、【任意】は必要な場合だけ変更する設定です。
開発環境の実画面を掲載しています。赤い番号と説明を見比べてください。撮影：2026年9月23日／Elementor 4.3.0。バージョンや権限により表示が異なります。
1．まず、使える状態か確認する【必須】
WordPressの管理画面で「プラグイン」→「インストール済みプラグイン」を開き、「Elementor」を探します。
画像を大きく見る（赤い番号付き）
| 表示されているもの | すること |
|---|---|
| 「無効化」 | すでに有効です。「無効化」は押さず、そのまま次へ進みます。 |
| 「有効化」 | 使い始める場合は「有効化」を押します。 |
| Elementorが見つからない | 以下のインストール手順へ進みます。 |
まだ入っていない場合だけ
- 「プラグイン」→「プラグインを追加」を開き、「Elementor」で検索します。
- 提供元がElementor.comの公式プラグインを選び、「今すぐインストール」→「有効化」を押します。類似名の追加ウィジェット集とは別です。
- 初回案内が出たら、基本操作の練習では無料版で進めます。OptiBを使うサイトでは、案内に従って別テーマへ切り替える必要はありません。
プラグインのメニューがない場合は、管理者に確認してください。すでに編集できるサイトに、追加プラグインやProを入れ直す必要はありません。
成功の目印
Elementorの行に「無効化」と表示され、有効化済みだと確認できました。
2．編集対象を確認する【必須】
- 「Elementor」→「エディター」→「設定」→「一般」を開きます。バージョンによっては「Elementor」→「設定」で開きます。
- 「投稿タイプ」の①「固定ページ」にチェックが入っているか確認します。通常の案内ページを作るなら、固定ページを対象にします。
- 「投稿」はブログ記事もElementorで編集するときだけ対象にします。すでにチェックが入っている場合は、利用状況を確認せずに外さないでください。
- 変更した場合だけ、画面下の「変更を保存」を押します。
画像を大きく見る（赤い番号付き）
画面は開発環境の設定例です。画像と同じチェック状態にそろえる必要はありません。「投稿タイプ」のチェックは、その種類のページでElementorを使えるようにする設定です。既存の記事を自動変換するものではありません。
成功の目印
固定ページの編集画面に「Elementorで編集」が表示されます。
3．OptiBの色・フォントに合わせる【任意】
上の画像の②・③を使います。テーマの見た目を引き継ぎたい場合に検討する設定です。
| 設定 | オンにしたとき |
|---|---|
| ② デフォルトカラーを無効化 | Elementorの標準の色を無効にして、テーマの色を継承します。 |
| ③ デフォルトフォントを無効化 | Elementorの標準フォントを無効にして、テーマのフォントを継承します。 |
- 現在のチェック状態をメモします。運用中のサイトは、制作者の設定方針も確認します。
- OptiBの色・フォントを基準にする場合は、必要な項目にチェックを入れて「変更を保存」を押します。
- 見出し・本文・ボタンをプレビューし、既存のElementorページにも意図しない変更がないか確認します。合わない場合は元の状態へ戻して保存します。
すでに見た目が整っている場合は変更不要です。部品に直接指定した色・フォントやグローバル設定は別に確認します。この2項目だけで、すべての文字が必ずテーマと同じになるわけではありません。データ共有は利用者の判断で選ぶ項目で、基本の編集に必須ではありません。
4．ページの表示形式を選ぶ【必要な場合】
これはサイト全体ではなく、編集中のページの設定です。まずは「デフォルト」のまま表示を確認しましょう。
画像を大きく見る（赤い番号付き）
- Elementor編集画面の上部にある①「投稿 設定」または「固定ページ 設定」を開きます。画面のラベルは環境により異なります。
- 左側の③「固定ページレイアウト」を開きます。
- 目的に合う形式を選び、ヘッダー・フッター・本文の幅をプレビューします。
| 表示形式 | 向いている用途・注意 |
|---|---|
| デフォルト／テーマ | サイトやテーマの標準設定を利用します。通常のページはここから確認します。 |
| Elementor 全幅 | ヘッダー・フッターを残し、本文を広く使いたいページ。実際の幅はテーマやコンテナ設定も確認します。 |
| Elementor キャンバス（Canvas） | テーマのヘッダー・フッターなどを表示せず、本文中心で作る形式。独立したLPなどに使います。 |
OptiB独自の「OptiBキャンバス」「OptiB全幅」が出る場合もあります。Elementorの同名に近い形式と同じ挙動だと決めつけず、プレビューして選びます。ヘッダーが消えた場合は、元のレイアウトへ戻して確認してください。
5．練習用の下書きで始める【必須】
- WordPressの「固定ページ」→「固定ページを追加」を開き、タイトルを「練習用・サービス案内」にします。
- 「Elementorで編集」を押します。上の画像は開発環境の既存の練習ページなので、タイトルは「Elementor #166」と表示されています。
- ②のステータスが「下書き」であることを確認します。見出しを1つ入れ、右側に表示されるか試します。
- 右上の保存ボタン横の矢印から「下書き保存」を選びます。「公開」は完成して閲覧者に見せるときに使います。
- 「変更をプレビュー」でページを確認します。
成功の目印
練習用ページをElementorで開き、文字を入力して下書き保存できれば準備完了です。
次に読む：ページを作成・編集する ／ 練習用ページを1枚作ってみよう
6．編集ボタンが見つからないとき
- Elementorが有効化されているか確認します。
- 「投稿タイプ」で、編集したい種類にチェックが入っているか確認します。
- 保存後に編集画面を開き直します。
- メニューがない・操作できない場合は、管理者に利用権限を確認します。
- 既存ページは、元の制作方法を確認してから編集します。ブロックエディターで作った本文を、確認せずElementorへ切り替えないようにします。