マガジンのカバー画像

Shopifyコーディング100本ノック（Dawn）続編

人気のShopifyコーディング100本ノックシリーズの続編。現在の100本ノックマガジンで100本記事投稿した後はこちらで更新していきます。「Shopifyコーディング100本…
【月２回程度更新】1記事ずつよりも定期購読の方がお得。「Shopifyコーディング100本ノック（…
¥1,200 / 月 初月無料
運営しているクリエイター
まりん | Shopifyフロントエンジニア+SNSマーケティング

#IT

[Shopify]コピペで5分・簡単設置！ヘッダーメニューを会員用とゲスト用で切り替える #137

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 ヘッダーのメニューをログイン中とログイン前で表示しているメニューリストを出し分け♪数行を差し替えるだけなので簡単。１セクションファイルと３スニペットファイルを編集します。 すべてのフルバージョンのコードは最後に載せておきます。 ✔️今回のテンプレート 🔸cmsの特徴 ✔️設定手順💡Step1　会員用メニューを作成 💡Step2　既存のヘッダーファイルに追記 ❶管理画面＞テーマ＞コ

¥1,200
まりん | Shopi…

【GAS】Shopifyメタフィールドのデータをスプレッドシートにバックアップ（記事編）・テンプレートあり＃26 (Shopify API + GoogleAppsScript)

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 メタフィールドのデータのバックアップをスプレッドシートに落としてみました。前回商品をご紹介したので今日は記事編です🎵 ✔️今回のゴール ✔️設置手順◆事前準備 🔸ShopifyAPIキー取得 下記のStep3までは作成しておく必要あり。 🔸アクセススコープ 🔸スプレッドシート用意 ❶シート名指定 ❷セル「B１」にサイトのURLを貼り付け。

¥1,200
まりん | Shopi…

【GAS】新規顧客とリピーターの割合を分析できるスプレッドシートのテンプレート。ShopifyフローのHTTPを使ってデータを取得・Googleスライドを自動的に作成する機能付き♪ ＃32 (Shopify API)

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 注文情報から新規顧客とリピーターの割合を分析できるスプレッドシートのテンプレートを作成してみました。ショッピファイフローを使って注文作成をトリガーにHTTPでスプレッドシートにデータを格納し、集計シートで各種集計とグラフを作成。 さらに、そのデータをGoogleスライドを自動的に作成してレポートを書き出せるようにしてみました♪スライドはシンプルなレイアウトなので、ご自身で分析内容などを追加

¥1,500
まりん | Shopi…

[Shopify]コピペで5分・簡単設置！メタオブジェクトで簡単にサイズ表を設置♪タブ切り替えができるセクションテンプレート #136

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 サイズ表を簡単に設置できるセクションを作ってみました。今回はメタオブジェクトに登録しているサイズ表を表示するセクション。エントリーが複数あればタブで表示されます♪ サイズ表は画像で設定するタイプです。サイズ表は別で作成して画像を入れてください＾＾ ✔️今回のテンプレート 🔸CMSの特徴 １ページ1回まで追加できます。 ✔️設定手順 📌Step1　メタオブジェクト ❶設定＞カスタ

¥1,200
まりん | Shopi…

[Shopify]コピペで5分・簡単設置！メタオブジェクト完全連携で商品ランキング♪タブ切り替えができるセクションテンプレート #136

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 メタオブジェクトを使ってランキングのセクションを作ってみました。タブ切り替えで複数のランキングが作成できます。完全にメタオブジェクトとの連携でのみ使用できます。ランキングで表示したい商品をマニュアルで指定するテンプレートです。 ちなみに余談ですが、メタオブジェクトでWeb公開にしておいてiframeを使ってテンプレート作成したものをブログ記事やページ、商品本文内に埋め込めるので便利です＾＾

¥1,200
まりん | Shopi…

[Shopify]メルマガ登録のポップアップが簡単に挿入できるセクションテンプレート・３つのレイアウトが選べる #134

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今回はメルマガ登録のセクションをポップアップで表示させられるセクションを作成しました。セクションにしたのでお好みのページに入れればページ指定で表示されます。 TOPページに追加したらトップのみに表示されるし、ブログに追加するとブログページで表示されます。 ✔️今回のテンプレートスマホではすべてのレイアウトで画像なしになります。 🔸CMSの特徴 🐝レイアウト１ 🐝レイアウト2 🐝レ

¥2,980
まりん | Shopi…

[Shopify]5分で簡単設置！ランディングページ◆テンプレート9

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 LINEの顧客リスト取得用のテンプレートのご紹介🎶 画像を当てるだけのシンプルな構成です。 FB広告で反応見ながらすぐに自分で組み替えたり画像差し替えたりしてカスタマイズできるので便利。 ✔️今回のテンプレート ＝＝＝＝＝ パソコン ＝＝＝＝＝ ＝＝＝＝＝ スマホ ＝＝＝＝＝ テンプレートを選択するのを忘れずに 🔸カスタマイズの特徴 ＝＝＝＝ 共通設定 ＝＝＝＝ ＝＝＝＝ ブ

¥3,800
まりん | Shopi…

[Shopify]広告バーをトップページのみに表示する・セクションテンプレート（Dawn） #131

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 広告バーをトップページのみに表示させられるセクションテンプレートです。レイアウトは既存のDawnを使用しています＾＾ 今回はシンプルなカスタマイズ🎶タグ２箇所埋め込むだけなので簡単。 ✔️今回のゴール今回はデフォルト機能を使っているのでカスタマイズ画面の変更はありません。 今回はif文入れるだけなのでフルバージョンコードなしでも該当箇所に入れればOK。もしフルバージョンのコード使用する

¥800
まりん | Shopi…

[Shopify]ヘッダーのログインアイコンをレイアウトに合わせて８種類から選べる・セクションテンプレート #130

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 ヘッダーのアカウントアイコンを色々選べるセクション。デフォルトのアイコンを変えてみたい場合に使用してみてね＾＾ ✔️今回のゴール 🔸CMSの特徴 ✔️設定手順📌Step1 　スニペットを新規作成 1️⃣管理画面＞テーマ＞コード編集＞スニペット＞新規作成

¥800
まりん | Shopi…

[Shopify]ログイン後に直前に見ていたページに遷移させる（既存ファイルカスタマイズ） #128

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 デフォルト機能だと、ログイン直後にTOPに戻ってしまうので、直後に見ていたページに遷移させたいと思います。 ✔️今回のゴールシンプルに下記の動作にしたい。 例えば、カートでゲスト注文できない場合に、カート上でログイン画面へ促されてログインした後にカート画面に戻ってくる！というような感じの動きになります。 ✔️設定手順Step1 既存のmain-loginファイルを開く 管理画面＞テー

¥1,000
まりん | Shopi…

[Shopify]ブログ記事のテンプレート第５弾♪

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 Shopifyのブログ記事のテンプレート第５弾です。 今回はシンプルにツールバーのみをアレンジ。 カスタマイズ画面でカラーを調整できるのでサイトのトーンに合わせて使ってください＾＾テーブルもスマホだとスクロールできるようにしてみました。その他のサムネ画像や本文内の画像などのレイアウトは既存機能のままです。 ✔️今回のテンプレートデモページ 下記のツール対象です。 💡テーブルは横に広げ

¥3,800
まりん | Shopi…

[ShopifyFlow]フロー使って注文があったら自動で「発送済」にステータスを変更してみる　#002

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今日は注文作成されたら配送のステータスを自動的に「発送完了」にするフローを作成してみます。 Shopifyのデフォルトの設定では注文が入ったら自動的にフルフィルメントを完了に変更できる設定はなかったので作成してみました＾＾私はShopifyでデジタルコンテンツを販売しているので、商品を送ることがないため発送ステータスは自動的に完了にするのに使ってます。 フローのおかげで、毎回、管理画面で

¥800
まりん | Shopi…

[ShopifyFlow]フロー使ってスプレッドシートと連携して注文されたら日付・合計・送料・税を表示されるフローを作成してみる　#001

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今日はフローを使ってスプレッドシートと連携させてみます。オーダーが通ったら日付、合計、合計から送料とTax引いた金額、送料、税金が保存されるようにしてみました。 シンプルな項目で作ったので5分もかからずできます。ぜひ、応用してみてください＾＾ ✔️今日のゴールこんな感じで注文されたらスプレッドシートに2行目からデータが格納されていきます🎵 ✔️設置手順Step1 　スプレッドシートを用

¥500
まりん | Shopi…

[Shopify]対象商品購入者のみダウンロードできる特典配布セクション・メタオブジェクト＆メタフィールド連携 #122

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 前回はログインユーザー全員に向けた特典ダウンロードセクションをご紹介しました。今回はその続編の対象の商品を購入したお客さんだけに特典をお渡しするセクションを作成しました。 ▼前回の記事はこちら 商品Aに特典１と２を設定しておいて、商品Aを購入した人のみがダウンロードできるというセクションです。前回はユーザー登録さえすれば誰でもダウンロードできるよ〜という登録促しようのセクションでしたが、

¥1,500
まりん | Shopi…