マガジンのカバー画像

Shopifyコーディング100本ノック(Dawn)続編

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

#shopify活用

[Shopify]画像が表示される前の横スライドがかっこいいメインビジュアル・和風セクション #1

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今日から和風セクションシリーズを作ってみます^^ 和風といっても文字が縦書きになっただけなのですが。。。 コレクションページやブログ一覧のトップに使うとオシャレになりますね♪ ✔️レイアウトの特徴 🔶CMSの特徴 ・・・

¥1,200

【GAS】問合フォームからのメッセージを顧客管理のメモ欄に記録しておく#23 (Shopify API + GoogleAppsScript)

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 前回、Shopifyの問い合わせフォームの内容をスプレッドシートにも記録していく方法をご紹介しました。今日はその続きで、スプレッドシートだけでなく、Shopify側の顧客管理のメモ欄にも表示されるようにしてみました! 既にメールアドレスが登録されていればその顧客のメモ欄が更新されます。上書きされますが、タイムラインに残るのでもし既にメモ欄に記載している内容があればタイムラインを見ればOK。

¥1,500

[Shopify]オリジナルセクション4

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 おしゃれなセクションテンプレート♪ ✔️レイアウトの特徴========= パソコン ========= ========= スマホ ========= 🔶CMSの特徴 ✔️設置手順Step1  新規セクション追加 管理画面>テーマ>コード編集>セクション>新規作成 下記のコードをコピペ 🔶セクションコード {{ 'section-origin04.css' | asset_

¥1,200

【GAS】スプレッドシートに反映した注文情報から販売データ分析#08 (Shopify API + GoogleAppsScript)

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今日はShopify APIとGoogleスプレッドシーとを使って販売データを分析してみたいと思います! スプレッドシートとの連携は以前ご紹介した注文情報取得用のAPIを使おうと思います。 TOPページに持ってくる商品や広告に使える商品を割り出したりするのに使えるかも。 ✔︎今回のゴールまずはShopifyから注文情報を取得しスプレッドシーとへ書き出す。 取得した情報からABC分析表

¥1,200

[Shopify]コピペで簡単♪会員登録規約ページ設置方法(Dawn)77/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 今日は会員登録をしてもらう際に規約を表示して同意する&同意しないボタンを設置したページを作成しようと思います。 同意するボタンを押したらアカウント作成画面へ 同意しないボタンを押したらTOPページへ遷移する という動作にしようと思います。 今回は会員規約のみで次回はログイン画面から遷移できるようにしてみようと思っています。 ✔︎今回のゴール ◆CMSの特徴 ✔︎設置手順Step1

¥1,200

[Shopify]ブログ記事のテンプレート第4弾♪(Dawn)

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 Shopifyのブログ記事のテンプレート第4弾です。 今回はシンプルにツールバーのみをアレンジ。 ✔️今回のテンプレートデモページ: ①アクセス(PW:stahsk40jw1Mf) ②ここのブログにテンプレート4を使用しています 文字のカラーはツールバーから変更してください。 各見出しの枠線や背景カラーは共通で設定するようにしているのでCMSから設定してね。 テンプレート4は次のページ

¥3,800

[Shopify]コピペで簡単!おしゃれな3D回転バナーセクション<PCだけ>(Dawn)63/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 PCだけ画像が3D回転されるセクションを作成しました。スマホ版は縦にずらっと並ぶだけ。クリックはできません。 コーディングの解説記事ではありません。 ✔️今回のゴールデモはこちら(stahsk40jw1Mf) クリックはできません。 ◆CMSの特徴 ✔️設置手順Step1 セクション追加 管理画面>コード編集>セクション>新規セクション追加 Step2 下記のコードをコピペ

¥800

[Shopify]商品追加もできちゃうランディングページ◆テンプレート5

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 本日のランディングページは、SNSの投稿や広告から直接商品を購入してもらうか、あわよくばLINE登録に登録にもっていけるようなLPを作ってみました♪ DEMOページ(stahsk40jw1Mf) https://malins-100.myshopify.com/pages/lp5 Dawn以外でも使えると思いますが保証はできません。 ✔️今回のテンプレート ✔️設置方法Step1 新

¥5,800

[Shopify]コピペで簡単設置♪ブログに目次ブロックを追加(Dawn)50/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 ようやくDawnの100本ノックシリーズが50記事になりました♪ 今回はブログ記事の中に目次をつけたいと思って、目次セクションを作ってみました。H2とH3が反映される目次にしています。 コードの解説記事ではないのでご了承ください。 ✔️今回のゴールデモページ(PW:stahsk40jw1Mf) ✔️CMSの特徴✔️設置方法Step1  Sectionファイル内のmain-articl

¥800

[Shopify]ブログテンプレート2♪HTMLテンプレートコード

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 ブログのテンプレートをご紹介します^^ 全部で11パーツのHTMLテンプレートコードを作成してみました♪ さらに、スプレッドシートでジェネレーターも作ったので一緒に添付しておきます。 ✔️本日のブログテンプレートTemplate2のデモページ (PW:stahsk40jw1Mf) PC SP ✔️本文用HTMLテンプレートブログのテンプレートはtemplate2を選択♪ ◆表通設

¥3,800

[Shopify]メタフィールド使ってブログ記事に関連商品を紐づける(Dawn)47/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 特集記事で該当商品を表示できない?と、何件かクライアントさんからご要望いただくことが多い。 いくつか方法はあるのですが、今日は記事コンテンツの下に表示させる方法についてご紹介します♪記事の本文中に表示させる方法についてはまた今度いつかご紹介しますね^^ 今回もメタフィールドが大活躍! デモページ PW:stahsk40jw1Mf (ヘッダーから見れます) ✔️今回のゴール ブログ記

¥800

[Shopify]ファーストビューに検索機能+サジェストキーワードをポコポコ追加できるセクション(Dawn) 44/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 先日ご紹介した背景+検索機能つきのメインビジュアルのセクションに、サジェストキーワードを追加できる機能をつけました♪ ↓前回の記事↓ キーワードはCMSから追加・編集・削除ができます♪ 検索窓だけあってもどんなキーワードで探したらいいのかわからず、結局使わないことって私はよくあるんですよね〜 なので、そんな私のようなユーザー向けにサキーワードで教えてあげて、クリックすると、検索画面へ

¥800

[Shopify]メタフィールド使ってアップセル作成してみる♪商品カート追加時のポップアップに表示(Dawn) 41/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 メタフィールドを使ってアップセルを作成してみました。デフォルトでは商品ページで「カートへ追加」ボタンをクリックすると「カートへ追加されました」のモーダルが出てきます。 そこに、この商品も一緒に買えば30%オフとか、この商品購入している人はこちらも購入しているよ!という機能をつけてみます。 まとめ買い訴求で売上アップを狙ってみる♪ ✔️今回のゴール ✔️設置方法Step1  メタフィー

¥500

[Shopify]コピペで簡単♪メルマガ登録の自動顧客タグを好きなタグ名に変更する方法(Dawn)38/100

こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。 Shopifyの無料テンプレートではメルマガ登録フォームで登録してもらえると、自動的に顧客タグにnewsletterが付与されますよね! それも便利なのですが、私の場合、色んなカテゴリのLPやニュース一覧のトップにメルマガ登録フォームを設置していて、全員「newsletter」のタグがついてしまい、どの人がSNSマーケに興味があって、どの人がフィットネスに興味がある人なのかが分からなくなり

¥500