OS 3.0 テーマエディターにおけるライブプレビューモードの理解(限定アクセス)
ライブプレビューモードは、OS 3.0テーマエディターのプレビューオプションで、ストアのデザイン中に変更をより速く表示します。オンにすると、テキスト、色、間隔、その他の設定を編集するたびにプレビューがすばやく更新されるため、各変更のレンダリング完了を待つ必要がありません。この記事では、ライブプレビューモードがデフォルトモードとどのように異なるか、オンにする方法とモードの切り替え方法、ライブプレビューに対応している設定について説明します。
| 注:この機能は現在ベータ版であり、選択されたマーチャントのみが利用可能です。テーマエディターにこのオプションが表示されない場合は、アクセスをリクエストするためにSHOPLINE担当者にお問い合わせください。 |
ライブプレビューモードとデフォルトモードの違い
デフォルトでは、テーマエディターはデフォルトモードで変更をプレビューします。このモードでは、システムが各変更のレンダリングを完了した後にのみプレビューが更新されます。
ライブプレビューモードは、より速くプレビューを表示する方法です。オンにすると、テキスト、色、フォントサイズ、間隔などの一般的な設定を編集した際に、プレビューがより迅速に変更を反映します。
ライブプレビューモードは、ストアのデザイン中にコンテンツやスタイルを繰り返し調整する必要がある場合に最適です。例えば:
- 見出し、本文テキスト、ボタンテキストの編集
- 色、背景色、カラースキームの調整
- 間隔、配置、フォントサイズなどのスタイル調整
- 設定変更後のページの見た目をすばやく確認
両モードの主な違いは以下の通りです:
| 比較 | デフォルトモード | ライブプレビューモード |
| プレビュー | システムがレンダリングを完了した後に更新 | 対応する設定を変更した際により速く更新 |
| 最適な用途 | 日常的なストアデザイン | テキスト、色、スタイル、その他の設定を繰り返し調整する場合 |
| 対応範囲 | すべてのテーマエディター機能に対応 | 主にストアデータの読み込みを必要としない設定に対応 |
| オンにする方法 | エディターを開くと自動的に使用される | 手動で切り替え可能。いつでもデフォルトモードに戻せる |
ライブプレビューモードのオンにする方法
ライブプレビューモードをオンにするには:
- SHOPLINE管理画面で、オンラインストア > デザインに移動してテーマエディターを開きます。
- テーマエディターの上部ツールバーにあるプレビューモードアイコン(ウィンドウ内の目の形)をクリックして、デフォルトモードからライブプレビューモードに切り替えます。
- ページがリフレッシュされ、自動的に読み込みが開始されます。読み込みが完了したら、テーマの編集を継続できます。
有効にすると、ライブプレビューに対応した設定を編集した際にプレビューの更新が速くなります。
ライブプレビューモードに対応している設定
ライブプレビューモードは主にテキスト、色、スタイルなどの一般的な設定に対応しています。画像、商品、メニューなどストアのデータを読み込む必要がある設定は、まだライブプレビューに対応していません。
ライブプレビューに対応している設定
以下の設定はページのコンテンツやスタイルを調整するためによく使われます。これらに限定されませんが、主に次のものが含まれます:
- テキスト: 一行テキスト、複数行テキスト、リッチテキスト
- 色: カラーピッカー、グラデーションカラーピッカー、カラースキーム
- フォントとレイアウト: フォントピッカー、パディング、テキストの配置、左右の配置、上下の配置
- 一般オプション: スライダー、ドロップダウンメニュー、スイッチ
- その他: 支払いアイコン、グループヘッダー
まだライブプレビューに対応していない設定
以下の設定は画像、商品、その他のリソースをストアから読み込む必要があるため、まだライブプレビューに対応していません。これらに限定されませんが、主に次のものが含まれます:
- 画像と動画: 画像ピッカー、動画ピッカー、外部動画リンク
- 商品: 商品ピッカー、商品リストピッカー、カテゴリピッカー
- ブログとページ: ブログ投稿ピッカー、ブログカテゴリピッカー、カスタムページピッカー
- ナビゲーションとリンク: メニューピッカー、リンク(URL)フィールド
- コード: スニペットコードフィールド、HTMLコードフィールド
- ウェブサイトアイコン: ウェブサイトアイコン(ファビコン)アップロード
| 注: 上記の設定を編集した場合、プレビューはデフォルトモードと同じ方法で更新されます。 |
ライブプレビューモードに関するよくある質問
Q1: ライブプレビューモードに切り替えるオプションが表示されないのはなぜですか?
ライブプレビューモードは現在OS 3.0テーマのみ対応しています。オプションが表示されない場合は、まずストアのテーマをOS 3.0テーマにアップグレードしてください。
Q2: ライブプレビューモードをオンにするとページがリフレッシュされるのはなぜですか?
レンダリングモードを切り替える際、システムはそのモード用のエディターを再読み込みする必要があるため、ページがリフレッシュされます。再読み込み後に編集を継続できます。
Q3: 設定を変更しても一部がリアルタイムで更新されないのはなぜですか?
ライブプレビューモードは主にテキスト、色、スタイルなどの設定に対応しています。画像、商品、カテゴリ、メニュー、動画などストアのデータを読み込む必要がある設定は、まだライブプレビューに対応していません。
Q4: モードを切り替える前に保存を求められるのはどういう意味ですか?
現在のページに保存されていない変更がある場合、変更が失われないように保存するまでモードを切り替えることはできません。まず変更を保存してから、モードを切り替えてください。
Q5: 次回テーマエディターを開くとき、どのレンダリングモードが使用されますか?
ブラウザのキャッシュをクリアしていなければ、エディターは最後に終了したときのモードを使用します。キャッシュをクリアしている場合は、デフォルトモードに戻ります。
この記事はAIを使用して翻訳されており、不正確な部分が含まれている可能性があります。最も正確な情報については、元の英語版をご参照ください。