Shopifyで高スタマイズタイトルを簡単に導入できるアプリ「リテリア Title」について解説

株式会社リテリアのアイコン
株式会社リテリア

はじめに

今回の記事は Shopify アプリ「らくらく見出し挿入アプリ|リテリア Title」の解説記事になります。

FirstView (2).png

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

「らくらく見出し挿入アプリ|リテリア Title」は、Shopify ストアの全ページに高カスタマイズなタイトルセクションを追加できるアプリです。

ストアに独自デザインのタイトルを表示したいという方は、ぜひインストールしていただきたいです。

https://apps.shopify.com/title?locale=ja&from=hp-guide

それでは、アプリを導入することでできること・インストール方法・使い方の解説を行なっていきます。

「らくらく見出し挿入アプリ|リテリア Title」でできること

「らくらく見出し挿入アプリ|リテリア Title」を使用すると、以下の画像のように自分の好きなデザインで全ページでタイトルセクションを使用することができます。

スクリーンショット_6.png

タイトルの色/配置、デザイン、アイコンなど豊富なカスタマイズを揃えているため、ストアにあったデザインにカスタマイズすることができます。

アプリのインストール

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

ストアの管理画面の「アプリ」を押して、画面に表示されている検索バーに「らくらく見出し挿入アプリ|リテリア Title」をクリックして、Shopify app store に移動してください。

Image.png

アプリストアで、「らくらく見出し挿入アプリ|リテリア Title」を検索してください。
検索結果に「らくらく見出し挿入アプリ|リテリア Title」が表示されますので、クリックしてアプリの紹介ページを開きます。

ScreenClip.png

「アプリを追加する」ボタンをクリックして、自分の Shopify ストアにアプリを追加します。
Shopify パートナーアカウントをお持ちの方は、開発ストアにインストールを行うことで全ての機能を無料でご利用いただくことが可能です。

マーチャント用のアカウント(普通の Shopify アカウント)ですと、月額 $1.99 でご利用いただけます。また、7 日間の無料お試し期間をご利用いただいてアプリの挙動をご確認いただくことができます。

Image.png

以下の画像のようなアプリのインストール確認画面が表示されます。
プライバシポリシーなどにご同意いただける場合は、「アプリをインストール」をボタンをクリックしてください。

Image.png

アプリの請求画面が表示されます。「承認」ボタンをクリックすることで、アプリの管理画面にアクセスできるようになります。
請求が始まるタイミングは、承認してから 7 日後から取りますので、安心して承認ボタンをクリックしてください。7 日間以内にアンインストールした場合は、アプリの料金は一切請求されません。

Image.png

以下のようなアプリの管理画面が表示されれば、インストールは完了です。

Image.png

アプリの詳しい使い方

ここからは、アプリの詳しい使い方について説明していきます。

アプリの自動追加

「らくらく見出し挿入アプリ|リテリア Title」には、アプリの自動追加機能があり、1 クリックでアプリをテーマに導入することができます。
自動インストールを行うとストアトップページにタイトルセクションを表示するためのアプリブロックが挿入されます。

アプリの管理画面で「アプリをインストールするテーマを選択」でアプリを挿入するテーマを選択します。

テーマを選択したら、「有効化」ボタンをクリックすることで、自動インストールが行われます。

「プレビュー」ボタンをクリックすることで、アプリがインストールされたアプリの画面を開くことができます。

初期状態のタイトルが、ストアに表示されていればインストールは完了です。

image.png

アプリの手動追加

アプリの自動追加がうまくいかない場合などは、手動でアプリブロックを有効化してください。

管理画面の「オンラインストア」を開きます。アプリを導入したいテーマの「カスタマイズ」テーマエディタを開きます。

セクションを導入したい商品ページへ移動し、「セクションを追加」から「タイトルPart1」を選択します。
(セクションの種類は、5種類あるのでお好きなタイトルを選択してください。)

Image.png

初期状態のタイトルがトップページに表示されていれば、手動でのアプリ追加は完了です。

Image.png

アプリのカスタマイズ

アプリの設定項目について説明します。

セクションの種類

上からタイトルPart1-5となっております。

タイトルPart1:アイコン付きタイトル
タイトルPart2:サブタイトル付きタイトル
タイトルPart3:バー付きタイトル
タイトルPart4:シンプルタイトル
タイトルPart5:両側線付きタイトル

どのセクションも高カスタマイズ可能なセクションとなっております。

スクリーンショット_6.png

文字の大きさの設定

「文字の大きさ」でテキストの大きさを変更できます。(PC:パソコン時とSP:スマホ時の大きさを設定できます。)

image.png
image.png

文字の間隔の設定

「文字の間隔」で文字間の間隔を変更できます。(PC:パソコン時とSP:スマホ時の大きさを設定できます。)

image.png
image.png

文字の太さの設定

「文字の太さ」で文字の太さを変更できます。(PC:パソコン時とSP:スマホ時の大きさを設定できます。)

image.png
image.png

文字の色の設定

「文字の色」で文字の色を変更できます。

image.png
image.png

ブロックの余白設定

「ブロックの上下余白」「ブロック内の上下余白」でブロックの余白を変更できます。(PC:パソコン時とSP:スマホ時の大きさを設定できます。)

Image.png

アイコンの設定(Part1)

「左側の画像」でテキスト横に表示する画像を指定できます。

image.png

アイコンの大きさの設定(Part1)

「画像の大きさ」で画像の大きさを指定できます。(PC:パソコン時とSP:スマホ時の大きさを設定できます。)
Image.png

ボーダーの色の設定(Part2,3,5)

ボーダーの設定の「色」でボーダーの色を指定できます。
image.png
image.png

ボーダーの太さの設定(Part2,3,5)

ボーダーの設定の「太さ」でボーダーの太さを指定できます。(PC:パソコン時とSP:スマホ時の太さを設定できます。)
image.png
image.png

ボーダーの長さの設定(Part2,3,5)

ボーダーの設定の「長さ」でボーダーの長さを指定できます。(PC:パソコン時とSP:スマホ時の長さを設定できます。)
image.png
image.png

ボーダーの数の設定(Part5)

「ボーダーを二重線にする」でボーダーの本数を変更できます。
image.png
image.png

二重線の間隔の設定(Part5)

「二重線の間隔」でボーダー間の間隔を調節できます。
image.png
image.png

終わりに

今回は、「らくらく見出し挿入アプリ|リテリア Title」の解説を行いました。

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

ここまでお付き合い頂き、誠にありがとうございました。

https://apps.shopify.com/title?locale=ja&from=hp-guide

もし、うまく動かない、設定方法がわからない、さらに機能を追加して欲しい等ありましたら、下記よりお問い合わせいただけますと幸いです。

https://www.re-terior.com/contact-us

recommendおすすめ記事

らくらくお気に入りリスト | リテリア wishlistのアイコン
アプリ解説

Shopifyでお気に入り機能を実装するアプリ『リテリア wishlist』を解説

セット売り|リテリア セット販売のアイコン
アプリ解説

日本語に完全対応したセット販売アプリ「セット売り|リテリア セット販売」について徹底解説

スマホナビゲーション|リテリア Navigationのアイコン
アプリ解説

Shopify ECサイトをスマホで利用しているユーザーのためのアプリ「スマホナビゲーション|リテリア Navigation」解説

よくある質問どこでも挿入|リテリア FAQのアイコン
アプリ解説

ShopifyストアにFAQ(よくある質問)を挿入できるアプリ『リテリア FAQ』の使い方を徹底解説

どこでもYouTube動画埋め込み|リテリア Videoのアイコン
アプリ解説

ShopifyストアにYouTube動画を埋め込む方法を徹底解説!

らくらくバナー設置アプリ|リテリア Bannerのアイコン
アプリ解説

Shopifyでリンク付き画像を簡単に設置できる「リテリア Banner」に付いて解説

追従購入ボタンらくらく挿入|リテリア Buy Buttonのアイコン
アプリ解説

商品ページに追従ボタンを簡単に導入できるShopifyアプリ | リテリア Buy Button について解説

送料無料キャンペーン|リテリア 告知のアイコン
アプリ解説

【公式解説】簡単に送料無料バーを設定できる Shopify アプリ「リテリア 告知」について解説!

スライドショー挿入アプリ|リテリア スライドショーのアイコン
アプリ解説

高カスタマイズ画像スライドショーを挿入できるShopifyアプリ「リテリア スライドショー」の使い方を徹底解説

クーポンコード 1クリックでコピー|リテリア Couponのアイコン
アプリ解説

画像をクリックするだけでクーポンコードをコピーできるShopifyアプリ「リテリア Coupon」の解説

離脱防止ポップアップバナー挿入アプリ|リテリア Popupのアイコン
アプリ解説

Shopifyで離脱防止ポップアップを設置できる「リテリア Popup」について徹底解説

らくらく日本語フォント設定|リテリア Font Pickerのアイコン
アプリ解説

Shopifyで日本語フォントを使えるアプリ『リテリア Font Picker』について徹底解説

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

Shopifyの商品詳細ページに発売予告機能を追加できるアプリ「リテリア Coming Soon」について解説

どこでもカートに追加|リテリア ぽんぽんカートのアイコン
アプリ解説

【Shopifyアプリ】トップページやコレクションページから1クリックでカートに追加出来るアプリについての解説

らくらく商品レビュー|リテリア Reviewのアイコン
アプリ解説

日本製商品レビューShopifyアプリ「リテリア Review」の使い方を徹底解説

らくらくランキング表示アプリ|リテリア Rankingのアイコン
アプリ解説

Shopifyでコレクションをランキング表示するアプリ『リテリア Ranking』を徹底解説

らくらく余白調整|リテリア Marginのアイコン
アプリ解説

簡単に余白を調整できるShopifyアプリ「リテリア Margin」を使ってストアのデザイン性を向上させよう

Aboutページらくらく作成|リテリア About Usのアイコン
アプリ解説

ShopifyストアのAboutページに表を埋め込むことができるアプリ「リテリア About Us」を解説

LINE誘導ボタンらくらく設置|リテリア LINE誘導のアイコン
アプリ解説

LINE誘導ボタンを簡単に設置できるShopifyアプリ「リテリア LINE誘導」について徹底解説