クリエイターモードでフリーページ(独自ページ)実装
2020.11.15
クリエイターモードが、ようやくフリーページに対応しました
クリエイターモードでもようやくフリーページに対応しました。
もちろん独自関数を使う事が出来ますので、無理なく移動することが可能になりました。
フリーページの特徴
フリーページの特徴として、下記2点が紹介されています。
- 全ページ共通関数が利用可能
- モジュールのの配置が可能
全ページの共通関数については、下記ページをご参照ください。
https://reference.makeshop.jp/taglist/creator-mode/common.html
新商品を紹介するソースサンプル
フリーページにて新商品を紹介するサンプルは以下のようになっております。ご自由に変更してご利用ください。
<{if $new_item.has_item}>
<section id="newItems">
<h2 class="section-title">NEW ITEMS</h2>
<ul>
<{section name=i loop=$new_item.list max=9}>
<li class="product-list-item">
<a href="<{$new_item.list[i].url}>" class="product-image-link box">
<figure>
<{if $new_item.list[i].image_L}>
<img src="<{$new_item.list[i].image_L}>" alt="<{$new_item.list[i].name}>">
<{else}>
<img src="//gigaplus.makeshop.jp/xxxxx/images/nowpringing.jpg" alt="<{$new_item.list[i].name}>">
<{/if}>
</figure>
<div class="text-bloc">
<p class="itemName"><{$new_item.list[i].name}></p>
<p class="itemPrice">¥<{$new_item.list[i].price|number_format}></p>
</div>
</a>
</li>
<{/section}>
</ul>
</section>
<{/if}>このとき、max=9の値をすれば、表示する数を変更可能です。
価格を3桁区切りで表示する
価格の個所を1,000,000のように3桁で区切る場合には、「|number_format」を付けるだけでOKです。
<{$new_item.list[i].price|number_format}>
フリーページで出力される要素
フリーページで自動で出力される要素は、何もありません。ですので、ページとして出力する際にはヘッダ要素が必要となりますが、そのお陰で様々なコンテンツで利用が可能になります。
例えば、次のようなことが可能になります。
- フリーページとしての利用
- カテゴリページで特定のカテゴリに別デザインを充てる
- モジュール以外の共通パーツとしての利用
- 特商法や会社概要などで任意の値を入れたい場合や、別の表現をしたい場合での利用
これまでgigaplusサーバ内に置いていたファイルを呼び出す場合、iframeやjquery.ajax、jquery.xdomainajax.jsなどを利用して表示を行ってきたかと思いますが、通常のload関数でファイルを呼び出すことが出来るようになったのは、とても安心です。
特にmakeshopはWordpressの『s』同様、URLのコマンドを利用して値を取得していますので、セキュリティレベルを上げることが可能です。
それでは良いmakeshopライフを