Xポストログ

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

  • Shopifyで顧客が使用したクーポンを顧客タグとして記録しておくための設定例です。「レポート」からクーポンごとの利用者を確認することができますが、顧客情報に直接記録しておくことですぐに確認することができます。
    #Shopify

  • Shopifyの注文完了画面の「お問い合わせリンク」をメールから別のページへのリンクに変更することが可能です。フォームやサポートチャットにしておくと良いですね。
    #Shopify

  • Shopifyの注文詳細画面の商品ごとに「再注文」ボタンを表示する設定例の派生で、注文商品をまとめてもう一度購入できるボタンの設定例です。一度に複数の商品を購入する頻度が高い商材の場合に有用です。
    https://x.com/sh_sakamoto/status/1770299350465585449
    #Shopify

    スレッド

    こちらのコードにバグがありました。変更点はこちらになります。

  • Shopifyの「Dawn」テーマのヘッダー告知バーに「あといくらで送料無料」を表示するための設定例です。テーマエディタの告知バー設定で判定金額が設定できます。また、カートの商品情報をリアルタイムで検知して表示情報が切り替わります。
    #Shopify

  • Shopifyの注文完了画面は以前はURLさえ知っていれば誰にでも内容が表示されていたのですが、先日のアップデートからメールアドレスと注文番号で本人確認が入るようになりました。（管理画面から表示するときも必要）
    https://changelog.shopify.com/posts/new-login-requirements-for-the-order-status-page
    #Shopify

  • Shopifyで特定の商品購入者の方だけが使えるクーポンの設定例です。指定の顧客タグを持ったセグメントだけが使用できるクーポンを作成し、Flowを使って配送完了時に自動で顧客タグが付与されるようにしています。

  • Shopifyの商品詳細ページで、バリアントメタフィールドを使って商品バリエーションごとに掲載情報を切り替えたい場合がありますが、javascriptとliquidを組み合わせた設定例です。
    #Shopify

  • Shopifyテーマカスタマイズの三種の神器として紹介されているLine Item Propertyですが、専用のジェネレーターで生成したコードがそのまま使えない時があります。その対応方法です。
    https://ui-elements-generator.myshopify.com/pages/line-item-property
    #Shopify

  • Shopifyで特定の商品が購入された際に、その対象商品の購入点数と同じ数分だけ商品を追加する処理をFlowで実装する場合の設定例です。商品追加アクションのQuantitiyに設定するliquidは空白を挟むとエラーになるのでコードを連続で記述する必要があります。
    #Shopify

  • Shopifyの商品詳細にデフォルトで表示されている「関連商品」セクションですが、ショッパー（紙袋）などレコメンドしたくない商品も掲載されてしまうことがあります。対象の商品をまとめて除外対象に指定できるようにする設定例です。
    #Shopify

  • Shopifyの注文詳細画面で、購入商品ごとに商品画像のサムネイルを表示する設定例です。現在は販売を終了してしまっている商品の画像も表示されます。
    #Shopify

  • Shopifyの注文詳細画面の商品ごとに「再注文」ボタンを表示する設定例です。商品詳細画面に遷移しなくても直接カートに追加できるようになるので、購入頻度の高い商材を扱っているストアほど利便性を高めることができます。
    #Shopify https://x.com/sh_sakamoto/status/1770299350465585449/photo/1

    スレッド

    Xの予約投稿にバグが発生しているようでして二重に投稿してしまったのでこちらのみにします。

    Xの予約投稿バグのためか画像が消えてしまっていたのでアップしなおします。

  • Shopifyの商品情報は管理画面で公開予定日を設定して所定の日時になったら表示することができますが、取り下げの日時を設定することはできません。そんな時はMatrixifyを使って商品を下書き状態にする日時をスケジュール設定しておくと簡単に設定できて良いですね。
    #Shopify

  • Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューのメニューリスト前後に任意のHTMLを表示できるようにするにあたって、ブロック要素としてより管理しやすくした場合の設定例です。
    https://x.com/sh_sakamoto/status/1769212064239943731
    #Shopify

  • Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューで、メニューリストの前後に任意のHTMLを表示できるようにした際の具体的な表示内容の設定例です。ログインボタンやサブメニューなどが一般的ですね。
    https://x.com/sh_sakamoto/status/1768849676579582321
    #Shopify

  • Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューですが、メニューリスト下のスペースに何かしら表示しようと思っても追加可能なブロック要素などがありません。そこで、カスタマイズされたLiquidセクションとJavascriptを使って任意のHTMLを表示するための設定例です。
    #Shopify

  • Shopifyのテーマ「Dawn」のコレクションページから商品詳細ページに移動した際、その表示順に合わせて前後の商品リンクを設置する設定例です。都度コレクションに戻らなくても連続して閲覧してもらうことができます。
    #Shopify

  • 限定的なケースの話ですが、Shopifyのテーマ「Dawn」のフッターセクションは５ブロック目から改行されます。その際に２行目を均等配置ではなく左揃えにしたい場合の設定例です。各セクションごとにカスタムCSSで調整できるので助かりますね。
    #Shopify

  • Shopifyのテーマ「Dawn」で、カート画面の「ご購入手続きへ」ボタンの前に「よくある質問」のリストを表示したい場合の設定例です。しっかりと購入を促せるように、購入直前の迷いを解消できるような内容を掲載すると良いですね。
    #Shopify

  • Shopifyのテーマ「Dawn」でヘッダーを固定表示する場合、メニューやロゴ、カートなどが含まれる部分だけが固定されます。とはいえ可能であれば告知バーも常に表示されるようにしたいところです。直接コード編集せず、テーマエディタでJavaScriptを使った簡易な設定方法です。
    #Shopify