カラーミーショップのトップページやその他のページにフリーページのコンテンツを表示させる

カラーミーショップカスタマイズ

カラーミーショップ には、トップページに「お知らせ」と「フリースペース」とで2か所、自由に挿入できるスペースがあります。

「お知らせ」は、入荷情報やイベント情報など、時事的な内容が多いですし、フリースペースはバナーを掲載したり、特集を掲載したいときに使えます。

ただ、実質自由に使えるのは「フリースペース」ですので、実質1か所ということになります。

従って、例えば好みの場所に好みの文言を挿入したい場合は、直接テーマ自体にHTMLコードを入れ込む必要があります。

ただ、この方法ですと、気軽にちょこちょこっと直す、という使い方には向いていません。

テーマ自体のHTMLコードに手を加える際は、「入力支援ツール」が使えないので、ある程度HTMLソースを知っている必要があります。

また、万が一タグの閉じ忘れや不要なタグが入っている場合、トップページ全体のレイアウトがガタガタになってしまうリスクがあります。

また、内容を【テンプレート化】して、複数で使ったりする場合、「フリーページのコンテンツをぺージに掲載する方法」が大変便利です。

カラーミーのフリーページを活用する

カラーミーショップ のフリーページはプランによって作れる数が異なりますが、すべてを使い切ることはあまりないのではないでしょうか。

そこで、コンテンツ内容はフリースペースで管理して、トップページや商品詳細ページ等の任意の場所に挿入することを考えます。

この方法ですと、テーマ自体をいじるのは最初の一回で済みますし、もしレイアウト崩れが起こったとしても、挿入したフリーページ内のソースだけを疑えばいいので管理がしやすいメリットがあります。

ここでメリットをまとめます。

フリーページの挿入を使うメリット

  • 使い慣れている管理画面から編集が可能
  • ソース画面とHTMLエディタを使い分けてコンテンツを作れる
  • サイトのどの部分でも流用可能
  • フリーページの数が許させている限り、入れたい場所に入れたいコンテンツを入れられる
  • テーマを変えたとしても簡単なコードで活用できる
  • ソースに慣れていない人も改編しやすい
  • PHPコードも使える
  • カスタマイズの幅が広がる

ということで、テーマのカスタマイズだけは知識のある人が行って、日常の改編作業はあまり知識がない人に任せる、というような場合でも使いやすい方法です。

さて、前振りが長くなりましたが、以下のコードをテーマのHTMLに挿入するだけです。

※下はフリーページ7を挿入した例です。
番号(下記のfree7 の番号)はそれぞれに応じて変えてください。

<!–フリーページ7の内容を読み込む–>
<{assign var="my_tpl" value=$file_name|regex_replace:"//(.*?)\.tpl/":""}>
<{include file="$my_tpl/free7.tpl"}>

1、最初にフリーページに挿入したい内容を入れる
2.管理画面の「ショップ作成」→「デザイン」に進む
3.利用中のテンプレートで「テンプレート編集」へ進む
4.トップの上級モードで編集「HTML・CSS編集」のHTML編集画面に上記のソースをコピー&ペーストして「保存」

でOKです。

必要に応じてCSSも編集してください。

トップページだけではなく、共通テンプレートなどにも使えると思います^^