Xポストログ

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

2023年12月の投稿 絞り込みを解除

  • Shopifyのテーマ「Dawn」には他のテーマで見かけるような商品画像の読み込み中に表示されるLoading処理が付いていません。そこで、Javascriptによってcssアニメーションによるloaderを動的に追加するための設定例です。（DOMの指定方法が異なるためテーマ「Dawn」でのみ使用可能です）
    #Shopify

  • Shopifyで「お客様アカウント」を有効化するとヘッダーにアカウントアイコンが表示されるようになりますが、このアカウントをログイン状態の有無に応じて切り替える方法です。アイコンを表示するスニペットファイルの中で、ログイン判定するコードを使って実装できます。
    #Shopify

  • ShopifyのアプリMatrixifyのスケジュール機能を使えば、簡単にタイムセールを実行することもできます。商品の価格などを一時的に変更するCSVと元に戻すCSVの２つを用意しておき、それぞれスケジュールを設定しておくだけです。それなりの数の商品を一括で処理したいときなど重宝します。
    #Shopify

  • Shopifyのテーマ「Dawn」の検索ボックスにPC版Amazonのような、カテゴリの絞り込み機能を持たせる設定例です。コレクションページに設定できる絞り込みフィルターを使うことで、指定範囲内でのキーワード検索が実行できるようになります。
    #Shopify

  • Shopifyのコレクション絞り込みフィルターは全てのページで共通です。掲載商品に該当項目がなければ自動でその項目は非表示になるので十分便利なのですが、それでもコレクションごとに特定のフィルターを敢えて非表示にしたいことがあります。メタフィールドを使った設定方法の実装例です。
    #Shopify

  • Shopifyのコレクションページは、絞り込みフィルターパラメータがついていても基本的にはcanonicalでパラメータ無しURLに正規化されてしまいます。パンくずやメニューにパラメータ付きページを指定する場合、検索エンジンにindexされるようにするには少し工夫が必要です。その設定例です。
    #Shopify

  • Shopifyで、商品を事前公開しつつ特定の日時になったら購入可能にするには専用アプリやメタフィールドを使うなどいくつか手段がありますが、Matrixifyのスケジュール機能を使って商品情報を直接更新するという方法もあります。その設定例です。
    #Shopify

  • Shopifyのテーマ「Dawn」のコレクションページでは、全てのバリアントが売り切れている時に「売り切れ」と表示されますが、いくつかのバリアントが在庫切れになってしまっている場合にも「一部売り切れ」として表示したいときがあります。その設定例です。
    #Shopify

  • Shopifyのカート画面で購入時アンケートを取れるようにした後は、その内容をメールで通知したりスプレッドシートに自動集計することで運用時の利便性を高めることができます。その設定例です。
    https://x.com/sh_sakamoto/status/1730798450877579268
    #Shopify

  • Shopifyのカート画面に設置するアンケートセクションです。注文詳細で回答内容を確認できます。（内容が内容なのでコード量が結構あります。すいません）
    ちなみにStoreHeroにはさらに高機能なアンケートアプリがありまして、より高度なアンケートを実施可能です。別途ご相談お待ちしてます。 #Shopify

  • メルカリの「¥マークを小さくしたら購入率が大きく改善された」施策が注目されましたが、Shopifyで実際に通貨シンボルを価格と異なるサイズで表記したい場合の設定例です。価格は通常シンボルとセットで出力されるので、replaceを使って置き換えています。
    https://markelabo.com/n/ne9bed1488bda
    #Shopify

    スレッド

    画像に誤字がありました。失礼しました。「通過」→「通貨」です。