【Shopifyアプリ】シンプル余白調整|お手軽レイアウトについて徹底解説|ご利用ガイド

株式会社UnReactのアイコン
株式会社UnReact

はじめに

今回の記事は、Shopify アプリ「シンプル余白調整|お手軽レイアウト」の解説記事です。

Shopify とは、ざっくり説明すると EC サイトを簡単に構築できるプラットフォームであり、Shopify アプリとはそのプラットフォームの拡張機能のようなものです。WordPress の拡張機能のようなもの、と認識頂いて大丈夫です。

「シンプル余白調整|お手軽レイアウト」は、Shopify ストアに余白ブロックを挿入できるアプリです。

「シンプル余白調整|お手軽レイアウト」導入することで、ページの余白を調整でき、レイアウトを整えることができます。

興味のある方は、興味のある方は、以下の URL よりアプリのインストールを行なってください。

シンプル余白調整|お手軽レイアウト

「シンプル余白調整|お手軽レイアウト」でできること

Shopify アプリである、「シンプル余白調整|お手軽レイアウト」は、以下の画像のように、ストアのすべてのページにノーコードで余白を挿入できるアプリです。

「シンプル余白調整|お手軽レイアウト」でできること1

「シンプル余白調整|お手軽レイアウト」は、大・中・小の 3 種類の余白を挿入できます。

「シンプル余白調整|お手軽レイアウト」でできること2

「シンプル余白調整|お手軽レイアウト」は、ストアのどのページにも余白を挿入することができます。

「シンプル余白調整|お手軽レイアウト」でできること3

アプリのインストール

それでは、実際にアプリのインストールを行なっていきましょう。

ストア管理画面左下の「設定」をクリックします。

アプリのインストール手順1

ストアの管理画面の「アプリと販売チャネル」画面に表示されている「Shopify App Store」をクリックして、Shopify App Store に移動してください。

アプリのインストール手順2

検索窓に、「シンプル余白調整|お手軽レイアウト」と入力してください。以下の画像のアプリをクリックしてください。

アプリのインストール手順3

「インストール」ボタンをクリックして、ストアにアプリを追加しましょう。Shopify パートナー用アカウント(通称:開発アカウント)にて開発ストアにインストールを行うと、全ての機能を無料でご利用いただくことができます。マーチャント用のアカウント(実際に物販などで運用しているアカウント)ですと、月額$2.99 でご利用いただけます。インストール後、7 日間は無料でご利用いただけます。

アプリのインストール手順4

「インストール」ボタンをクリックすると以下の画面に遷移します。右下の「インストール」ボタンをクリックして、アプリのインストールを行いましょう。

アプリのインストール手順5

以下の管理画面が表示されます。

アプリのインストール手順6

アプリをテーマに追加

アプリをテーマに追加していきます。

自動でアプリをテーマに追加

管理画面の「設定」ページの「ストアに余白調整ブロックを追加」セクションでアプリをテーマに追加します。

自動でアプリをテーマに追加1

追加したいテーマを選択し、「テーマに追加」ボタンをクリックしてください。

自動でアプリをテーマに追加2

これでテーマに「余白調整(中)」を追加できます。忘れないように、右上の「保存する」ボタンをクリックしてください。

自動でアプリをテーマに追加3

手動でアプリをテーマに追加

手動でアプリをテーマに追加します。
下記の画像のように「セクションを追加」から手動でアプリを追加します。

手動でアプリをテーマに追加1

手動でアプリをテーマに追加2

余白のカスタマイズ

3つのセクションで余白のカスタマイズができます。

余白調整(小)セクション

余白調整(小)セクションの余白のカスタマイズです。
以下の画像は、編集できる箇所を表しています。テーマに合ったデザインにカスタマイズしてください。

余白調整(小)セクション

余白調整(中)セクション

余白調整(中)セクションの余白のカスタマイズです。

余白調整(中)セクション

余白調整(大)セクション

余白調整(大)セクションの余白のカスタマイズです。

終わりに

今回は、「シンプル余白調整|お手軽レイアウト」の解説を行いました。

少しでも興味があれば、以下のリンクよりアプリをインストール頂けるとありがたいです。

シンプル余白調整|お手軽レイアウト

recommendおすすめ記事

シンプルギフトラッピング|お手軽ギフト包装アプリのアイコン
アプリ解説

【Shopifyアプリ】シンプルギフトラッピング|お手軽ギフト包装アプリについて徹底解説|ご利用ガイド

シンプル購入制限|お手軽注文制限について徹底解説のアイコン
アプリ解説

【Shopifyアプリ】シンプル購入制限|お手軽注文制限について徹底解説|ご利用ガイド

シンプルランキング表示|お手軽ベストセラーのアイコン
アプリ解説

【Shopifyアプリ】シンプルランキング表示|お手軽ベストセラーについて徹底解説|ご利用ガイド

シンプル顧客タグごとの限定販売|お手軽ロイヤリティのアイコン
アプリ解説

【Shopifyアプリ】シンプル顧客タグごとの限定販売|お手軽ロイヤリティについて徹底解説|ご利用ガイド

シンプルロゴ一覧|お手軽ロゴリスト表示のアイコン
アプリ解説

【Shopifyアプリ】シンプルロゴ一覧|お手軽ロゴリスト表示について徹底解説|ご利用ガイド

シンプルのし(熨斗)アプリのアイコン
アプリ解説

【Shopifyアプリ】シンプルのし(熨斗)アプリについて徹底解説|ご利用ガイド

シンプル画像バナー|お手軽広告バナーアプリのアイコン
アプリ解説

【Shopifyアプリ】シンプル画像バナー|お手軽広告バナーアプリについて徹底解説|ご利用ガイド

シンプル Q&A|どこでも FAQのアイコン
アプリ解説

【Shopifyアプリ】シンプル Q&A|どこでも FAQに誘導について徹底解説|ご利用ガイド

シンプルモバイルアプリバナー|スマホアプリに誘導のアイコン
アプリ解説

【Shopifyアプリ】シンプルモバイルアプリバナー|スマホアプリに誘導について徹底解説|ご利用ガイド

シンプル流れる告知|流れるお知らせ挿入アプリのアイコン
アプリ解説

【Shopifyアプリ】シンプル流れる告知|流れるお知らせ挿入アプリについて徹底解説|ご利用ガイド

シンプル売り切れ非表示|在庫切れ商品の表示変更のアイコン
アプリ解説

【Shopifyアプリ】シンプル売り切れ非表示|在庫切れ商品の表示変更について徹底解説 | ご利用ガイド

シンプルレビュー|お手軽口コミのアイコン
アプリ解説

【Shopifyアプリ】シンプルレビュー|お手軽口コミについて徹底解説|ご利用ガイド

シンプル会員限定販売|お手軽アカウント必須販売のアイコン
アプリ解説

【Shopifyアプリ】シンプル会員限定販売|お手軽アカウント必須販売(購入制限)について徹底解説|ご利用ガイド

シンプル会員ランク|お手軽顧客タグ付けのアイコン
アプリ解説

【Shopifyアプリ】シンプル会員ランク|お手軽顧客タグ付けについて徹底解説|ご利用ガイド

シンプル Wishlist|お手軽お気に入りのアイコン
アプリ解説

【Shopifyアプリ】シンプル Wishlist|お手軽お気に入りについて徹底解説|ご利用ガイド

シンプル Coming Soon|商品ページ発売予告アプリのアイコン
アプリ解説

【Shopifyアプリ】シンプル Coming Soon|商品ページ発売予告アプリについて徹底解説|ご利用ガイド

シンプルセット販売|お手軽クロスセルのアイコン
アプリ解説

【Shopifyアプリ】シンプルセット販売|お手軽クロスセルについて徹底解説|ご利用ガイド

シンプル予約販売|受注販売や在庫切れ商品販売で使えるのアイコン
アプリ解説

【Shopifyアプリ】シンプル予約販売|受注販売や在庫切れ商品販売で使える について徹底解説 | ご利用ガイド

シンプル販売期間設定|商品ごとに期間限定販売のアイコン
アプリ解説

【Shopifyアプリ】シンプル販売期間設定|商品ごとに期間限定販売について徹底解説 | ご利用ガイド

シンプルVIPプログラム|お手軽VIP会員限定販売のアイコン
アプリ解説

【Shopifyアプリ】特別な顧客への限定販売を簡単に実現できるVIP販売アプリ『シンプルVIP』について徹底解説 | ご利用ガイド

シンプルポイント|追加料金なしで使えるお手軽ポイントアプリのアイコン
アプリ解説

【Shopifyアプリ】追加料金なしで使えるお手軽ポイントアプリ『シンプルポイント』について徹底解説 | ご利用ガイド