ページ構成を使用してページレイアウトを整理する方法
Last updated
Was this helpful?
Last updated
Was this helpful?
ページのセクションや要素全体を、全体像として把握したいと思ったことはありませんか?がその答えです。
アウトラインは、ページで使用されているセクション、行、列、および特定の要素を記録したものです。この機能のおかげで、レイアウト上で要素の名前をクリックするだけで、作業したい要素に簡単に移動できます。
重要: Gen 2 レイアウトは、従量課金制 () のみに提供されます。
ページコンテンツにアクセスするには、PageFlyエディターから左側のメニューに移動し、ページコンテンツボタン(上から1番目のアイコン)をクリックします。
通常、ページはセクション(レガシーエディター)またはフレックスセクション(Gen 2エディター)に分割されています。各セクションに何が含まれているかをさらに探索するには、各セクションの隣にある矢印をクリックして開きます。
レガシーエディターの場合、これによりセクションが展開され、内部の行、列、およびその他の要素が表示されます。
Gen 2エディターでは、フレックスセクションを展開して、内部にネストされた複数のレイヤーの要素を表示できます。
以下の詳細なガイドラインに入る前に、この洞察に満ちたビデオを見て、新しいGen 2エディターを使用してレスポンシブなShopifyページのセクション、ブロック、およびフレックスレイアウトを構築する方法を学びましょう。
ページコンテンツに新しいセクションを追加したい場合は、要素メニューから新しい要素をドラッグアンドドロップできます。
PageFlyテンプレートまたは保存されたセクションから選択して、新しいページを作成することもできます。
テンプレートを使用して新しいセクションを追加
テンプレートを使用すると、デザイン済みのセクションをページにすばやく追加できるため、時間を節約し、プロフェッショナルな外観を保証できます。
テンプレートを使用して新しいセクションを追加するには: セクションを追加ボタンをクリック > テンプレートを選択 > 目的のテンプレートを見つけて選択をクリックし、ページに追加します。
保存されたセクションを使用して新しいフレックスセクションを追加
保存されたセクションを使用すると、以前にカスタマイズして保存したフレックスセクションを再利用できるため、ページ全体で一貫性を維持できます。
保存されたセクションを使用して新しいフレックスセクションを追加するには: セクションを追加ボタンをクリック > 保存されたセクションを選択 > 目的の保存されたセクションを見つけて選択をクリックし、ページに追加します。
フレックスセクションまたは要素の位置を再配置できます。ページコンテンツでは、これらの項目を同じレベルにある限り、目的の位置にドラッグできます。
フレックスセクションまたは要素のすぐ右にある目のアイコンをワンクリックするだけで、フレックスセクションまたは要素を表示および非表示にできます。
注: この操作は、現在使用しているデバイスに適用されます。たとえば、モバイルビューで作業している場合、「非表示」操作はモバイルビューにのみ適用されます。
非表示のセクションは、ページコンテンツ内でぼやけて表示され、特定のデバイスで非表示になっていることを示します。
これらの操作を行うには、右側にある3つの点をクリックしてください。名前変更、複製、または削除のオプションが表示されます。
ページコンテンツの幅が不足してすべての要素が表示されない場合は、横スクロール機能を使用してすべての要素を表示します。
ページコンテンツに新しいセクションを追加したい場合は、要素メニューから新しい要素をドラッグアンドドロップできます。
PageFlyテンプレートまたは保存されたセクションを選択して、新しいセクションを作成することもできます。
テンプレートを使用して新しいセクションを追加
テンプレートを使用すると、デザイン済みのセクションをページにすばやく追加できるため、時間を節約し、プロフェッショナルな外観を保証できます。
テンプレートを使用して新しいセクションを追加するには: セクションを追加ボタンをクリック > テンプレートを選択 > 目的のテンプレートを見つけて選択をクリックし、ページに追加します。
保存されたセクションを使用して新しいセクションを追加
保存されたセクションを使用すると、以前にカスタマイズして保存したセクションを再利用できるため、ページ全体で一貫性を維持できます。
保存されたセクションを使用して新しいセクションを追加するには: セクションを追加ボタンをクリック > 保存されたセクションを選択 > 目的の保存されたセクションを見つけて選択をクリックし、ページに追加します。
セクション、列、行、または要素の位置を再配置できます。ページコンテンツでは、これらの項目を同じレベルにある限り、目的の位置にドラッグできます。
セクション、行、列、または要素のすぐ右にある目のアイコンをワンクリックするだけで、セクション、行、列、または要素を表示および非表示にできます。
この操作は、現在使用しているデバイスに適用されることにご注意ください。たとえば、モバイルビューで作業している場合、「非表示」操作はモバイルビューにのみ適用されます。
非表示のセクションは、ページコンテンツ内でぼやけて表示され、特定のデバイスで非表示になっていることを示します。
これらの操作を行うには、右側にある3つの点をクリックしてください。名前変更、複製、または削除のオプションが表示されます。
ページコンテンツの幅が不足してすべての要素が表示されない場合は、横スクロール機能を使用してすべての要素を表示します。
特に多くのセクションや要素を含む複雑なページでは、ページコンテンツで特定の要素を見つけるのに苦労する場合があります。この場合、PageFlyエディター内の検索機能を利用して、名前または種類で要素をすばやく見つけることができます。さらに、ページコンテンツのセクションを折りたたんだり展開したりすることで、要素をより適切に整理し、ナビゲートするのに役立ちます。
要素をドラッグアンドドロップして並べ替えようとすると、要素が目的の位置に移動しないことがあります。この場合、要素が階層内の同じレベル(例:セクションからセクション、列から列)内で移動されていることを確認してください。
1. ページコンテンツパネルのセクションや要素の名前を変更して、より整理しやすくできますか?
はい、より整理しやすくするためにセクションや要素の名前を変更できます。名前を変更したいセクションまたは要素の右側にある3つの点をクリックし、「名前変更」を選択します。新しい名前を入力して保存します。これにより、ページコンテンツが整理され、レイアウトのさまざまな部分を簡単に特定できるようになります。
2. PageFlyでページアウトラインをうまく整理するにはどうすればよいですか?
ページアウトラインをうまく整理するには、セクションや要素に明確で説明的な名前を使用してください。「名前変更」機能を一貫して使用して、ページの各部分に正確なラベルを付けてください。この習慣は、必要に応じて要素をすばやく見つけて編集するのに役立ちます。
3. セクション(レガシーエディター)とフレックスセクション(Gen 2エディター)の違いは何ですか?
セクションでは、行と列のコンテナ構造でページレイアウトをデザインでき、PageFlyセクションとPageFlyページの両方に追加できます。一方、フレックスセクションには行と列の構造がありません。これにより、PageFlyページに要素を直接追加でき、Flexブロックによってより柔軟なカスタマイズされたレイアウトが可能になります。
重要: Gen 2 レイアウトは、従量課金制 () のみに提供されます。