デイトラshopifyアドバンスコース学習方法!40代はスクールやめた方が良い?[第7週]

Variable Tags（assign使えるくらいで十分）

• assign
• capture（メール文でよく使われる）
• increment
• decrement

{% assign fruits = "バナナ,りんご,オレンジ" | split: ',' %}
{% for fruit in fruits %}
  <p>{{ fruit }}</p>
{% endfor %}

☝️

| split: ‘,’ は、Liquid で配列を扱う上で重要な役割を果たす基本的なテクニック。

文字列を配列に変換することで、for ループなどの制御構造を使用して効率的にデータを処理できるようになる。

assign：変数の宣言と値の代入に使用

基本的な構文

計算結果や他の変数の値を代入することも可能

{% assign num = 50 %}
{% assign num2 = num | plus: 30 %}

オブジェクトも代入できる

{% assign title = product.title %}

Theme Tags（テーマタグ）

• テンプレートのHTMLを出力
• テーマに指示（レイアウトやスニペットを使用する指示）
• 複数のページに分割する（返された配列）

テーマタグ

• include (非推奨)
• javascript
• layout
• render
• section
• sections
• stylesheet

sectionフォルダ内のファイル間ではファイルを読み出せない

👉️ theme.liquid ファイル（Layoutフォルダ）からsectionフォルダのファイルを読み込む

JavaScript のコード様式

{% javascript %}
  javascript_code
{% endjavascript %}

CSS のコード様式

{% stylesheet %}
  css_styles
{% endstylesheet %}

💡抑えておくこと💡ただし if文を使うなら👇️の様式じゃないと表示できない

<style>
  .liquid-box {
    margin: 40px;
    padding: 40px;
    border: 4px dashed {% if template == "index" %}#00B0B0;{% else %}#000000;{% endif %};
  }
</style>