マガジンのカバー画像

Shopify

16
運営しているクリエイター

#ECサイト

【Shopify】チェックボックスで同意を得てからカートへ進む

【Shopify】チェックボックスで同意を得てからカートへ進む

補足事項がある商品の場合に、同意をしていただいてからカートへ商品を追加させるようにしたいとご要望をいただき実装してみました。

■補足受注データのメモに同意したかどうかは格納されないので、格納できるようにしたい場合にはもう少し処理が必要です。
Shopify提供のジェネレーターを使用すれば簡単に対応可能です!

■作業環境Dawn バージョン5.0.0
main-product.liquid

もっとみる
【Shopify/メタフィールド】販売開始・終了日時に合わせてカートボタンを有効・無効化する

【Shopify/メタフィールド】販売開始・終了日時に合わせてカートボタンを有効・無効化する

記事をまとめていたらすでに社内にある情報と一部かぶっていたので個人noteで供養させてください。

※ちなみに社内にあった情報はメタフィールドアプリを使用する方法で考え方は同じもの。

▼参考サイト

作業内容メタフィールドを定義する

設定>メタフィールド>商品>定義を追加する

コードを編集する

テーマ:Dawn
作業ファイル:main-product.liquid
カートへ追加するボタンを

もっとみる

【Shopify/Tips】Quick Order Printerの「No.」表記をマーチャントの運用に合わせた表記に変更する

今回はShopifyアプリの「Quick Order Printer かんたん帳票出力」についてご紹介いたします。
本アプリは安心の日本語対応で、領収書などをアカウントページで印刷できるようにしたいというマーチャントにご紹介しています。
今回はマーチャントからのご要望について開発元のミクスローグ様に教えていただいたTipsをご紹介いたします。

Quick Order Printer かんたん帳票

もっとみる
【Shopify】Powered by Shopifyを削除する

【Shopify】Powered by Shopifyを削除する



■環境
テーマ:Dawn
作業ファイル:footer.liquid

■作業内容{{ powered_by_link }}タグを見つけて削除します。

Dawnの場合は{{ powered_by_link }}タグを囲っている<small>タグを含めて削除しても大丈夫です。

<small class="copyright__content">{{ powered_by_link }}</sm

もっとみる
Shopifyデフォルトのお問合せフォームに商品名を自動入力させる

Shopifyデフォルトのお問合せフォームに商品名を自動入力させる

■前提Shopifyでは商品名をお問い合わせページへ渡せないようなので、お問合せフォーム自体を商品詳細ページへ移植する方法のご紹介です。
(もしかしたらできる方法があるかもしれないのですが、本記事についてはゴールに対して簡単な実現方法としてご紹介します。)

■環境テーマ:Debut
テンプレートタイプ:liquid

■作業内容新規セクションを作成する
内容は既存のproduct-templat

もっとみる
Shopifyデフォルトのお問合せフォームに注文番号欄を追加しよう

Shopifyデフォルトのお問合せフォームに注文番号欄を追加しよう

Shopifyではシンプルなお問い合わせフォームをデフォルトで用意してくれています。

ですが、キャプチャを見ていただくと注文番号欄がないことがわかるかと思います。
注文情報に関わるお問い合わせの場合には、注文番号を事前にお伝えいただくことでスムーズなやり取りが可能となります。
そのため、今回は注文番号欄を追加してみたいと思います!

■環境テーマ:Debut
作業ファイル:page.contac

もっとみる
【Shopify】検索結果を商品のみに絞る

【Shopify】検索結果を商品のみに絞る

この記事では細かいことは抜きにして、ずばっと方法だけをまとめていきたいと思います!

■環境テーマ:Debut
作業ファイル:search.liquid,search-drawer.liquid
※テーマによって作業ファイルは変わりますのでご注意ください。

■作業内容search.liquid,search-drawer.liquidそれぞれで<form>タグを見つけます。
<form>タグを見

もっとみる
【Shopify】ThemeKitの導入方法

【Shopify】ThemeKitの導入方法

公式ページが英語だったので日本語に変換したものです。
毎回忘れてしまう自分のための記事。わかりやすいように加筆している箇所もあります。

ThemeKitをインストールするMac OS
【前提】
Homebrewを使用します。
インストールしていない場合は下記をターミナルで実行。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.c

もっとみる
【Shopify】編集したいソースコードってどうやって探すの?〜ターミナル編〜

【Shopify】編集したいソースコードってどうやって探すの?〜ターミナル編〜

アナログ編、VSCode編(テキストエディター)に続きターミナル編です。
後半はテキストエディタを使用するのでVSCode編と同じになります。

■事前準備検索を実施したいソースコードをローカルにダウンロードしておいてください。

■早速やってみようお題:商品詳細ページのadd to cartボタンを探したい
テーマ:Debut
環境:ターミナル、Shopify管理画面またはテキストエディター

もっとみる
【Shopify】編集したいソースコードってどうやって探すの?〜VSCode編〜

【Shopify】編集したいソースコードってどうやって探すの?〜VSCode編〜

Shopify管理画面でコードを編集するからのアナログ編

ターミナル編

事前準備
1. テキストエディタ:Visual Studio Code(VSCode)をダウンロードしておいてください。
ダウンロードから日本語化までのまとめは下記を参考にどうぞ。
そのほか、おすすめのプラグインなどは検索するといろいろとまとめられているのでお好みで追加してみてください。

2. 検索を実施したいソースコー

もっとみる
【Shopify/アプリ】カスタムデータを顧客メモに出力する方法

【Shopify/アプリ】カスタムデータを顧客メモに出力する方法

Customer Fieldsアプリを使用した際に拡張したカスタムデータをnote(お客様に関するメモ)に出力する方法をまとめました。
※きちんと公式ヘルプがあり、読めば理解できますが英語なので日本語備忘録として。

手順
アプリ|Settings > Customer note editor

入力例
出力したいデータカラムを入力しSave

Birthday: {{ birthday }}

もっとみる
【Shopify】編集したいソースコードってどうやって探すの?〜アナログ編〜

【Shopify】編集したいソースコードってどうやって探すの?〜アナログ編〜

Shopifyで編集をする場合にどこに編集したいソースコードがあるのかがそもそも見つけられない!といったことを多く聞かれるのでまとめてみました。
私のやり方なのと非エンジニア向けなので、もっと効率が良い探し方があればぜひシェアしてください!

テキストエディター編

ターミナル編

補足情報
Shopifyの構造:Layout>Templates>Sections>Snippets

お題:商品詳

もっとみる