条件にあう要素の数など気にする必要なく、今のフラグが「ONなの?OFFなの?」が重要
-本文中

(最終更新 2024年12月23日)

【Shopify Liquid】ループの記録係!1回のみ実行に有用な「フラグ(Flag)」サンプルコード

Shopifyでは、ループ内での処理が多く、主に「1回のみ処理実行」に使われる「フラグ」の概念や活用シーンについて紹介します。

Shopifyの開発言語Liquidで、ECストア運営に必要な様々なカスタマイズができます。

Liqudiが持つ演算や処理を施す考え方は、他言語が持つそれと大きく違いはないと言われております。

今回は、他プログラミング言語の学習にもよく登場する「フラグ」の概念や活用シーンについて紹介します。

「フラグ(flag)」とは

プログラミングにおける「フラグ」は、もともと旗(flag)のように 特定の状態や条件を示す目印の役割を持つことから名前が来ています。

状態を記録し、処理を分岐する役割を持っており、いわば「記録係」として活用されております。

Shopifyでは、ループ内での「記録係」として主に「1回のみ処理実行」の場合によく使用されます。

「1回のみ実行」とは

「1回のみ実行」とは、ループ内で条件にあう要素があれば「1度だ処理を行う」という意味です。

要素が複数あっても、処理は1回のみ。たとえば、あるユーザーが「事務用品」というコレクションに属する、

・鉛筆
・ボールペン
・ハサミ

を1度に購入したとしましょう。

「事務用品」を購入したユーザーには、「事務用品の場合、受け取りまで3日以上かかる場合があります」という注意書きをしたい場合、ループ内で「その都度」処理をすると、条件と一致する要素が現れるたびに表示されるため、複数回にわたり表示されてしまいます。

フラグの使用により「事務用品」が1個でも、2個以上でも注意書きは1回だけ表示されるのです。

フラグの動きを簡単に説明すると、

・まず「OFF」と記されたフラグを立てる

・ループ内で「事務用品」要素が見つかったよ!→「OFF」フラグを「ON」フラグに変えよう!

・(要素がいくつ見つかっても)「ON」フラグだよね? じゃ、〇〇〇を1回実行しよう!

になります、

少しは分かりやすくなったのでしょうか。

要するに、条件にあう要素の数など気にする必要なく、今のフラグが「ONなの?OFFなの?」が重要です。

サンプルコード

では、実際のサンプルコードを見ていきましょう。

特定のタグを持つ商品

商品タグに「sale」が含まれている場合に、特定のメッセージを表示するサンプルコードです。

{% assign target_tag = 'sale' %}
{% assign has_sale_tag = false %} //まず「OFF」に

{% for tag in product.tags %}
{% if tag == target_tag %}
{% assign has_sale_tag = true %} //見つかったよ!「ON」に
{% endif %}
{% endfor %}

{% if has_sale_tag %} //「ON」の状態だったら
<p>この商品はセール中です!</p>
{% else %} //「OFF」の状態のままだったら
<p>この商品は通常価格です。</p>
{% endif %}

商品が特定のコレクションに属している

商品が特定のコレクションに属しているかを確認し、属していればメッセージを表示するサンプルコードです。

{% assign target_collection = '新商品' %}
{% assign is_in_collection = false %}  

{% for collection in product.collections %} 
{% if collection.title == target_collection %}
{% assign is_in_collection = true %} 
{% endif %}
{% endfor %}

{% if is_in_collection %}
この商品は「{{ target_collection }}」コレクションに含まれています!
{% else %}
この商品は「{{ target_collection }}」コレクションには含まれていません。
{% endif %}

在庫の有無チェック

商品のバリアントに在庫があるかを確認し、在庫がある場合とない場合でメッセージを表示します。

{% assign in_stock = false %}

{% for variant in product.variants %}
{% if variant.inventory_quantity > 0 %}
{% assign in_stock = true %}
{% endif %}
{% endfor %}

{% if in_stock %}
<p>この商品は在庫があります!</p>
{% else %}
<p>この商品は在庫切れです。</p>
{% endif %}

タグを複数チェック

商品のタグがいずれかの特定の値に一致しているか確認し、タグが見つかった場合にメッセージを表示します。

{% assign target_tags = '限定,新作,おすすめ' | split: ',' %}
{% assign has_target_tag = false %}

{% for tag in product.tags %}
{% if target_tags contains tag %}
{% assign has_target_tag = true %}
{% endif %}
{% endfor %}

{% if has_target_tag %}
この商品は限定、新作、またはおすすめ商品です!
{% else %}
この商品は限定、新作、またはおすすめ商品ではありません。
{% endif %}

以上、実際のサンプルコードを4つ紹介しました。フラグの概念を理解するポイントは(繰り返しになりますが)「ルーオ内で条件にあう要素が1つでも、複数でも、フラグがONなのか、OFFなのかで1回のみ実行する」という事です。

ぜひ活用してみてください!

初めまして。運営者ホリと申します。

当ブログは「Shopifyを一緒に悩んで楽しむ仲間」に向けて情報を発信するブログです。

ここで扱うテーマは、構築やカスタマイズにとどまらず、SEOマーケティングやロジスティクスといった運営全般に広がります。

中でも最も重要視するのは、Shopifyを使った構築や運営に携わる中で「大掛かりな開発と投資に頼らなくても目的を達成できる工夫」。

確かな知識と経験を土台にしながら、日々の学びを記事にまとめて、同じように試行錯誤している方々とシェアしています。 日々の実践から得た知見を記事にまとめることで、Shopifyを使う仲間たちの小さなヒントや発想のきっかけになればうれしいです。

「ちょっと聞いてみたい」「これで大丈夫?」といった気軽な相談も大歓迎です。 Shopifyを通じて一緒に試行錯誤しながら、学び合える場として、このサイトを活用していただければ幸いです。

このブログと運営者について

お問い合わせ

BLOG More

設定

1週間前

【Shopify豆知識】テーマレイアウトをカスタマイズしたい?なら「grid-template」を知っておくべき

「スマホではロゴを左側に、PCではロゴを中央に」といった調整も、「grid-template」の設定次第で柔軟に実現できます。..

Liquid

4週間前

【Shopify小技】PC版に左のサイドバーを設置!まず「theme.liquid」の構造を知ろう

もし「type」を設定しなかったり、誤って設定したりしてしまうと、Shopifyはそのセクションをどの領域に表示すべきか判断できません。..

設定

1か月前

【Shopify小技】商品ページごとのFAQをメタオブジェクトで実装してみた

実際には「ピックアップ可能な店舗情報」や「割れやすい商品の配送注意点」など、商品ごとに異なる補足情報‥..

Liquid

1か月前

【Shopify Liquid】テーマで実際使用される「render」の引数と渡り値 その役割を解説

それぞれの変数の意味を押さえておけば、ある程度は読み解くことができると思います。..

アプリ

1か月前

【Shopifyアプリ】シンプル&レスポンシブ!直感的に使えるカレンダー「The Shop Calendar」でイベント・営業日を表示

The Shop Calendarは、カレンダー形式・一覧形式に加え、現在(2025年9月時点)β版としてアコーディオン形式にも対応しています。..

アプリ

2か月前

写真ギャラリーが複数作成できる!Shopify無料アプリ「GA Image Gallery」

ただし、「Advanced Setup」の方は動画を見ても最初はすんなり理解しづらいかもしれません。..

SEO

2か月前

【Shopify豆知識】だからSEOに強いのか!構造化データ(JSON-LD)について解説

しかし実際には、検索結果やGoogleショッピングにおいて、価格や在庫、バリエーション情報を正しく表示するための大事な役割を担っています。..

Liquid

2か月前

【Shopify豆知識】スキーマ設定(JSON)「t:」から始まる文字列とは‥実は変数パスではない?

Shopifyは「"t:"」以下のパスをたどって "label" の値(ここでは「クマさんのお顔」)を取得し、テーマエディタ上で表示します。..

Liquid

3か月前

【Shopify Liquid】スニペットファイルを呼び出す「render」引数と渡り値とは?

この仕組みによって、スニペットは渡されたデータに基づき、表示ロジックに沿って商品画像や商品名、価格などを表示できるようになります。..

制作アイディア

3か月前

Shopify構築をフリーランスへ代行依頼する手順(1~6)と選ぶポイント

私自身の体験としておすすめしたいのが「電話対応ができるフリーランス」を選ぶことです。..

Liquid

3か月前

【Shopify Liquid】オブジェクトの絞り込みに用いる「where」フィルタとは

たとえば、「販売元(vendor)」が「Nintendo」の商品だけを抽出したい場合は、以下のように書きます。..

制作アイディア

3か月前

Shopify構築をフリーランスへ依頼するメリットは費用だけではない!課題点も紹介

その「必死さ」や「ファイティングスピリット」は、柔軟かつ誠実な対応として依頼主にとって大きな安心材料となることも..

制作アイディア

3か月前

【リアルレポート】Shopify構築をフリーランスに依頼する際の相場と費用内訳

ECストアは今や単なる販売ツールではなく、実店舗と同じ、あるいはそれ以上に重要性と存在感を持つものとなっています。..

Js

3か月前

Shopifyにおける「カート追加」の仕組みを理解する!form送信 vs fetch API活用

fetch APIに用いられる「/cart/add.js」は、form送信の「/cart/add」と同様、「仮想的なエンドポイント」になります。..

Js

4か月前

【JavaScript】Shopify「cart.js」を読み解くための「Webコンポーネントメソッド」一覧

商品数や金額といった情報は、HTMLの「data-attribute」を使って要素ごとに管理されており、JavaScript側でそれを読み取って処理‥..

Js

4か月前

Shopifyのカスタマイズに役立つJavaScript「配列メゾット」11選を初心者向けに解説

「2005年新着!夏の水着一覧」という配列があるとします。最安値順に並び替えたいとき、「.sort()」というメソッドを使えば‥..

Js

4か月前

ShopifyではLiquidがあるのになぜJavaScriptが多用されるの?

その理由を一言で言えば、「Liquidは表示前、JavaScriptは表示後に働くから」です。..

Liquid

4か月前

Shopify 関連やおすすめ商品リストが自動生成「recommendations」活用・応用シーン

しかしカートページには、そもそも表示中の商品が存在しないため、このレコメンドの仕組みが機能しないのです。..

Liquid

4か月前

【Shopify Liquid】関連商品・おすすめ商品作成に用いられるオブジェクト「recommendations」について

このオブジェクトは、顧客の行動やストア内でのさまざまなデータを基に、自動的に関連商品を選出します。..

SEO

5か月前

Google、AIモードの導入を発表!収益減少が懸念される中、最も有力なマネタイズとは

このホテル、評価高いし、割引ついてるよ。数ステップで簡単に予約できるけど、今やる?..

SEO

5か月前

AI時代のSEOはオワコン?その真実と「違います」と言える4つの理由

たとえば「近くのコンビニを教えて」といったシンプルな質問に、毎回AIが複雑な推論や自然言語生成をしていたら、とんでもないコストになります。..

設定

5か月前

【Shopify豆知識】ヘッドレス(Headless)ってなに?

少し不気味で怪談を連想させるような響きですが、実際にはShopifyのメリットとして注目されている仕組みのひとつです。..

Liquid

5か月前

【Shopify小技】商品の「カートに追加」の仕組みをシンプルに解説(サンプルコード))

この仕組みにはLiquidだけでなく、JavaScriptやAjax、さらにはサーバー側で動くRubyなど、複数の技術が関わっている..

Liquid

5か月前

カートのノーティフィケーションやドロワーで1注文での同時購入を防ぐ方法は可能?

ノーティフィケーション(画面上部に一瞬表示される通知型カート)については、やや難易度が高めです。..

Liquid

5か月前

【Shopify Liquid】カート内で1つの注文に同時購入を防ぐシンプルな方法

ここで使われているのが、Liquidでよく用いられる「フラグ(真偽)」という考え方です。..

STORY

5か月前

なぜ鳥の巣はあんなに頑丈なのか?成功における「うまくいかない瞬間」の重要性

鳥の巣の初期段階のように、私たちの挑戦も、最初は失敗と不安定の連続です。..

Liquid

5か月前

【Shopify Liquid】商品ページの「オプション」を色か画像にしたい

そもそもShopifyの商品オプションに画像や色を登録できるのか?..

STORY

5か月前

現代言語哲学の巨人が教えてくれた「失敗する人の口癖」とは

あの時もし、あの会社に転職していたら・・..

アプリ

5か月前

【Shopifyアプリ】商品ページから簡単に見積もりを送信!履歴から下書き注文作成も可能

旅行会社、工事や建築、リフォーム業、OEM制作、ノベルティ制作、レンタル業なども十分対応できる‥..

STORY

6か月前

40代・50代にとって新たな挑戦が「苦痛」である理由・・私が救われたニーチェの言葉

苦しみがあるからこそ、深みが生まれる。..