Xポストログ

2023年5月8日

Shopifyの標準機能では商品の公開日を即時公開もしくはスケジュール指定した日時のみ設定でき、過去の日付に変更する事はできません。前回紹介した新着アイコン表示機能を有効活用するには公開日を任意で指定したい所ですが、そんな時はMatrixifyがオススメです。
https://x.com/sh_sakamoto/status/1655088807207907328
#Shopify

スレッド

すいません。画像の赤枠の位置がズレてました。再アップします。
ちなみに、Matrixifyの良いところは、標準のCSVと異なり、商品またはバリアントIDをキーにして編集したいカラムだけを差分更新できるところですね。先祖返りなどデータ破損を引き起こさなくてすみます。

2023年5月7日

Shopifyの商品一覧に「新着」アイコンを表示させたい場合、「商品タグ」を使って管理する事が多いのですが、取扱点数が多いストアでは商品の公開日を使って自動で制御するケースもあります。その際、直接コードにロジックを書いても良いのですが、テーマ設定で管理する場合の設定例です。
#Shopify

2023年5月6日

Shopifyのテーマ「Dawn」のカート画面にある「買い物を続ける」ボタンのリンク先ですが、デフォルトでは商品一覧に固定されています。一度指定してまえばほぼ変更する事も無いので直接Liquidを編集して良いのですが、テーマエディタを利用して簡単に変更できるようにした場合の設定例です。
#Shopify

2023年5月5日

Shopifyのテーマ「Dawn」は「ページ」そのものをページ内セクションとして表示させることができます。そこで、フッターに設置されることが多いFAQをカートページにも組み込んでおくことで、購入前のユーザーの疑問や不安を取り除いて決済手続きへと促す効果が期待できます。
#Shopify

2023年5月4日

Liquidに関するマニアックな話を一つ。Shopifyのテーマを編集していると、liquidコードのデリミタが{% %}と{%- -%}のどちらでも動くことに気づくかと思います。両者の違いはコードの前後の空白を削除するかどうか、にあります。
Shopify

2023年5月3日

Shopifyの会員登録とログインフォームは、通常submitした後はマイページに遷移するだけですが、それぞれ任意の遷移先に変更することができます。
フォームタグの直後にhidden項目で遷移先のURLを指定するだけで実装できます。新規会員登録直後の案内ページを充実しておくのも良いですね。
#Shopify

2023年5月2日

Shopifyのテーマでヘッダーやフッターにセクションが追加できるようになりましたが、「ページのトップに戻る」ボタンを追加するのも良いですね。（チャットやメルマガフォームなど、他にもモーダルが表示される場合は、位置設定に気をつける必要があります）
#Shopify

2023年5月1日

Shopifyのメタフィールドを使って、ブログ記事にページ内リンクを設置する方法です。
HTML編集モードで本文中に直接コードを書いても良いのですが、レイアウトが崩れたりなど何気に運用負荷が高いので、別手順化しておくと更新が楽です。（コードサンプル付）
#Shopify
https://colossal-vanadium-63c.notion.site/Dawn-9a5600e6fee04af586d3e6ba0007d39e

スレッド

スマホだとnotionの内容が見づらかったので、先ほどの投稿にはり忘れていた画像をこちらにアップしておきます。

2023年4月30日

ShopifyのテーマはPCとスマホの両方に最適化されています。ただ、スマホ用の画面ではタイトルや画像の位置を入れ替えたいというリクエストは結構頂きます。通常弊社では他のテーマで対応していますが、デフォルトでは画像位置を変更できないDawnの場合、このような実装方法が考えられます。
#Shopify

2023年4月29日

Shopifyのテーマ「Dawn」に標準で実装されているお問合せフォームですが、少し手を加えて顧客UXを向上させるのもオススメです。
送信前に確認メッセージを表示し、送信完了後に別ページで受付完了の案内を行うことで、顧客に対して適切な対応が行われていることを印象付けることができます。
#Shopify

2023年4月28日

前回の「メニューからパンくずリストを作成する方法」とは別に、コレクションメタフィールドを使った設定例です。こちらは、ある程度の規模を持ち、事前に商品カテゴリの階層構造設計をしっかりと行ったストアで有効な方法です。
#Shopify
https://x.com/sh_sakamoto/status/1651513521950314496

2023年4月27日

Shopifyのメインメニューから自動でパンくずリストを生成するコード例です。メニューに設定されたページ限定で生成するだけなので本格的なSEO対策には向きませんが、自動で階層構造を読み取って生成するので使い勝手は良いです。（コードの解説文はGPT4。ちゃんと読み取ってくれますね）
#Shopify

2023年4月26日

前回のtweetに関連して、Shopifyのテーマ「Dawn」のブログ一覧画面にタグの絞り込み機能（タグメニュー）を表示する設定例です。ブログ記事同様、表示させたくないタグの除外指定もできます。（ブログ記事とブログ一覧、それぞれのテンプレートで設定が必要です）
#Shopify
https://x.com/sh_sakamoto/status/1650780733412343811

2023年4月25日

Shopifyのテーマ「Dawn」のブログにはタグの絞り込み機能がついていません。そこで、ブログ記事にリンク付きのタグリストを表示する設定例です。表示させたくないタグの除外指定もできます。
これを応用して、次回はブログ記事一覧（トップ含む）にタグメニューを表示する方法の紹介です。
#Shopify

2023年4月24日

Shopifyの商品ページにお問い合わせフォーム導線を設置しておき、そこを経由した際は問い合わせ項目に商品情報を自動で入力しておく方法です。
最近はチャット導線がホットですが、購入意欲が高いもののお時間が無い、もしくはチャットが苦手な顧客に対して有効な窓口として活用できます。
#Shopify

申し訳ありません。紹介したコードの訂正になります。
①問い合わせ対象商品を切り替えてフォームに遷移した際に商品名が切り替わらないバグを修正
②バリエーションピッカーがドロップダウンの時の取得方法を変更
動作検証不足で失礼しました。改めて公開前のテストをしっかり行います。

2023年4月23日

Shopifyのコレクションページに商品タグを表示したくなるケースも結構あります。使用するテーマによって設定方法は様々なのですが、こちらは「Dawn」を使った設定例です。アプリが自動でタグ付けすることがあるので、表示対象除外設定も合わせて実装しておくことをオススメしています。
#Shopify

2023年4月22日

Shopifyの登録フォームは要素を追加すれば独自の顧客タグを設定できます。これを応用して、例えば店舗や同封物にパラメータを含んだURLのQRコードを設置するなどして登録経由をタグ付けすることが可能です。その設定例です。登録完了メールでタグ判別して店舗別クーポン配布など出来ますね。#Shopify

2023年4月21日

Shopifyで特定の商品をコレクションや検索結果ページに表示させたくない場合があります。その際は検索エンジンからも見えない方が良いので、その両方に対応した設定方法です。（といいつつ、高度な閲覧制御を行いたい時はLocksmithアプリがオススメです）
#Shopify
https://apps.shopify.com/locksmith?locale=ja

スレッド

公式にて、より簡単な実装方法が提供されておりました。調査不足で失礼いたしました。
https://shopify.dev/docs/apps/marketing/seo#step-2-hide-a-resource-from-search-engines-and-sitemaps
メタフィールド「seo.hidden」を作成し対象の商品やブログ記事に値を設定するだけで、サイト内検索からは除外され、ページにはnoindexタグが付与、sitemap.xmlからも削除されます。