Xポストログ

Xで投稿したShopify関連の内容をそのまま記録しています。

  • Shopifyで、タグで指定された特定の商品についてはログイン(会員登録)されていない場合に「カートに追加できない」ようにするための設定例です。テーマエディタから簡易的に編集できるようにしていますが、main-cart.liquidに直接コードを埋め込んでも構いません。
    #Shopify


    スレッド

    内容の訂正になります。「main-cart.liquidに...」と記載してしまいましたが、「main-product.liquidに...」の誤りです。

    Xで見る
  • Shopifyのテーマ「Dawn」で商品の在庫状況を表示できる「在庫ステータス」ですが、商品ごとに表示内容を変えたい場合があります。ブロック設定ごとにテンプレートを作成しても良いのですが、殆ど差のないテンプレートを増やすのは得策ではないので、タグで制御できるようにした設定例です。
    #Shopify

    Xで見る
  • 弊社では自社サービス「StoreHero」を使って(一般的にはストア分析レポートやGA4から)分析できる注文情報の流入元データですが、cart attributesを使ってリファラやパラメータを注文情報に付与することで(簡易的ですが)注文情報画面で確認できるようになります。その設定例です。
    #Shopify

    Xで見る
  • StoreHeroがGoogle Analytics,Google広告、Meta広告とも連携できるようになりました!

    Xで見る
  • Shopifyのカート画面でギフトラッピング商品を案内しつつ、ギフト商品が追加されたらメッセージを非表示にするための簡単な設定例です。
    #Shopify

    Xで見る
  • Shopifyのテーマ「Dawn」の商品一覧画面で、異なる価格のバリエーションを持つ商品は「¥○,○○○から」と表示されますが、上限の価格も一緒に表示するための設定例です。商品価格を格納する変数の値に上限価格を追記する形で対応しています。
    #Shopify

    Xで見る
  • Shopifyのブログで月別アーカイブを実装する設定例です。Shopifyの仕様上、自動で日付からアーカイブリンクを生成することができないため、個々の記事にタグ付けすることで代用していますがそれっぽい感じにはなります。記事の追加・削除に連動して、リンクも自動で表示・非表示されます。
    #Shopify

    Xで見る
  • GA(UA)では確認できた「サイト内検索の0件ヒットワード」ですが、GA4になってからは標準のイベント設定のままでは把握が困難になってしまいました。そこでShopifyでカスタムイベントによって0件ヒットワードを計測できるようにする為の設定例です。
    https://x.com/sh_sakamoto/status/1582659086361190401
    #Shopify #GA4

    Xで見る
  • Shopifyで、ログインユーザーに専用のメニューを表示したいという相談をいただく事があります。テーマエディタから会員専用メニューを指定できるようにし、ログイン状態に応じて表示を切り分けるための設定例です。これはDawnでの実装方法ですが、他のテーマにももちろん応用可能です。
    #Shopify

    Xで見る
  • Shopifyの {{ order.note }} タグを使えば、マイページの注文詳細にも注文メモの内容を表示させる事ができます。テーマ「Dawn」での設定例です。
    #Shopify

    Xで見る
  • Shopifyには「Xを購入するとYをプレゼント」というクーポンがありますが、対象商品を顧客がカートに入れる必要があるため可能であれば自動で追加してあげたいところです。優良なアプリが色々ありますので基本的にはそちらをオススメしますが、Flowを使って購入後に付与することもできます。
    #Shopify

    Xで見る
  • Shopifyの購入完了後の画面で、特定のタグを持った商品が購入されていた場合に注意事項枠などを表示させる設定例です。(line_items.productで購入された商品情報を取得できるので、タグ以外に特定のhandleなどでも指定可能です)
    #Shopify

    Xで見る
  • Shopifyのブログでは、記事にタグを付けておけばそのタグを持った記事だけの一覧を作ることができますが、URLの「/tagged/」以降に記載するタグを「+」で繋ぐことで、複数のタグを持った記事に絞り込むことができます。
    #Shopify

    Xで見る
  • Shopifyのテーマでは長めのロジックは {% liquid 〜 %} タグにまとめて書いたりしますが、コード作成中は処理状況を確認するため変数の値を出力したい時があります。その際、{% liquid 〜 %}内では {{ }}タグを使えないので代わりにechoを使います。
    #Shopify

    Xで見る
  • Shopifyの注文確認メールに掲載されているお客様情報(配送先・請求先住所)ですが、デフォルトでは氏名の部分が呼び捨て表記になってしまっています。「様」などの呼称を付けたい場合はコードを編集して対応する必要がありますがその設定例です。
    #Shopify

    Xで見る
  • Shopifyの商品一覧に絞り込み機能を追加してくれる公式アプリ Search & Discovery ですが、今年の1月にグルーピング機能がリリースされています。細かいサイズ群なども任意の範囲に切り分けてフィルタリングできるようになるので便利ですね。
    #Shopify

    Xで見る
  • Shopifyのメニューで英語と日本語を併記したい場合に、区切り文字で入力しておいてsplitで分解して展開する方法が紹介されていました。新規項目の追加や編集もしやすいので便利ですね。
    https://community.shopify.com/c/%E6%8A%80%E8%A1%93%E7%9A%84%E3%81%AAq-a/%E3%82%B0%E3%83%AD%E3%83%BC%E3%83%90%E3%83%AB%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%81%AE%E8%A1%A8%E8%A8%98%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/td-p/1283105#threadeddetaildisplaymessageviewwrapper_5
    #Shopify

    Xで見る
  • Shopifyのテーマ「Dawn」では商品にバリエーション画像を設定している場合、商品詳細画面では最初からメイン画像がそちらに切り替わった状態で表示されます。それでは少し不都合な時があるので、バリエーション画像を設定しつつもメイン画像を最初に表示させる設定例です。
    #Shopify

    Xで見る
  • Shopifyのテーマ「Dawn」で、商品詳細や商品一覧の在庫切れ商品に表示される「売り切れ(テーマのコンテンツ編集から変更可能)」の文字ですが、これを商品ごとに任意の内容に変更するための設定例です。定期的に在庫が補充される商品についてラベルを設定しておくなどの使い方になります。
    #Shopify

    Xで見る
  • Shopifyのアカウントページと同様に、お問い合わせフォームについてもメールアドレスの間違いは防ぎたいところです。実際、アドレス間違いで返信が届かないということが発生しています。そこで確認用のフォームを設置して入力間違いを防ぐための設定例です。
    https://x.com/sh_sakamoto/status/1710142842159431979
    #Shopify

    Xで見る