テーマの編集方法(Theme one)

Live Commerceのデザインをカスタマイズするには、HTML,CSSの編集スキルが必要です。
編集するには、Live Commerceのテーマ編集エディタ、もしくはDreamweaverなどのオーサリングソフトを使用します。
編集する文字コードはUTF-8(BOMなし)、改行コードはLFを用いるようにしてください。

ここでは、Live Commerceのテーマ編集エディタを使って標準でインストールされているテーマ、theme_oneを編集する手順について説明します。

テーマをコピーして新しいテーマをつくる

テーマは直接編集するのではなく、テーマのコピーを作成して編集することをお勧めします。テーマを切り替えることで、いつでも初期状態に戻すことができます。
以下の手順でテーマのコピーを作成します。

  1. FTPソフトをお持ちでない場合は、FileZilla(Client)などのフリーソフトをダウンロードします。(FFFTP非推奨)
    FTPソフトを起動し、お申し込み時に送付される「Live Commerce納品メール」に記載されたFTP情報(ホスト名/ユーザー名/パスワード)を使ってサーバに接続します。
  2. リモートサイト側(ここでは画面右側)に、Live Commerceサーバ内のテーマディレクトリが表示されます。theme_oneのテーマフォルダを選択し、ローカルサイト(ローカルPC)の保存したいディレクトリを選んだ状態でドラッグ&ドロップするか、マウス右メニューで「ダウンロード」を選択します。
    サイト制作-2

  3. ファイル管理ソフト(Windows エクスプローラーまたはMac Finder)で、theme_oneフォルダがお使いのパソコン上にコピーされたことを確認します。
    サイト制作-3

  4. コピーしたtheme_oneフォルダの直下にある、config.phpファイルをテキストエディタで開きます。’class theme_one’のtheme_の後を変更し、別のクラス名にして保存します。ここではtheme_eva とします。
    テーマ編集-2

    必須ではありませんが、テーマの情報を編集すると管理画面で分かりやすくなります。
    ここでは、テーマ名($_thmName)とテーマの説明($_desc)の値を編集しています。
    テーマ編集-3

  5. ファイル管理ソフト(Windows エクスプローラーまたはMac Finder)で、フォルダ名をtheme_oneからクラス名(theme_eva)に変更します。
  6. theme_evaフォルダを、ドラッグ&ドロップでサーバにアップロードします。
    テーマ編集-3

  7. サイト設定 > テーマ管理 を開き、theme_evaが表示され、テーマ名とテーマの説明が変更されていることを確認します。
    テーマ編集-4

 

テーマを編集する

 

FTPを利用してファイル編集

テーマファイル一覧を参考にFTPにてファイル編集を行います。

オンラインのテーマ以外のテーマの確認方法

サイトのURLの後ろに、テーマ名を指定してアクセスします。
http://サイトのURL/theme/テーマ名
例えば、http://サイトのURL/login/index/theme/テーマ名 とした場合は、ログインページを指定したテーマで表示します。

テーマへの文言の記述

1言語しか扱わないサイトなら、サイトに表示する文言をテーマファイルに直接記述しても問題ありませんが、多言語で運営するサイトではテーマに直接文言を記述しないようにします。サイトの表示言語を切り替えると文言が適切な言語で表示されるように、言語翻訳で多言語のデータを登録し、登録したコード名をテーマに記述します。

Related Articles