EコマースやShopifyの初学者にとって、できるだけ “やさしく” “わかりやすく” “正確に” 難しいコマース用語やマーケティング用語、ストア構築から販売までの仕組み・ノウハウを伝えることを心がけて、記事コンテンツを作成しています。

RuffRuff 目次作成の機能や料金プランを知りたい方は下記のページをご参考にしてください。
Shopifyに目次を自動生成するアプリ「RuffRuff 目次作成」とは?
本章ではRuffRuff 目次作成の初期設定方法(導入方法)について説明します。
※ アプリインストール後にセットアップ手順が表示されますので、手順通りに進めることを推奨しています。
Dawn、Refresh、Craft、Sense、Ride、Taste、Impulse、Prestige、Symmetry、Pipeline、Expanse、Impact、Empire、Focal など
DebutやMinimal、Narrative、Supplyなど
本章ではRuffRuff 目次作成がサポートしているShopifyテーマについて説明します
RuffRuff 目次作成は全てのShopifyテーマでご利用いただけます。
ただし、OS2.0テーマと以前のテーマとで、セットアップ方法が異なりますのでご注意ください。
動作しないShopifyテーマがありましたら、下記からお問い合わせください。
下記の2つの違いがあります。
1. テーマへのアプリを追加する方法の違い
OS2.0テーマは「アプリブロック」を追加します。
以前のテーマは「埋め込みアプリ」を有効化します。
2. 目次の表示位置の違い
OS2.0テーマは下記3つ全て利用できます
・テーマエディタで指定
・最初の見出しの上
・class名を指定
以前のテーマは下記2つのみ利用できます
・最初の見出しの上
・class名を指定
※ 最後に、「以前のテーマ」は今後継続的な保守対応が困難である事をご了承ください。
上記のセットアップ動画をご確認ください。
Shopifyの管理画面からアプリを追加したい場合は下記を参考にしてください。
1. オンラインストア > テーマ の順に移動
2 . アプリを入れたいテーマのテーマエディタを開く
3. テーマエディタ上部のセレクトボックスからブログ記事テンプレートを選択
4. 任意のセクション内の「ブロックを追加」をクリック または、 「セクションを追加」をクリック
5. 「目次」という名前のアプリブロックを選択
6. (任意)アプリブロックをセクション内の好きな場所に移動
7. 保存をクリック
上記のセットアップ動画をご確認ください。
Shopifyの管理画面からアプリを有効化したい場合は下記を参考にしてください。
1. オンラインストア > テーマ の順に移動
2 . アプリを入れたいテーマのテーマエディタを開く
3. [アプリの埋め込み] をクリックします。
4. [ブログ記事(以前のテーマ用)]という名称の埋め込みアプリを選択
5. アプリのトグルをクリックし、有効化
原因は下記3点が考えられます
1. OS2.0のテーマではない
→ アプリブロックは、OS2.0テーマのみ対応しています。以前のテーマの場合は、埋め込みブロックの有効化をお願いします
2.ブログ記事(Blog posts)や商品(Products)、ページ(Pages)のテンプレートではない
→ 本アプリは上記のテンプレートのみ対応しています。上記のテンプレートへアクセスしてください。
3.Regularプランではない
→ 商品(Products)とページ(Pages)のテンプレートはRegularプランのみ対応しています。本テンプレートへアプリを追加したい場合は、Regularプランへのアップグレードをお願いします。
それでも解決しなかった場合は、お問い合わせください。
公開されているブログ記事が1件も存在しないのが原因と考えられます。
→ 公開ステータスのブログ記事を作成し、再度ご確認ください。
それでも解決しなかった場合は、お問い合わせください。
原因は下記3点が考えられます。
1. 記事に目次に利用する見出しが存在しない
→「RuffRuff 目次作成」で設定している見出しを記事に挿入し、再度ご確認ください。
2. RuffRuff目次作成の状態が「無効」になっている
→「RuffRuff 目次作成」のアプリ設定画面にアクセスし、状態を有効にしてください。
3. テーマエディタ上の「目次」アプリの状態が「無効」になっている
→ テーマエディタ上の「目次」アプリの「目のアイコン」がグレーアウトされていないかご確認ください。
それでも解決しなかった場合は、お問い合わせください。
原因は下記3点が考えられます。
(1) ヘッダーの高さ分がずれている
→ 「スクロール時の上部余白」を利用し、遷移位置を調整してください。
(2) 画像等をLazy Loadを利用し、遅延読み込みを利用している
→ 大変申し訳ありません。現状のアプリの仕様では解決できません。
「Lazy Load」を停止してもらうか、遷移位置のズレを許容していただく必要があります。
(3) 導入テーマ自体に独自のスクロールのコードが存在する
→ 対応できる場合がありますので、まずはお問い合わせください。
対応する際に、Shopifyストアへのアクセス権限をリクエストする場合がございますので、ご理解ください。
Shopify自体にあるキャッシュ機能の影響で、反映に時間がかかる場合がございます。
時間をおいて、再度ご確認ください。
数時間たっても解決しなかった場合は、お問い合わせください。
問題を確認するために、Shopifyストアへのアクセス権限をリクエストする場合がございますので、ご理解ください。
下記が可能になります
・Freeプランの全機能
・ブランドの非表示(RuffRuff App by Tsunの非表示)
・目次の開閉ボタン機能
・目次の一部表示機能
下記が可能になります
・Lightプランの全機能
・商品へ目次を表示
・ページへ目次を表示
目次の背景を透過する機能自体は存在しませんが、目次の背景に挿入したいテーマの背景色と同色を設定していただくことで、擬似的に透過を実現することが可能です。
Light Planから目次の開閉ボタンをご利用することが出来ます。
目次の表示行数 (初期表示時)の機能で、ユーザーがサイト訪問時に表示する目次の行数を設定することが出来ます。
目次の表示行数 (初期表示時)の機能はLight Planからご利用いただけます
可能です。
方法としては、下記の2種類の方法があります。
① 「利用する見出し」で設定した見出しブログ記事で利用しない
RuffRuff 目次作成では、目次に利用する見出しがブログ記事上に1つも存在しない場合、目次が表示されない仕様になります。
例えば、目次に見出し2(h2)と見出し3(h3)を利用する設定をしていた場合、見出し2(h2)と見出し3(h3)を避けて、ブログ記事を作成していただくと、目次は表示されません。
② ブログ記事テンプレートを「目次あり」と「目次なし」の2種類を作成する
こちらの方法は、ブログ記事テンプレートを2種類作成する方法です。
ブログ記事テンプレートはテーマエディタを利用して作成できます。
「目次あり」のテンプレートには「目次」アプリ追加し、もう一方は追加しないように設定してもらい、目次を出したいブログ記事のテンプレートに「目次あり」のテンプレートを利用し、目次を出したくないブログ記事には「目次なし」のテンプレートを利用することで実現可能になります。
この方法を利用することで、①の対応をせずとも目次を出しなくないブログ記事を作成することが出来ます。
RuffRuff 目次作成の機能や料金プランを知りたい方は下記のページをご参考にしてください。 Shopifyに目次を自動生成するアプリ「RuffRuff...
Tsun Inc. CTOの小笠原です!今回はShopify APIをPostmanで簡単に実行するノウハウをまとめました。 Shopify APIに限...
EコマースやShopifyの初学者にとって、できるだけ “やさしく” “わかりやすく” “正確に” 難しいコマース用語やマーケティング用語、ストア構築から販売までの仕組み・ノウハウを伝えることを心がけて、記事コンテンツを作成しています。
掲載している各種情報は、株式会社Tsunが調査した情報をもとにしています。できるだけ“最新“かつ“正確“な情報の掲載に努めておりますが、内容を完全に保証するものではありません。当サイトによって生じた損害について、株式会社Tsunではその賠償の責任を一切負わないものとします。掲載情報に誤りがある場合には、お手数ですが株式会社Tsunまでご連絡をいただけますようお願いいたします。
{"one"=>"比較する2つまたは3つのアイテムを選択します", "other"=>"選択された3つのアイテムの{{ count }}"}