新ページエディタの基本操作方法

エディタとはページ作成・編集するための機能です。パーツを組み合わせるだけで、レスポンシブデザイン対応のWebページを作成することができます。

1)エディタまでのアクセス

サイドナビにあるページ管理を選択して、ご利用シーンに合わせて次へ進んで下さい。

 

■新規ページを作成する場合

ページ管理>新規テンプレート>設定する

新規テンプレートを開くと、デザイン一覧が表示されます。下記の参照画像はテストですので数点並んでいますが、ひとつ選択します。

 

■ページを編集する場合

ページ管理>テンプレート管理>ページ編集

テンプレート管理を開くと、新規テンプレートで作成したページ一覧が表示されます。下記の参照画像はテストですので数点並んでいますが、ひとつ選択します。

 

選択後のテンプレート設定では、ご利用サイトのラジオボタンを選択し、テンプレートに管理しやすい名前を付けて下さい。楽天市場に複数出店されている場合、名前の付け方はわかりやすくするため重要です。 テンプレート名を入力後、「次へ」をクリックして下さい。

 

2)エディタTOP(配置設定)

■パーツ追加(コンテンツを増やす時に使用)

パーツの全てを選択した状態になります。
「このページでできること:」の説明書きにもあるように、ドラッグ&ドロップにて配置できます。「×」をクリックすると閉じます。

参考例は、テンプレートの編集です。
配置されたツールやパーツがある状態です。


レフトナビに並ぶ一覧を選択のうえ、絞り込みすることができます。
ここでは、参照までにいたします。

 

 

■パーツ差替(同箇所のパーツデザインを変える時に使用)

パーツ差替をクリックします。

使うボタンをクリックします。

 

差替えは完了します。

 

■ソース(HTML/CSSを直接編集する時に使用)

ソースをクリックします。

 

タグを編集してから、保存をクリックします。

参考例は、全体CSS設定です。

 

■テキスト編集

テキスト編集できる部分をクリックすると、オレンジの枠になります。この状態で直接テキストを編集することができます。

改行するときは、キーボードの「Enter」キーで改行します。

 

■画像変更

1.レフトナビの画像>カスタマイズ>追加(パソコンから画像をアップロードすることができます)

2.変更したい画像をダブルクリックします(パソコンから画像をアップロード、または画像URLで設定することができます)

 

※画像>サンプルの中の画像は動的なデータを使うため、後述のデータ設定にて設定します。

 

3)エディタTOP(データ設定)

基本的な配置や画像、テキストを作成できましたら、データ設定に移動します。

 

前述のように、一部設定できない画像があります。
テキストは、データ形式で設定します。

ページ上に「データ設定」ボタンがある部分は、データ設定する必要があります。

すでにデータがある場合は、リストから選択するだけです。 新規で作る場合は「データ設定」をクリックします。

 

4)エディタTOP(プレビュー)

ページをアップロードする前に、プレビューでレイアウトやテキストの最終確認します。

※データ設定の部分は、サンプル画像のままです。

問題がなければ、アップロードをクリックします。 作成したページをFTPにアップロードします。

ページおよび関連データはFTPにアップロードされますが、この段階では一般公開されていません。 ※一般公開の前に、FTP上(実際の環境)でページ内容を確認するためです。

 

5)最終チェック

ページ管理>プレビュー

ページがアップロードされましたら「アップロード済」に変わります。 プレビューをクリックして、デザインレイアウトやデータの内容を確認して下さい。

※FTPサーバーの反映時間があるため、数分~1時間あけてから確認して下さい。

公開する前に、実際の環境で確認するため、必ずアップロードを行ってからプレビュー確認をして下さい。

 

ページが完成です!

 

動画マニュアルも合わせて、ご参考下さい。

 

■その他、役立つ機能のご紹介

・一括置換えツール「CodeTool」についてはこちら

・SEO対策に役立つ、メタタグの設定についてはこちら

・共通ヘッダー・サイド・フッター用のiframeタグの設定方法についてはこちら

・パーツの一時的表示・非表示設定方法についてはこちら

・楽天市場店舗の方は必見!

アクセス統計するために必要なことについてはこちら