Smartyテンプレートの記述について

Smartyテンプレートについて

Smartyとは、テンプレートエンジンのひとつです。
当システムではSmartyテンプレート(以降、テンプレートファイル)を用いてWebサイトを構築しており、テンプレートファイルの拡張子は[tpl]です。
例えば、サイトトップパージを構築するテンプレートファイルは「top.tpl」となります。

サイトを構築する上でテンプレートファイルを編集することになりますが、ここではファイルを編集する注意点、利用可能な定数、ページ判定をご説明します。

直接記述についての注意点 ドメイン変更の際に全該当ファイルの修正が必要となってしまいますので、Smartyテンプレート(拡張子.tpl)内の記述は「ご契約ドメイン」を そのまま記述されないようにお願い致します。





定数

定数とは、Smartyテンプレート内に記述できる「smartyタグ」を指します。
「example.jp」をドメイン例としてあてはめています。
定数 対応する文字列(置き換えられる文字)
<!--{$smarty.const.SITE_URL}-->
https://example.jp
※httpsから始まるサイトドメインのURLに置き換わります。
<!--{$smarty.const.SHOP_DOMAIN}-->
example.jp
※サイトドメインに置き換わります。

【記載例】
×
お問い合わせ先: info@example.jp
お問い合わせ先: info@<!--{$smarty.const.SHOP_DOMAIN}-->




混合コンテンツ(Mixed Content)に関連するHTMLタグ・属性のパス

主要ブラウザではSSL下のページにて画像、動画、スタイルシート、スクリプトなどのリソースがHTTP接続で読み込まれた場合、混合コンテンツ(Mixed Content)が発生し、HTTP接続のリソースがブロックされます。

SSLページ下で混合コンテンツ(Mixed Content)を発生させないために、以下に指定するパスは絶対パスや相対パスではなく、サイトルート相対パス(/で始まるパス)でご記述ください。
(ドメインを直接記述されますと、ドメイン変更作業時に全て修正し直す作業が発生致しますので、サイトルート相対パスでの記述を推奨致します。)
  • <img><audio> <video> <script> <iframe> タグ の src 属性、 srcset 属性
  • <object> タグ の data 属性
  • url 値を用いる CSS すべて (@font-face / cursor / background-image など)
  • <link> タグ の href 属性


SSL下のページにて
  • 画像が正常に表示されない場合
  • URLの横に 保護された通信 の文字が表示されない場合(Google Chrome)



パスの記述例
非推奨
<img src="https://example.jp/upload/img/cake.jpg">
※ドメインを含む絶対パスでの記述はドメイン変更時に書き換え作業が発生するため非推奨です。
推奨
<img src="/upload/img/cake.jpg">
※相対パスで記述した場合、ドメイン変更時に書き換えは不要となりこの記述を推奨します。




<a>タグのhref属性、<from>タグのaction属性の属性値で指定するパス

<a>タグのhref属性、<form>タグのaction属性の属性値やcss内で指定するパスに関しましてもサイトルート相対パス(/で始まるパス)で始まるパスでご記述ください。

パスの記述例
<a href="/order/index.php">特定商取引に関する法律</a>




ページ判定

ページ判定 記述例
TOPページ
<!--{if $arrPageLayout.is_top_page}-->●●●●<!--{/if}-->
商品詳細ページ
<!--{if $arrPageLayout.is_product_page}-->●●●●<!--{/if}-->
指定商品ID check_product_id
数値、またはカンマ区切りの数値で指定した商品IDのページの場合、trueを返します。
指定した商品ページのみ、特定の文字を表示させたい場合などにご利用下さい。
<!--{if '5'|check_product_id}-->●●●●<--{/if}-->
カテゴリページ
<!--{if $arrPageLayout.is_category_page}-->●●●●<!--{/if}-->
指定カテゴリID check_category_id
数値、またはカンマ区切りの数値で指定したカテゴリIDのページの場合、trueを返します。
指定したカテゴリページのみ、特定の文字を表示させたい場合などにご利用下さい。
<!--{if '7,10,13'|check_category_id}-->●●●●<!--{/if}-->
フリーページ
<!--{if $is_free_page}-->●●●●<!--{/if}-->
LPフォーム
<!--{if $arrPageLayout.is_lp_page}-->●●●●<!--{/if}-->
購入確認ページ
<!--{if $arrPageLayout.is_confirm_page}-->●●●●<!--{/if}-->
購入完了ページ
<!--{if $arrPageLayout.is_complete_page}-->●●●●<!--{/if}-->


ページ判定記述例

例: 商品詳細ページのみ
<!--{if $arrPageLayout.is_product_page}-->
    ●●●●
<!--{/if}-->

例: 商品詳細ページ、且つ、商品ID:3
<!--{if $arrPageLayout.is_product_page}-->
    <!--{if '3'|check_product_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: 商品詳細ページ、且つ、商品ID:5または10または12
<!--{if $arrPageLayout.is_product_page}-->
    <!--{if '5,10,12'|check_product_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: 商品詳細ページ、且つ、商品ID:7を除く
<!--{if $arrPageLayout.is_product_page}-->
    <!--{if !'7'|check_product_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: カテゴリページのみ
<!--{if $arrPageLayout.is_category_page}-->
    ●●●●
<!--{/if}-->

例: カテゴリページ、且つ、カテゴリID:3
<!--{if $arrPageLayout.is_category_page}-->
    <!--{if '3'|check_category_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: カテゴリページ、且つ、カテゴリID:7または10または13
<!--{if $arrPageLayout.is_category_page}-->
    <!--{if '7,10,13'|check_category_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: カテゴリページ、且つ、カテゴリID:9を除く
<!--{if $arrPageLayout.is_category_page}-->
    <!--{if !'9'|check_category_id}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: LPページ、且つ、LPフォームキー:cake
<!--{if $arrPageLayout.is_lp_page}-->
    <!--{if $smarty.get.p == 'cake'}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

例: フリーページ
<!--{if $is_free_page}-->
    <!--{if $free_page_name == 'sample_free_page'}-->
        ●●●●
    <!--{/if}-->
<!--{/if}-->

この記事の目次

  1. Smartyテンプレートについて
  2. 定数
  3. 混合コンテンツに関連するタグ・パス
  4. 属性値で指定するパス
  5. ページ判定

ありがとうございました。
よろしければ、ご意見をお聞かせください。

件名、コメントをご入力いただき、『送信』ボタンをクリックしてください。

ご意見を送られない場合は、『閉じる』ボタンをクリックしてください。

件名:

お問い合わせ内容:

閉じる