「HTML編集 App」を利用すると、HTML / CSS / JavaScript などを編集することで、自由にショップページをデザインすることができます。テーマやデザインパーツだけでは表現しきれない、独自のデザインも実現することが可能です。
注意事項（かならずご確認ください）
- 実装についての技術的なサポートはおこなっておりません。
- 「HTML編集 App」は、PCからのみご利用いただけます。
- 「HTML編集 App」を利用して、ショップページのHTMLを直接編集した場合、「BASE」によるショップページの更新（新規機能の追加、不具合の修正など）が自動で適用されない場合がございます。その場合は、ショップオーナー様ご自身でメンテナンスをお願いいたします。
- 「HTML編集 App」を利用して作成したテーマでは、パーツ機能はご利用いただけません。
- 編集の元とすることができるテーマは、「新規作成（サンプル）」と「デザインマーケットで購入したデザイナーズテーマ」のみです。無料のオフィシャルテーマを元に、HTML編集をすることはできません。
HTMLを編集して、テーマを作成する
新しいテーマを作成したい場合は、「＋テーマを作成する」を選択してください。「＋テーマを作成する」を選択すると、新規作成方法の選択肢が表示されます。作成済みのテーマを続けて編集したい場合は、一覧からテーマを選んで「< />」ボタンをクリックしてください。
【新規作成を選択した場合】
「新規作成」を選択すると、編集用のエディタが表示されます。
【購入したテーマを元に新規作成を選択した場合】
「購入したテーマを元に新規作成」を選択すると、デザインマーケットで購入したデザイナーズテーマがあれば、テーマが一覧で表示されます。元にしたいテーマ横の「このテーマを元に作成」を選択すると、編集用のエディタが表示されます。
ソースコードは、BASE Templateの記述ルールを参考に、自由に編集することができます。BASE Templateの記述ルールは、ドキュメントを参照してください。
【Tips：テーマエディタの使い方】
- 検索 Windows Shift + F / Mac ⌘ + F
- 置換 Windows Shift + Ctrl+ F / Mac ⌘ + Option + F
- 入力補完 Windows / Mac Ctrl + Space
編集中の内容をプレビューする
「プレビュー」ボタンをクリックすると、別タブでプレビュー画面が表示され、編集した内容を確認することができます。プレビュー画面右上のボタンで、PCとスマートフォンの表示を切り替えることができます。
「デザインオプションを表示」ボタンをクリックすると、開発したテーマ設定やロゴ・背景設定が表示され、プレビュー上で設定を試すことができます。
※こちらは開発サポート用の機能となりますので、設定したオプションは、ショップページには反映されません。
テーマを保存する
「保存する」ボタンで、編集したテーマを保存することができます。現在利用中のテーマを編集した場合は、そのままショップページに反映するかどうかをお選びいただくことができます。
作成したテーマをショップページに反映する
新しく作成したテーマを実際にショップページに反映するには、ショップデザイン機能の「テーマ」メニューの「カスタムテーマ」欄から、作成したテーマを選択してください。
「保存する」で、編集内容が保存され、ショップページにデザインが反映されます。
作成したテーマを削除する
作成したカスタムテーマを削除するには、作成したテーマ一覧で、削除したいテーマを選んで「削除」ボタンをクリックしてください。削除したテーマは、元に戻すことはできません。
「HTML編集 App」をアンインストールする
「無効にする」から「HTML編集 App」のアンインストールをすることができます。
「HTML編集 App」をアンインストールしても、公開中のショップページのデザインが自動で変更されることはありません。