デザイン設定(上級)

使用するテンプレートのHTML、CSSを編集しデザインをカスタマイズすることができます。
【編集中のテンプレートを確認するには】テンプレート名もしくは「利用中のテンプレート」の下にある画面キャプチャをクリックすると、編集中のショップ画面を確認できます。

テンプレート選びに迷っている方へ

レスポンシブのテンプレートがおすすめです。

下記ページにて、編集・確認することができます。

テンプレートを編集する

無題

【デザイン設定】画面で、編集するテンプレートの【デザイン編集】ボタンをクリックします。

編集するテンプレート種類を選択

テンプレート名の編集

使用するテンプレート名を編集できます。
『オリジナル名称』の欄には、テンプレートをダウンロードした際のオリジナルテンプレート名称が表示されます。

商品一覧時の設定

並び順の初期設定

カテゴリー(グループ)別商品一覧、商品検索結果での、商品の並び順を設定します。

  • おすすめ順…設定した表示番号順に表示されます。表示番号の設定がない場合、登録の古い商品から順に表示されます。
  • 価格順…価格の安い順に表示されます。
  • 新着順…登録の新しい商品から順に表示されます。
表示商品数

カテゴリー(グループ)別商品一覧、商品検索結果での、1ページに表示される商品数を設定します。

フリーページ編集

現在選択中のテンプレートの、フリーページ設定画面へ移動します。

【フリーページ設定】 の説明はこちら

テンプレート種類一覧

テンプレート種類一覧が表示されますので、設定を行うページの【HTML・CSS編集】をクリックしてください。
 黄緑色の項目はSSL対応画面となります。 SSL対応画面は、【CSS編集】のみとなります。

【初心者モード】 の説明はこちら

HTML・CSSの編集

HTML編集

HTMLを表示しています。 編集エリアは、<body> 要素以下から設定されています。
<{**********}> のように記述されている箇所は独自タグとなります。
消去されますと正常な動作が出来なくなりますのでご注意ください。

例: <{ $logo }> 等
※この項目はHTML編集が可能な場合のみ表示されます。
※HTMLの文字数は半角65,530文字が上限となっています。

CSS編集

設定されているCSSを表示しています。
※この項目はCSS編集が可能な場合のみ表示されます。
※CSSの文字数は半角65,530文字が上限となっています。

編集エリア拡大

クリックすると編集エリアが拡大されます。

編集エリア縮小

クリックすると編集エリアが縮小されます。

入力支援ツールで編集

クリックすると、文字の色や大きさを変更したり画像挿入用のHTMLタグを入力する支援ツールが
別ウィンドウで表示されます。 【入力支援ツール】 マニュアルはこちら

初級モードに切り替え

【初級モードに切り替え】ボタンを押すと、「初級モードで編集」画面に切り替わります。

更新

【更新】ボタンを押すと、編集内容を保存します。

もとに戻す

【更新】ボタンをおすひとつ前の状態に戻ります。履歴は5回まで保存されています。

※最初に編集する時は【もとに戻す】ボタンは表示されません

もどる

【デザイン設定】画面に戻ります。

変更内容で更新する

確認のアラートが表示されますので、【OK】ボタンをクリックします。

以上で設定は完了です。 【デザイン設定】 に戻る