テーマ管理

テーマカスタマイズ対応テーマテンプレート(ec_force_basic_theme)

ec_force_basic_themeとは

ec_force_basic_themeは、ecforceが提供するスタンダードなテーマです。
シンプルなデザインが特徴で、ECサイトのトレンドや新機能リリースに合わせてユーザーインターフェイスがアップデートされます。 テーマカスタマイズ機能や言語の編集機能により、コード編集なしでショップの基本的な見た目や雰囲気を、独自のブランドに合わせてカスタマイズできます。 thumb_goodskin.png

使用可能な機能一覧

ec_force_basic_themeでは、以下機能を使用できます。

ec_force_basic_themeのファイル概要

新しくなった管理画面のUIのコード編集画面では、ファイルツリー表示によりすべてのファイルを確認、編集できます。

Caution!!

コード編集を行ったテーマはサポートの対象外です。
assets ec_force_basic_themeに使用されているcssファイルを格納したフォルダ
config テーマカスタマイズに関するデータファイルを格納したフォルダ(編集非推奨)
locales 言語の編集に関するデータファイルを格納したフォルダ(編集非推奨)
section_schema テーマカスタマイズに関するデータファイルを格納したフォルダ(編集非推奨)
sections 画面をセクション毎切り出したファイルを格納したフォルダ
  • トップページ
  • 商品一覧画面、商品カテゴリー詳細画面、キーワード検索結果一覧画面
  • 商品詳細画面
  • カート画面
  • パスワード保護画面
snippets 複数画面で共通利用するファイルを格納したフォルダ
~.html.liquid ショップを構成する基本的なファイル
layouts 複数ページに共有なファイルを格納したフォルダ

ec_force_basic_themeを利用する

テーマ管理トップ画面の「テーマを追加」からテーマを追加してください。
※詳しくはテーマ管理 テーマを追加をご参照ください。

コード編集画面 ファイルツリー表示

ファイルツリーを利用する

  1. テーマ管理にアクセスします。
  2. コードを確認、編集したいテーマの「アクション > コードの編集」をクリックします。
  3. サイドバー上部のテーマ名の右側のアイコン(ツリー表示)をクリックします。
    ※一覧表示に戻す場合はアイコン(一覧表示)をクリックします。
  4. 対象のテーマのファイルがすべて表示されます。

ecfdev-11870_faq_4.png

新規ファイルを作成する

ファイルツリー表示では、各フォルダの配下に新規ファイルを作成することができます。

  1. 各フォルダの右端に表示されている「・・・」をクリックします。
  2. 表示された「新規ファイル」をクリックします。
    ecfdev-11870_faq_5.png
  3. フォルダの最上部にファイル入力カラムに作成したいファイル名を入力してください。
    ※拡張子まで入力してください。
    ecfdev-11870_faq_6.png
  4. キーボードのEnterキーを押すことでファイル作成が行われます。
    ※拡張子が指定されていないファイル名は作成されません。
    ※作成をキャンセルしたい場合は、入力カラム以外のフィールドをクリックしてください。

注意点

  • 使用可能な拡張子は「.liquid」「.css」「.json」のみです。
  • フォルダ作成はできませんのでご注意ください。
  • 同一フォルダ内では同一名でのファイル作成はできません。
  • 新規作成されたファイルはファイル一覧表示には表示されません。
  • コマンドでの上の階層へのファイル作成はできません。

ファイルを削除する

ファイルツリー表示では、各ファイルを削除することができます。

  1. 各ファイルの右端に表示されている「・・・」をクリックします。
  2. 表示された「削除」をクリックします。
    ecfdev-11870_faq_7.png

注意点

  • 一度削除したファイルは復元できないのでご注意ください。
  • フォルダ内のファイルをすべて削除するとフォルダも削除されます。
  • ファイル削除により、テーマ管理の機能が利用できなくなる場合やショップ画面の表示が崩れる恐れがあるためご注意ください。

ファイル名を変更する

ファイルツリー表示では、各ファイルのファイル名を変更することができます。

  1. 各ファイルの右端に表示されている「・・・」をクリックします。
  2. 表示された「ファイル名変更」をクリックします。
    ecfdev-11870_faq_8.png
  3. 対象のファイル名が入力可能となるので、変更したいファイル名を入力してください。
    ※拡張子の変更も可能です。
    ecfdev-11870_faq_9.png
  4. キーボードのEnterキーを押すことでファイル名変更が行われます。
    ※拡張子が指定されていない場合は、変更内容は保存されません。
    ※変更をキャンセルしたい場合は、入力カラム以外のフィールドをクリックしてください。

注意点

  • 使用可能な拡張子は「.liquid」「.css」「.json」のみです。
  • 同一フォルダ内では同一名でのファイル名への変更はできません。
  • ファイル一覧表示に表示されているファイル名を変更すると、一覧表示では対象ファイルのコードが表示されなくなります。
  • コマンドでのファイルのフォルダ移動はできません。
  • ファイル名変更により、テーマ管理の機能が利用できなくなる場合やショップ画面の表示が崩れる恐れがあるためご注意ください。
この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています
他にご質問がございましたら、リクエストを送信してください

この記事の目次

このセクションの記事

テーマ管理