# PageFlyがOnline Store 2.0と互換性を持つようになりました

### 概要

PageFly は、Online Store 2.0 と [互換性を持つ](https://help.pagefly.io/manual/now-compatible-with-online-store-2-0/)という最大の改善が行われました。これらの主要なアップデートと、それらを最大限に活用する方法を見ていきましょう。

[PageFly をインストール](https://apps.shopify.com/pagefly?utm_source%3Dmanual%26utm_medium%3Darticle%26utm_campaign%3Dapp-listing)

### PageFly はどのように Online Store 2.0 と互換性がありますか？

PageFly は、Online Store 2.0 と共にリリースされた最も強力なテーマである Dawn を含む、すべてのテーマと互換性があります。

#### テーマスタイリング機能を有効にする

**PageFly** を使用すると、テーマの競合を心配することなく、ページのレイアウトと見た目を簡単にカスタマイズできます。**テーマスタイリング**機能をオンにしてから、好きなように変更を加えることを強く推奨します。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-9ef02fcc4efb168f2cc6bcceb2f1d90d26b7807d%2FAD_4nXeoRmUznj74fx1XLDqcQ5D3j_aogdZdEIcCb6JDW5BfFGk-eVUz_JudIt40rDqibXeYkos_cDoA1g364l3qzE7FRztrbC-nom7tKLfTvv7qSBJxDJQuaoSBQO8DgDrohhEMjSIfBk9wUryVCwa5Ygkey3A3lq75FlkvLgRl91HJyfg.png?alt=media)

> ストア向けのプレミアムテーマをお探しなら、SalesHunterThemes の Shine、Blum、Electro をお勧めします。これらは Online Store 2.0 と互換性があり、Shopify 上のほとんどのテーマよりもはるかに高速に読み込まれます。さらに、これらのテーマを購入すると、PageFly の 20 スロットプランを 5 か月間 月額わずか 1 ドルで利用できます。[こちらで確認](https://www.pagef.ly/1szr7c)してください。

PageFly は、使用しているテーマを自動的に検出し、その外観を正確に表示できます。この機能により、最も堅牢なページビルダーの力を活用し、お好みのテーマとシームレスに統合して、ストアが優れたインターフェースと最適な機能を備えることができます。

詳細については、以下のビデオチュートリアルをご覧ください。

{% embed url="<https://youtu.be/DZ5mqpRhUq8>" %}

#### 商品ページでデフォルトの商品詳細をカスタマイズする

Online Store 2.0 では、PageFly のエディターでデフォルトの商品詳細を非表示にする代わりに、Shopify アカウントのテーマエディターでこれらの要素を非表示にします。

さらに、新しいテーマカスタマイザー 2.0 では、PageFly のコンテンツの上または下などに、デフォルトの商品詳細の配置を変更することも可能です。このカスタマイズはテーマエディターで行われます。

デフォルトの商品詳細をカスタマイズする方法については、以下の手順を参照してください。

**ステップ 1: Shopify テーマエディターに移動する**

Shopify のテーマエディターに移動するには、以下の 2 つの方法のいずれかを選択できます。

* オプション 1: ページ設定 > テーマセクションタブの「Go to theme editor」をクリック

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXe7JmPjrtv6LYTIcDPicxlfCNPdNT7-aduSWvhoik95wT8eS0xvJEmVH8ia0beiIG33tTGVmQfhw7bXDlXY2I9QsgpsL4xyrI1KDgTl6y_OFkjdd7J7YXphhmelqLfEIzWg1DjHO-kqBUe16hLkOQkey3A3lq75FlkvLgRl91HJxfg.png)

* オプション 2: エディター画面で「Go to theme editor」を選択

エディターページにアクセスした後、セクションや要素の選択、新しい要素の追加など、エディター画面で何も操作を行っていない場合は、「Go to theme editor」オプションが表示されます。そのオプションをクリックすると、テーマエディターに直接移動できます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-2f783a935530af197ad014d284a6584730bb68e2%2Funnamed-1.png?alt=media)

**ステップ 2: デフォルトの商品詳細をカスタマイズする**

テーマエディターで、目のアイコンをクリックして、商品ページの任意の部分を非表示または表示します。

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXcOH5EOT1uJMNDICF1iKSPSZnV9n5CH3s0HZgFj5cIDYJVfqXTtyioSpg8UggHk_fn_QXFwfZwIoVkX4PQA8M-uYNnVtGTZ6vHLv-iz48ATi48Gq0Mw04gQaEMNpTuqjpamEumxSoLa_Laniiabmwkey3A3lq75FlkvLgRl91HJxfg.gif)

セクション名の前に表示されるアイコンをクリックし、新しい場所にドラッグアンドドロップすると、ページのセクションの位置が変更されます。同様の方法で、セクション内の要素の配置も変更できます。

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXfTjOJvAHNvrn0HxQe6GEAa0OSHpJgtOacXY-PUFoYqymHMXKS1_w55CF_XeRp9RO2cEOkWHMAecI4gn-xu6i7jVBGknduEuBGFYxU_IKxx1jkK0hkUvkvcZAv1bC_ewdSzCKLLGul1KHRkZ3lY)

### よくある質問

**1. Online Store 2.0 とは何ですか？**

Online Store 2.0 は、強化されたカスタマイズとパフォーマンスの向上を提供する高度な Shopify テーマフレームワークです。詳細については、こちらの [記事](https://www.shopify.com/partners/blog/shopify-online-store) をご覧ください。

**2. PageFly はどんなテーマでも使用できますか？**

はい、PageFly は Blum や Electro のようなプレミアムオプションを含むすべてのテーマと互換性があり、シームレスなデザイン体験を提供します。

**3. PageFly と Online Store 2.0 を使用して商品詳細をカスタマイズする方法は？**

デフォルトの商品詳細は、Shopify テーマエディターで直接カスタマイズできます。そこで商品ページの要素を非表示、表示、または再配置できます。

### その他のリソース

* [Shopify 2.0 テーマ：素晴らしいオンラインストアのためのトップ 8 テーマ](https://pagefly.io/blogs/shopify/shopify-2-0-themes)
* [PageFly 3.9.0 & 3.8.0: Online Store 2.0 統合、3D 画像、そして全く新しい要素のバッチ](https://pagefly.io/blogs/shopify/pagefly-shopify-online-store-2-0)