Skip to content

1. 画面構成と基本操作

特集ページを作成・編集するためのエディタ画面 (/feature-page-edit/[id]) の見方と基本的な操作について解説します。

特集ページ管理画面 (概要参照) で「編集」ボタンをクリックすると、このエディタ画面が開きます。

エディタの画面構成

エディタは主に3つのエリアで構成されています。

特集ページエディタ画面構成 (エディタ全体のスクリーンショットに各エリアを示す番号などを追記)

  1. 左ナビゲーション: 画面左端にあり、編集モードを切り替えます。
    • パーツ: ページを構成する要素(バナー、商品リストなど)を追加・編集・管理します。
    • テーマ: ページ全体のデザインテーマを選択・カスタマイズします。
    • 設定: ページタイトル、メタ情報、URLなどの基本設定を行います。
    • 公開: 作成したページをストアにアップロード(デプロイ)します。
  2. 設定エリア(中央左): 左ナビゲーションで選択したモードに応じた設定項目が表示されます。
    • 「パーツ」モード時: ページに追加されているパーツの一覧が表示されます。パーツをクリックすると、そのパーツの詳細設定がここに表示されます。
    • 「テーマ」モード時: 利用可能なテーマの一覧と、選択中のテーマのカスタマイズオプションが表示されます。
    • 「設定」モード時: ページ全体の基本設定(タイトル、メタ情報など)が表示されます。
    • 「公開」モード時: デプロイに関する情報と実行ボタンが表示されます。
  3. ライブプレビュー(中央右): 編集中のページがリアルタイムで表示されます。PC表示とスマートフォン表示を切り替えることができます(※切り替え機能がある場合)。プレビュー内のパーツをクリックすることでも、そのパーツを選択して設定エリアに編集オプションを表示させることができます。

基本的な操作の流れ

特集ページ作成は、一般的に以下の流れで行います。

  1. パーツの追加と編集 (ガイド 2, ガイド 3) 左ナビゲーションで「パーツ」を選択し、ヘッダー、ボディ、サイドメニュー、フッターに必要なパーツを追加していきます。追加したパーツを選択し、設定エリアで内容(テキスト、画像、商品など)やスタイル(色、余白など)を編集します。

  2. テーマの適用と調整 (ガイド 4) 左ナビゲーションで「テーマ」を選択し、ページ全体のデザインテーマを決定します。必要に応じて、テーマの基本色などを微調整します。

  3. ページ設定の確認 (ガイド 5) 左ナビゲーションで「設定」を選択し、ページの管理名、公開タイトル、メタディスクリプションなどを設定します。

  4. 保存 編集作業の途中や完了時に、画面上部にある「保存」ボタンをクリックして変更内容をRakuboのデータベースに保存します。 (※自動保存機能がある場合はその旨を記載)

  5. プレビュー確認 ライブプレビューでPC表示とスマートフォン表示の両方を確認し、レイアウト崩れや意図しない表示がないかを確認します。

  6. 公開(デプロイ) (ガイド 7) 左ナビゲーションで「公開」を選択し、「デプロイ」ボタンをクリックして、完成したページを実際のストアに反映させます。


これでエディタの基本的な見方と操作の流れは完了です。 次は「2. パーツの追加と管理」で、ページにパーツを追加したり、並び替えたりする方法を詳しく見ていきましょう。