無料ネットショップサービス『ShopStar(ショップスター)』

HTML編集機能について

ShopStarでは、ショップサイト各ページのHTMLを直接編集する機能(「以下、HTML編集機能といいます」)がご利用いただけます。

HTML編集機能では、通常のHTMLだけでなく、PHPのテンプレートエンジン「Smarty」の構文や、ShopStar独自のカスタムタグや特殊タグを用いてショップサイトをデザインできます。

カスタムタグについて

ShopStar独自のカスタムタグをHTMLの構文内に記述することで、ユーザーが設定した情報や、よく使うHTMLのタグ構造を簡単に表示できます。
カスタムタグはテンプレートの各ページのHTML内に記述できるほか、商品フリーテキストやお知らせ等でもご利用いただけます。
用途に合わせて自由にご利用ください。

カスタムタグには、「変数」と「関数」の２つの種類があります。

変数

変数は「{$変数}」のように記述します。
例えば、下記の例では、ユーザーが設定したショップ名を出力しています。

{$shop_name}

変数の詳細については変数一覧をご参照ください。

関数

関数は「{関数名(引数, 引数…)}」のように記述します。
下記の例では、関数を用いて、ユーザーがアップロードした画像ファイルのパスを取得し、画像を表示しています。

<img src="{user_image('sample/pic1.png')}">

変数の詳細については、関数一覧をご参照ください。

特殊タグについて

テンプレートの各ページのHTMLでは、「特殊タグ」を記述することができます。
「特殊タグ」は別のTPLファイルの読込みや、画像や色情報の置き換え処理を行なっています。

タグ	説明文
%INCLUDE_MAIN%	このタグが記述された箇所に、各ページのコンテンツが表示されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_SYSTEM_HEADER%	このタグが記述された箇所に、「システムヘッダ(system_header.tpl)」の内容が挿入されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_SYSTEM_FOOTER%	このタグが記述された箇所に、「システムフッタ(system_footer.tpl)」の内容が挿入されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_HEADER%	このタグが記述された箇所に、「ヘッダのWEBパーツ」の内容が挿入されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_LEFT_SIDE%	このタグが記述された箇所に、「左メニューのWEBパーツ」の内容が挿入されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_FOOTER%	このタグが記述された箇所に、「フッタのWEBパーツ」の内容が挿入されます。 ※「レイアウト(layout.tpl)」にのみ記述することができます。
%INCLUDE_WEBPARTS%	このタグが記述された箇所に、「TOP画面のWEBパーツ」または「商品詳細画面のWEBパーツ」の内容が挿入されます。 ※「TOP(top.tpl)」「商品詳細(product.tpl)」にのみ記述することができます。
その他「%」で囲まれているタグ（「%SITE_LOGO%」等）	「画像設定ファイル(imageset.dat)」または「色設定ファイル(colorset.dat)」の設定に従って、画像のURLまたは色情報が挿入されます。

テンプレートフォルダの構成

デザインテンプレートのフォルダ構成は下記のようになっています。
なお、テンプレートフォルダは、テンプレート追加を行なった際に自動で作成されます。
テンプレートは、0から始まる番号のフォルダで管理しています。無料プランのユーザーであれば0～2、プレミアムプランのユーザーであれば0～11のフォルダが利用できます。