らくうるカートのテンプレート編集メモ

らくうるカートの全面カスタマイズ依頼をお受けしたので、テンプレート編集で引っかかったところを記録しておきます。

進行につれ気になる点が出てくれば追記しますが、あまり無いかも。

jinjaテンプレートだが、ほぼ気にしなくて良い

前にちらっと書きましたが、らくうるカートのテンプレート編集(HTML編集)をひらくとjinja(神社)で出来ている(多分)ことが分かります。djangoやFlaskで使われるテンプレートエンジンです。

しかしながら、テンプレートに勝手にjinjaのフィルターを追加しようとするとシンタックスエラーが出て更新できません。

いろいろ試してみた結果、if と for ぐらいしか使えないので、Pythonもjinjaも知らなくて大丈夫です。

コメント( {# コメントをかく #} )は大丈夫でした。

if forの書き方

HTMLとCSS以外は明るくない方のために、基本のifとforの書き方だけ残しておきます。

if

{% if 条件 %}
    {# 条件にあう場合のHTMLコードを記述 #}
{% else %}
    {# 条件に当てはまらないときのコードを記述 #}
{% endif %}

演算子(== , != , is , is not など)やand or は使えますが、elifタグは使えません。elseifは大丈夫。

for

forが使用されているのはほとんどが商品の一覧です。新着商品を例にすると、

{% for i in itemRecentList %}

  {# 新着商品(itemRecentList)に登録されている商品情報がループ処理される #}
  <h3>{{ i.itemName }}</h3><!--  商品名 -->
  <p>{{ i.salePrice }}</p><!-- 価格 -->

{% endfor %}

emptyタグは使用出来ませんでした。(エラーがでる)

forloop.first 、forloop.lastも使用できません。エラーは出ませんが無効です。

forloop.counterも使用できません(エラー)が、テンプレートを見ていると「●●●ItemCounter」というタグがあり、これが利用できそうです。

例えば、ナビゲーションでカテゴリー一覧をループで表示させるとき、

{% for item in categoryList %}
  {% if categoryItemCounter == 1%}
    # 最初のアイテムのみの表示処理
  {% else %}
    # 2番目以降の表示処理 
  {% endif %}
{% endfor %}

とすると、if forloop.first の代わりになります。

ほかにも、loop.index を使って、

{% for product in someList %}
  {% if loop.index == 0 %}
    {# 初回のみの処理 #}
  {% endif %}
{% endfor %}

でも、同様の結果を得られます。

フィルターやif for以外はほとんど使えない

全部試したわけではないですが、フィルターは使えないと思って差し支えないと思います。(追記:lengthは使えそうです。)

テンプレート用の変数がわりと細かく用意されているので、フィルターいらないかなとは思いました。pprintが使えると嬉しかったかも。

タグも多分if for 以外はことごとく拒否されます。

{% itemRecentList %}、{% not itemRecentList %}のように、タグを省略した書き方もNGです。

set は使える

set を使用して、独自の変数を作ることは可能です。

{# 例 #}
{% set myName = "ミフネWEB" %}

<h1>{{ myName }}</h1><!-- ミフネWEB -->

JavaScriptは共通HTMLのみ

他のショッピングカートサービスだと、たとえば商品詳細ページの途中にscript要素を使ってJSを書いてもOKだったりするのですが、らくうるカートではエラーがでます。

共通HTMLの末尾ないしheadタグに記述しましょう。

直接、ページを振り分けるための変数はありません(嘘:ページ振り分け用の「shopBlckTypeId」という変数がありました。見落としていました)が、各ページにしか存在しない変数を使って振り分けることは可能です。

これから他にも出てくれば追記します。

webPファイルもアップロードできる

できるかな〜? でやったら出来てしまったのがwebP画像のアップロード。編集画面から直接アップロードする商品画像などにはアップロードできませんが、ファイル管理からのアップロードは可能なので、置き換え可能なところは全部webPにできました。

とても重要な注意点

らくうるカートの管理画面は30分画面の遷移がなければタイムアウトします。

商品編集やテンプレート編集、送料ルールの設定などに時間をかけてしまうと、【保存】を押した瞬間に絶望することになります。30分以上、同じ画面にとどまらないように細心の注意を払いましょう。

らくうるカートのショップ作成(テンプレート編集)のご相談承ります。

もともとヤマト運輸を利用しており、特に生産者様自身がネットショップ運営されている場合、らくうるカートは結構人気があります。

ヤマト運輸用に作られているECサービスなだけあってかなり事務作業を軽減することができますから、忙しい生産者様には好評なようです。(一次産品オプションとか、かなり人気です)

一方で、独特なテンプレートでとっつきにくい & ネット上に情報も少ない & プレビュー表示機能がない(重要) などで、頭を抱えるWeb制作会社様も多いそうです。

ミフネWEBではらくうるカートがサービス公開したときからショップ制作に携わってきたので、新規ショップ制作、他サービスかららくうるカートへの移行、テンプレートの編集、をお考えの方はお問合せよりご相談ください。

らくうるカート利用のネットショップ 制作事例
らくうるカートは、作業時間を少しでも短縮したい方には本気でおすすめしたいネットショップサービスです。らくうるカートを利用されているショップもだいぶ増えましたので、実際のらくうるカート制作事例を6ショップご紹介していきたいと思います。不定期に更新していますが、情報は掲載当時のものですのでご了承ください。

タイトルとURLをコピーしました