まりん@Shopify専門エンジニア🇦🇺

Shopify構築&制作 | 2020年〜🇯🇵 | 実績:ファッション系、日用品、食べ物屋さんなど| HTML/CSS/JavaScript/liquid |

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#Shopify をコピペで簡単にカスタマイズ

📌コーディング100本ノック
https://t.co/GEcXPgONMy
📌定期便：コーディング100本ノックの続き
https://t.co/MNCSf0YFah
📌LPテンプレ
https://t.co/NwdHtBcgJz
📌ブログテンプレ
https://t.co/uAJhMRsv9g
📌スプレッドシート連携
https://t.co/F4yWXJTcfF

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify]
商品詳細でサイズバリエーションを縦リスト表示＆行ごとにカート追加ボタンを表示する方法についてまとめました！
在庫有り無しが一目でわかるので便利

https://t.co/FCp7USgxND

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify] 商品ごとの注意事項・配送条件をMetaobjectで一元管理してLiquidで自動表示する方法 #164｜まりん | Shopifyフロントエンジニア+SNSマーケティング @crowd37cord https://t.co/fqaxW0cXZT

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify AI Toolkit]
メタフィールド定義が大量にあると
定義作成が大変。

CSVから一気に定義を作成してくれる
shopify向けのclaude codeのスキルで
秒で完了した話。

あくまで定義作成なので
メタフィールドの値を挿入するものではありません。

👇続きはこちら
https://t.co/mDFk7auNBV

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify]
404 URLをメタオブジェクトで管理して
自動リダイレクトする機能

/products/old-handle にアクセス → 404 → 一瞬で /collections/all などへ遷移

設定は 設定 > カスタムデータ > メタオブジェクト で一覧管理

https://t.co/TxgHp5wXoo

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify]404 URLをメタオブジェクトで管理して自動リダイレクトする機能

メタオブジェクトのエントリーで
・リダイレクト元
・リダイレクト先

を追加するだけ。
非公開にした商品・ページ・記事ページなどで
自動的に任意のページにリダイレクトさせたい時に使える。

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

設置手順

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

メタオブジェクトの設定手順

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify AI Toolkit]
カゴ落ち顧客を取得し、対象顧客限定の共有割引コードを1つ発行・タグ付与・リカバリーリンク出力を一括実行するスキル

Claude Code x Shopify

https://t.co/G6zVizANvQ

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

【Shopify自動化 #001】
40rtyスキルにカゴ落ち顧客用のを見つけたので実行してみた。

・過去7日間のカゴ落ちを自動取得
・対象者ごとに10%オフのユニーク割引コードを自動発行
・該当顧客にタグも自動付与

2件ヒットして無事処理完了✅

https://t.co/mRUomCyIMx

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

[Shopify x AI]
Claude Code
+ Shopify AI Toolkit
+ 40RTY-ai
の環境構築までのまとめ

「在庫監査をして、低在庫商品をリストアップして。優先度が高いものを教えて」

って聞いてターミナルで取得してきたので
そのままパワポにしてもらった

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#Shopifyコーディング100本ノック
カート内の「サイズ間違い重複」を検知して返品を減らすアラート機能
の追加手順をこちらにまとめました。

これでサイズ違いの返品作業が
少しでも減らせられたら嬉しい。

https://t.co/deQMDXC4h8

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

設置手順は３ステップ
・新規スニペット追加
・theme.liquidにスニペットを挿入
・settings_schema.jsonに設定機能追加

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#shopifyコーディング100本ノック
「サイズの買い間違い」を防ぐカスタム機能をliquidに追加してみました。
カート内に同じ商品の別サイズが入っている状態で、さらに追加しようとすると確認アラートが出る仕組みです⚠️ （Mサイズが入っているのに、間違えてSを追加しそうになった時など）

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

設定から
・アラート機能ON/OFF
・比較対象箇所選択（商品タイプ・ベンダー・カテゴリ）
・アラートメッセージ内容編集
を設定できるようにしてみました。

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

コピペコードはこちら
https://t.co/xdZWxGsiJ1

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#shopifyコーディング100本ノック
お知らせがループする告知バー
リンクなしでテキストのみ

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

テーマ編集から
「流れるお知らせバー」を挿入するだけ

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

設置方法
❶新規セクション追加
❷コードコピペ

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#Shopifyコーディング100本ノック
カラーバリエーションのピッカーを
画像にする方法。

https://t.co/xoaBkzuCJ3

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

Shopifyセクションテンプレ

✨特徴
・TikTok風9:16動画ギャラリー
・商品カード表示
・ワンクリックでカート追加
・GA4トラッキング対応

コピペするだけで設置完了！

▼テンプレート
https://t.co/9YfScfW39U

[まりん@Shopify専門エンジニア🇦🇺 @crowd37cord]

#shopifyコーディング100本ノック
ショート動画のギャラリーで
商品詳細を紐付けできるセクション。
紐づけた商品の詳細やカート追加ができる♪
UGC動画と組み合わせると効果抜群！