# アプリブロック ### Shopifyアプリブロック要素について [Shopifyアプリブロック要素](https://help.pagefly.io/manual/how-to-use-shopify-app-block-element-with-pagefly-section/)を使用すると、使用しているアプリからアプリブロックをPageFlyページまたはセクションに直接追加できます。この要素は、従来の統合方法の複雑さなしに、サードパーティアプリの利点を活用するためのユーザーフレンドリーで効率的、かつカスタマイズ可能な方法を提供します。これにより、既存のアプリからの追加コンテンツをPageFlyページおよびセクションに、より効率的に組み込むことができます。 {% hint style="warning" %} **重要事項**: * アプリブロック要素は、ShopifyテーマOS 2.0でのみ使用できます。 * この要素は1つのページで1回のみ使用できます。 {% endhint %} ### アプリブロック要素にアクセスする方法 * ステップ 1: ページエディターにアクセスします。 * ステップ 2: 要素カタログの3番目のアイコン、つまり「**Third-party element**」機能をクリックします。 * ステップ 3: 「**App blocks**」要素をクリックします。 * ステップ 4: 要素をセクションエディターにドラッグアンドドロップし、使用を開始します。 アプリブロック要素には、「**App blocks**」という1つのバリエーションがあります。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-f7fdd6278d1d5f4c978c213aa3add7e7e38a14a3%2FAD_4nXcu3sDAHn7zc6bI5Z4wjRtDJ9KFJJ8Ytcmzjm3zHjWWt7cEgrIPztxH2oJDVhegSr56OZxOo5g_MgvNH3kos5zsaxICUNsGBG_8ctIjNpGUCSlWwAWzbNxlzPXXC4Xs8YBuggY-yffbPcs3jS2zkeyPK2vM_BLb_MWGDktDDEA0A.png?alt=media) ### アプリブロック要素を設定する方法 アプリブロック要素の主要な設定は、使用したいアプリ内で行われますが、PageFlyはいくつかの追加オプションを提供しています。 **General**タブでは、要素のVisibility、Attributes、Animationを調整できます。これらの設定の詳細については、[Generalの記事](https://help.pagefly.io/manual/elements-general-settings/)を参照してください。 ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXemp6B1dSwIzMyWOg2zKOSZgoHrXrK0ofKQW1-0QHZTtsjo_N3Rj7H5_BevCFV6rFXsQZhBK3tUNcq_2QcsmgRS7KBhSVh5NYKjDkL_puj2puYHSP7TSum3574NBnIbdKOP3tSz1yB-CKE-w63rAgkeyPK2vM_BLb_MWGDktDDEA0A.png) ### アプリブロック要素に表示するアプリを選択する方法 アプリブロック要素に表示するアプリを選択するには、次の手順を実行する必要があります。 1. すべての変更を保存し、PageFlyページを公開します。 2. そのページの**Theme Editor**にアクセスします。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-abd098ac4740d8aeb3ab87533b7dbeb1db237eea%2FAD_4nXeQt-GtTp3s7IGh6_WFada6X7dfTiBBjud9NosmDRvGKAiBL0Y3-VzbC5qLhkzGW8PW9q1SF_8Gj7CvwwSf1-DaJmg5KwOarwvsKw149yJkX0Jp_tBL4S3GxlRc_1ufemkrExLS_uxGaklZ6k3ajQkeyPK2vM_BLb_MWGDktDDEA0A.png?alt=media) **Theme Editor**に保存済みのセクションを追加したら、次の手順に従ってアプリブロック要素の設定を完了します。 #### ステップ 1: 「Add Block」ボタンをクリックします ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-e20b707863b212d7fd4cbc407946afed63b62881%2FAD_4nXf69oql4EVNrZdbANI-NXRLOeMh0Tjf1XYHAKjknFxBpQwtI7XMjCK5_Ta-qD9U_A9rotpOgre-ftXUnpkoePQ9-Q994wajzpL6jHKl8z1RrOa-fRu-dxVBk3k2tdMgUS1QpaM8K-_H6NDCQYoU0AkeyPK2vM_BLb_MWGDktDDEA0A.png?alt=media) #### ステップ 2: 追加したいアプリを検索します Appsタブでは、検索バーを使用して追加したいアプリや要素を簡単に検索したり、スクロールして見つけたりすることができます。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-a6505ede6b0f7f21424b3045082ae8dc1f27dbca%2FAD_4nXead528101guSwNENhFPhw_80UjmoBDxkWxyIa-vi64aoWYLAeYlR0UPq1QHkIf5yos662C0g2oQwmtUGwasc4mdm7sSetKkYQsn55pXL5r-d1WLfUbx5jpG3Sz_hpc3LlQfe2zmZfGC7qsetlQ-QkeyPK2vM_BLb_MWGDktDDEA0A.gif?alt=media) #### ステップ 3: 追加したいアプリを選択します この例では、Stamped Product Review & UGCアプリのStar Ratingを追加します。「**App blocks**」要素でサポートされているアプリのみが「**Apps**」リストに表示されることに注意してください。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-cdcb01d10e36084336ea22381060615e229e346b%2FAD_4nXfxaAgi-U31M3lkKUr7GXFr4ww057ZEr7oAlTKQMmXwJAweEaL-srJ0ttNP8-lb7JdDYXqLt7zhgUIarXgiYgbRmycrNkNhTh-WLKy3TcHU6sA5EskKXfFDcty58H15Tk1lB61CJwBsmq5tZ82ouwkeyPK2vM_BLb_MWGDktDDEA0A.png?alt=media) #### ステップ 4: 保存をクリックします 追加された要素は次のようになります。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-cb8ed9378c53721dc59c77cb5ffa2fdc33d74887%2FAD_4nXfsn_Jk9-YtjOGu7Ew90McavPjvnGA93D0vO1k7G4vzZz1Os8uZ27uUTvQL580-RpQAmxl7N7mOwZY7c8gO5O7VSOYQx3YoCf0RJSjn307qFPyZpywqhqTnJHMC7Q2q_BUhI3mKnZOz6KRU-VJjyAkeyPK2vM_BLb_MWGDktDDEA0A.png?alt=media) ### 使用例 App block要素を使用して、PageFlyがまだ統合していないアプリのサードパーティアプリコンテンツを表示できます。 ### バージョンアップデート #### 4.12.0 App Block要素は、PageFly Saved sectionとPageFly pagesの両方で使用できるようになりました。（2024年5月28日リリース） #### バージョン 4.12.0 より前 App Block要素は、PageFly Saved sectionでのみ使用できました。 ### よくある質問 **1. 同じページに複数のApp Block要素を追加できますか？** いいえ、App Block要素は1つのページにつき1回のみ使用できます。複数のアプリブロックを追加する必要がある場合は、それぞれに別の保存済みセクションを作成するか、別のページで使用する必要があります。 **2. App Block要素の外観をカスタマイズできますか？** App Block要素の主要な設定は、アプリ自体の中で行われます。 **3. テーマエディターのApp block要素内に複数のアプリを追加できますか？** はい、テーマエディターのApp block要素内に複数のアプリを追加できます。ただし、これらのアプリの位置はApp blockの位置外では変更できませんが、App block内で順番を並べ替えることは可能です。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-bb7b693bb433d1c604946cd813976d63b47ead82%2FAD_4nXduh_eY6qgqygg5Lc3v-jMR69SUZHHJEdoIHmrA-zk3q9doFcldcNbTpZwAZexuZIUTC-ilwZNEDKPn0O80KBsGZZXKEYPSf2WkVXjhl4FCIGsiPFGNuJzOQZvyoRG7Fb207bjE_3U1g1mwXg7h0wkeyPK2vM_BLb_MWGDktDDEA0A.gif?alt=media)