クリエイターモードでフリーページ(独自ページ)実装
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ライフを