Xポストログ

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

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

  • Shopifyで購入後に送られる「注文の確認」メールにも注文時に指定された配送希望日時を掲載しておきたいというご要望をいただくことがあります。配送希望日時を指定するアプリによって項目名は異なりますが、注文詳細画面に表示される項目名を使って掲載可能です。
    #Shopify

  • Shopifyで特定のパラメータを持ったURLの時だけ表示するセクションの設定例です。SEO影響を抑えるためコンテンツを動的に表示しており、そのため初回表示時のみ直前にリロードが走るなど少し癖のある動きをします。そのような前提条件にご了承を頂けるときに限りですが、実装しています。
    #Shopify

  • Shopifyの管理画面で、購入者宛に送信されたメールを自分自身（管理者）宛にも送れるようになったのはありがたいですね。マーチャント様が、購入者の方からお問い合わせを受けた際に、送信されたメールの中身を確認したいというご要望が多かったので助かります。
    #Shopify

  • Shopifyで購入後に送られる「注文の確認」メールですが、LIQUIDやHTML、CSSを使って内容を編集することができます。例えば、特定のタグを持つ商品が購入された際に、そのタグを持つ商品に関する特定のメッセージを表示させるための設定例です。
    #Shopify

  • Shopifyのアカウント登録画面は、デフォルトではメールアドレスとパスワードだけあれば登録できてしまいます。とはいえ氏名の入力率は低くないので必須にする必要はないかも知れませんが、「どうしても必須にしたい」という場合の設定方法です。
    #Shopify

  • テーマ「Dawn」のブログページには各記事カードに「もっと見る」リンクがありません。とあるストアではヒートマップツールによる分析結果から、ユーザーが記事カードを全くクリックしていない事がありました。そこで明示的にリンクテキストを表示する対策を取りましたが、その設定方法です。
    #Shopify

  • Shopifyのテーマ「Dawn」のフッターに表示されているSNSアイコンですが、TwitterをそろそろXに変えたいという話も出てきています。X公式のSVGを使った設定例です。
    #Shopify

  • ShopifyのLiquidでは基本的に動的に型を解釈して比較を行ってくれるのですが、明示的に型変換した方が良いときがあります。文字列と数字の値比較などですね。
    #Shopify

  • Shopify Flowには在庫が基準値を下回ったら通知してくれる便利なフローがあらかじめテンプレートとして提供されているのですが、商品によっては通知したいタイミングが異なるケースもあります。そこで、少し手を加えてタグで通知基準を指定できるようにしておくと使い勝手が良いです。
    #Shopify

  • ShopifyのテーマエディタでセクションにCSSを設定する際、Chromeのデベロッパーツールを使えばプレビュー画面上でもidやclass名が確認できるので便利ですね。また、指定したcssのセレクターにはそのセクションのid名が自動で付与されるので、他の画面には影響しないので安全です。
    #Shopify

  • Shopifyの商品タイトルとヘッダー<title>タグにバリアント名を表示するための設定例です。バリアントを切り替えると、表示されているタイトルもその場で切り替わります。（文字数の違いによっては表示がガタつくのでタイトル表示部に一定の高さを確保しておくと良いです）
    #Shopify

  • Shopifyで翻訳を進める際、当たり前と言えば当たり前の話なのですが、全ての商品バリアントを翻訳しておかないと、コレクションや検索のフィルターに未翻訳の項目が表示されてしまいます。一気にCSVで翻訳してしまうのが良いですね。
    #Shopify

  • Shopifyでギフト包装などを有料商品として扱う場合、それらだけでは購入できないようにしておきたいところです。そこで対象商品にタグを付けることで、通常商品を伴わない場合はカート画面から先に進めないようにする設定例です。（但し直接チェックアウトURLを指定された場合は防げません）
    #Shopify

  • Shopifyのストアに画像だけのバナーを表示したい時があるのですが、どのテーマにもちょうど良いセクションがありません。従来はカスタムliquidに直接HTMLを書いていたのですが、利用頻度も多いのでテーマDawnでは独自のカスタムセクションを作成するなどしています。
    https://colossal-vanadium-63c.notion.site/Dawn-11-0-0-be2259e2a0f7492aa5c76350eaf05b0c?pvs=4
    #Shopify

  • Shopifyのコード編集画面には検索機能がが付いていますあ、正規表現も使えるのでif文やfor文など見つけやすくて助かります。
    #Shopify

  • Shopifyのコレクション一覧（コレクションリスト）ですが、デフォルトでは名前か日付、商品数のいずれかでソートされてしまいます。コレクションの一覧は任意に並べたいことの方が多いので、コレクションリストセクションを代わりに使うと良いですね。
    #Shopify

  • Shopifyの商品handleを一括で変更したい場合、商品管理画面のエクスポート・インポート機能を使うと商品を新たに登録しなおすことになるのですが、Matrixifyを使えば同じ商品情報のhandleを直接更新することができるので便利ですね。
    #Shopify

  • Shopifyでコレクションページのフィルターにタグを使うケースがあるかと思いますが、多言語対応する際デフォルト言語以外では非表示になる仕様とのことで気をつけたいですね。代わりにメタフィールドの使用が推奨されています。
    #Shopify

  • Shopifyのテーマ「Dawn」のブログ記事セクションで、サムネイルとタイトルだけ表示したいというケースがあります。そこで「ブログ記事の抜粋」部分を表示・非表示変更できるようにするための設定例です。
    #Shopify

  • 多くのマーチャント様への支援を通じて得た知見から、グロースに必要なデータを一元管理できる機能をサービスに追加しました。
    様々な指標がすぐに見れて、スピーディーに打ち手に繋げることができるようになります。（支援している我々が本気で使いたい＆必要としている機能だったりします）
    #Shopify