# スライドショー ### PageFly スライドショー要素について スライドショー要素は、複数のコンテンツアイテムを1つのエリアに表示するために作られており、コンバージョン率向上に貢献します。製品、セール、お客様の声などを紹介するのにご活用ください。 PageFly スライドショー要素の設定方法について、詳細な手順を説明した動画をご覧ください。 {% embed url="" %} #### PageFly スライドショーの種類 お客様のニーズに合わせて、さまざまな種類のスライドショーをご用意しています。現在、以下の6種類から選択できます。 \| 空白 | | ![](/files/7FL2kq15PL0POKWMQw3J) | | -------------------------------- | | シングル画像 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXfKKL7egF7RvKDQ9Q7ucLgMxwRxiWkVWUWQC-vZzpwfmrNfFui_Q6X-vtYDghretXlMzdnjDdh7cG5BnNtNN8yDxthEEQw0vHNSuv5LH3xBMIBF-ZgAwh0a5Ez7LVjAXfv1OR_55iwcNCkBqyrJFAkeyFcf8YeOu5ePV_gFR8uKJ0g.png) |\ \| 画像リスト | ![](/files/t5d74HydGl1lkbLyTmZI) |\ \| テキストオーバーレイ 画像背景 1 |\ | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXepxec85abGIvX41Fs6yZFddDsQS3L88EKKBHZk7VB34-3hGIpQMbFC0gQ4ehusiB-V8vt0V2tS7M9lqUDKvxyepCkmIdNoAXjOBVwTfebXXlvfA-g1NIJGiMuqsrPO7_-QAZvQeu-8YY7OxxSHCwkeyFcf8YeOu5ePV_gFR8uKJ0g.png) ![](/files/gOQz6eokkPlG3gyj2DFy) |\ \| テキストオーバーレイ 画像背景 2 | ![](/files/BASogb2K3XHWOWMemAK5) |\ \| 動画 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXdF07aJgpk3AokGIUAD4gjrgaIl5f_kocLqNmMx1vFYpSoNfAoianFAGsaLHxFyYaQkqCsaVU-_y7nL1ZMU4hg5PndOOyTWvMzTOGb5_uSBFpYr6VbumLeCa6-PjkCe0c3KA43zudU6zMGmJDH6MgkeyFcf8YePu_gFR8uKJ0g.png) | スライドに要素を追加して、思い通りの形にカスタマイズできます。 #### PageFly スライドショー要素の構造 すべてのスライドショータイプは、以下の構造に従います。 * Gen 2 エディタの場合: スライドショー > スライド 1 > スライドコンテンツ (画像, HTML動画, 見出し, 段落など) ![](/files/FyiLXfR1seM5ZpSpdw3E) * レガシーエディタの場合: スライドショー要素 > スライド要素 > 行 > 列 > スライドコンテンツ (画像, HTML動画, 見出し, 段落など) ![](/files/DWqrdLkO0KlZPuWdE1bM) ### PageFly スライドショー要素へのアクセス方法 PageFlyエディタで、左側のツールバーの上から2番目にある「要素」アイコンをクリックします。「PageFly」タブ内で「スライドショー」を選択してください。 ![](/files/LBc8DLgciJehC8bp76jK) ### PageFly スライドショー要素の設定方法 #### 全般設定 \| #### スライド スライドの数を制御します。オプションには、スライドの複製、追加、削除が含まれます。 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXeOLnA413Y2d8-d6P_k6_Ln7F8hRNucehajeW-xgfbYHn03fRjxTR2Kfqb991UI6I051pKdnEpj94eVg28vIKq01cYn2NGmvOWJctMb7ZstNRUEsva1bn8vdEzHkioV2OqBXuFXveMsKhVRkSv4JwkeyFcf8YeOu5ePV_gFR8uKJ0g.gif) | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXeifuEdSiVI8nJDyVP6S9ip9v97SdU1lS5Uw1yJSwLd9GEKPZt-PAUgsdsrhSnhxZnQBBHVhEEQl7EekS3KLYtaQkTDXr7id3bzUONTE2Pg8I7zzuNuBT2BFFt-X_dwGt6kC7UXl9bEN9MAY9FeG_AkDbC_) | | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | #### 表示アイテム 一度に表示するスライドの数を決定します。これはスライドの総数に依存します。 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXc-DbXDm4ueM3EmYR1DogoT8QMudMg4vySyhdryuLg2M2KC51RvCm7Ylf0WLw90rrs7FGPuf_MRDeoqsHXMlwqiw1cTlQxKfzKtJpLvkgvJH_jkmw5jwC2dEOG2hw9PGsMUZ0aVt9TwvKBllRoqqwkeyFcf8YeOu5ePV_gFR8uKJ0g.gif) |\ \| #### スクロールアイテム 「表示アイテム」設定に応じて、ナビゲーションボタンをクリックした後に表示されるスライドの数を指定します。 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXcCLAJ7XGrRStNoUBFhQRRA28TTEdzebBreZbeYxC8qcG8F6xd-XI9wv2tWyLtfKtF1ODUOJt5u7AsMyaRYEbsmV__J0UVc9hXycizdmKyul_9u0x3g_E6pbD6rq84kaiXgBSSsLwypHDGi90l6qwkeyFcf8YeOu5ePV_gFR8uKJ0g.png) ![](/files/HDSlI2TpsSA84czlRHpZ) |\ \| #### アイテム間隔 スライド間のスペースを調整します。 | ![](/files/4MopJbob3TDwruuYMXd8) |\ \| #### 部分アイテム表示 前後のスライドの一部を表示できるようにします。 | ![](/files/FAxI835IN1XW5lIP9nuM) |\ \| #### ナビゲーション スライド上の左右の矢印ナビゲーションボタンには5種類の異なるスタイルがあります。「なし」を選択し、ページネーションをクリックしてスライド間を移動することも可能です。一部のナビゲーションオプションはマウスオーバー時のみ表示されることにご注意ください。また、モバイルではすべてのナビゲーションタイプがデフォルトで表示されます。 | ![](/files/fsndpoaixSh6nNZwDkpU) |\ \| #### ページネーション 3つのページネーションスタイルから選択します。 | ![](/files/UuMzIkchgS1SpawGK1x4) |\ \| #### 最大高さを設定 オンにすると、表示されていないスライドを含むスライドショー内の最も高いスライドの高さにスライドショーの高さが最大化されます。 | ![](/files/foATOqaSwUGwvQiI2IDQ) |\ \| #### 自動巻き戻しを有効にする 最後に到達したら最初のスライドに戻ります。 | ![](/files/IoGT3lLgCwRBqjaz1dki) |\ \| #### 自動再生を有効にする スライドショー内のスライドの自動再生を有効/無効にします。これはライブページでのみ機能します。自動巻き戻しと自動再生をオンにすると、スライドは最後まで自動再生され、最初のスライドに戻ります。自動巻き戻しをオフにして自動再生をオンにすると、スライドは最初のスライドから自動再生され、最後のスライドで停止します。 | ![](/files/k0FLOhI4geChK6kZG8z2) |\ \| #### スライド遅延 自動再生を有効にした際のスライドの速度を調整します。最小速度は1秒、最大速度は20秒です。 | ![](/files/qK2WK7rRdU2fjc8ednN3) |\ \| #### ホバーで一時停止 自動再生を有効にした際に、スライドにホバーすることで自動再生を一時停止するかを選択できます。 | ![](/files/OfFyy51SZatX020n2a7u) | VISIBLE、ATTRIBUTES、ANIMATION のパラメータに関する詳細情報については、[こちら](https://help.pagefly.io/manual/elements-general-settings/)をご覧ください。 #### スタイル設定 スタイルタブに関する詳細情報については、[こちら](https://help.pagefly.io/manual/elements-style-settings/)で確認できます。 ### PageFly スライド要素の設定方法 #### 全般設定 スライドショー要素は複数のスライドの組み合わせであり、各スライドごとに編集・設定が可能です。 \| #### スライド数 スライドショーのスライド数を表示します。スライドを複製、追加、削除できます。 | | ![](/files/8RwwaJZnKxQw5xp9hWv0) | | --------------------------------------------- | | #### 名前 プレースホルダーにテキストを追加することで、各スライドの名前を変更します。 | ![](/files/5xWapDjxOLMFZ36XkkNs) | ACTION、ATTRIBUTES、TRACKING パラメータに関する詳細情報については、[こちら](https://help.pagefly.io/manual/elements-general-settings/)をご覧ください。 #### スタイル設定 スタイルタブに関する詳細情報については、[こちら](https://help.pagefly.io/manual/elements-style-settings/)で確認できます。 ### 一般的なケース #### スライドショーをヒーローバナーとして使用する スライドショーをヒーローバナーとして使用するのは一般的です。最高のCROスコアを得るためには、スライドインジケーターを表示し、5〜7秒遅延の自動再生を使用します。ただし、スライドが1つしかない場合は、ヒーローバナーにスライドショーを使用することは避けてください。 要素の過剰なネストは、ページの構造を複雑にし、HTMLコードを増やし、ページの読み込み速度を遅くし、編集をより困難にする可能性があります。単一画像のバナーのみを表示したい場合は、代わりに1カラムセクションを使用することを検討してください。 PageFlyでヒーローバナーを作成する方法の詳細については、[詳細ガイド](https://help.pagefly.io/manual/create-a-section-with-image-and-text/%23how-to-create-one-column-section)を参照してください。 #### スライドショーを全幅にする **Gen 2 エディタ** スライドショーを画面全体に広げるには、そのセクションを全幅に設定します。これを行うには、セクションをクリックし、「スタイル」タブに移動して、「コンテンツ幅」オプションで「コンテナを満たす」を選択します。 ![](/files/RpdkOySjZjbTQyiCuemM) **レガシーエディタ** スライドショーを画面全体に広げるには、そのセクションを全幅に設定します。これを行うには、セクションをクリックし、「一般」タブに移動して、「固定幅を設定」オプションで「いいえ」を選択します。 ![](/files/GKkiJgrcvxUFLi85ssTL) #### スライドの高さを変更する スライドの高さを調整するには、スライドをクリックし、「スタイル」タブに移動して、上下のパディングを変更します。 ![](/files/h5m5Ou2ggn3a43AaCzN4) ### よくある質問 **1. PageFly スライドショー要素とは何ですか？** 異なる種類のコンテンツを1つのスライドにまとめて配置できる機能で、ページをすっきり見せ、コンバージョン率を向上させます。 **2. どのような種類のコンテンツを追加できますか？** 単一の要素として、スライドとアイテムを追加できます。アイテムの種類には、シングル画像、画像リスト、テキストオーバーレイ画像、動画があります。その後、表示、スクロール、スペース、ナビゲーションなど、各アイテムの設定を自由に編集できます。 ### 関連リソース * [PageFly スタイルタブ](https://help.pagefly.io/manual/elements-style-settings/) * [PageFly 一般タブ](https://help.pagefly.io/manual/elements-general-settings/) * [PageFlyページで全幅セクションを作成する5つのステップ](https://help.pagefly.io/manual/create-a-full-width-section/) * [ホームページの作成方法](https://help.pagefly.io/manual/how-to-create-a-homepage-with-pagefly/) --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://help.pagefly.io/pagefly-help-center-japanese/pjito/pagefly-elements/containers/slideshow.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.