# YouTube

*Skill Level: Beginner*

## **始める前に**

* [画面](https://help.adalo.com/ja/component-basics/inserting-and-editing-screens)と[コンポーネント](https://help.adalo.com/ja/component-basics/design-basics)について知っていること
* [YouTube](https://youtube.com)を別のブラウザタブで開いているか、ビデオのコレクションを持っていること
* この機能を使用するには有料のAdaloプランは必要ありません

## ウォークスルー

{% tabs %}
{% tab title="シンプル" %}
**1.)** Adaloアプリ内で、左上隅にある大きなプラス記号<img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-d4071fa33f647c154638504f8145d43e9d725e3d%2Fadd%20button.png?alt=media" alt="" data-size="line">をクリックし、検索バーに **"Marketplace"** と入力して、**Explore Marketplace** をクリックします

**2.)** リストから **YouTube** を見つけ、**Install** をクリックして、**Done** をクリックします

**3.)** コンポーネントリストに戻り、検索バーに **YouTube** と入力し、コンポーネントを目的の画面にドラッグアンドドロップします

**4.)** まだ選択されていない場合は、新しく追加されたYouTubeコンポーネントをクリックします。コンポーネントを機能させるためには、YouTubeのリンクが必要です。これには、静的（変わらない）リンクを貼り付けるか、[Magic Text](https://help.adalo.com/ja/glossary#magic-text)を使用して、[データベース](https://help.adalo.com/ja/database)内の[コレクション](https://help.adalo.com/ja/glossary#collection)から動的（変化する）ビデオリンクを表示することができます。このウォークスルーでは、YouTubeコンポーネント設定の **Video URL** 入力フィールドにリンクを貼り付けることにしましょう。

**5.)** ユーザーが画面を訪れたときにビデオを自動再生させるオプションや、再生ボタンにクリックアクションを配置するオプションもあります。これはユーザーエンゲージメントと視聴履歴を追跡するのに役立ちます。

{% hint style="info" %}
サードパーティのアプリ/サイトによる埋め込みを許可する必要があります。そうしないと、ユーザーは埋め込まれたプレーヤー内で「ビデオが利用できません」という恐ろしいメッセージが表示されます。埋め込みを許可するには、YouTube Studio内のコンテンツタブに移動し、ビデオサムネイルをクリックし、ビデオの詳細ページで下にスクロールして `埋め込みを許可` オプションを見つけてください。チェックボックスが有効になっていることを確認して変更を保存してください。
{% endhint %}
{% endtab %}

{% tab title="詳細" %}
**1.)** Adaloアプリ内で、左上隅にある大きなプラス記号<img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-d4071fa33f647c154638504f8145d43e9d725e3d%2Fadd%20button.png?alt=media" alt="" data-size="line">をクリックし、検索バーに **"Marketplace"** と入力して、**Explore Marketplace** をクリックします

![マーケットプレイスを探索してYouTubeコンポーネントを追加する](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-06e9334c86d52d3f2e14092b2f3b0a055dbe8a95%2Fexplore%20marketplace.gif?alt=media)

**2.)** リストから **YouTube** を見つけ、**Install** をクリックして、**Done** をクリックします

![](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-b5d9c553151021d16ebc41325d32cd5782a2bbc1%2Finstall%20YouTube.gif?alt=media)

**3.)** コンポーネントリストに戻り、検索バーに **YouTube** と入力し、コンポーネントを目的の画面にドラッグアンドドロップします

![](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-57f7173242914dc14ba4af26cf7c931f6b3e2afd%2Fdrag%20component%20onto%20screen.gif?alt=media) **4.)** もしまだ選択されていない場合は、新しく追加されたYouTubeコンポーネントをクリックしてください。コンポーネントが機能するためには、YouTubeのリンクが必要です。これには、静的（変わらない）リンクを貼り付けるか、[データベース](https://help.adalo.com/ja/database)内の[コレクション](https://help.adalo.com/ja/glossary#collection)から動的（変わる）ビデオリンクを表示するために[マジックテキスト](https://help.adalo.com/ja/glossary#magic-text)を使用することができます。この手順では、YouTubeコンポーネントの設定の**ビデオURL**入力フィールドにリンクを貼り付けることにしましょう。

![YouTubeコンポーネントに静的リンクを貼り付ける](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-4d00109fe97279ea6baab23d18546c267f2f7066%2Fpaste%20in%20youtube%20link.gif?alt=media)

**5.)** ユーザーが画面を訪れた際にビデオを自動再生させるオプションや再生ボタンにクリックアクションを配置するオプションもあります。これはユーザーエンゲージメントや視聴履歴を追跡するのに役立ちます。

![自動再生とクリックアクション機能の場所](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-999929a7dcbd9534e906c0f3b19b35cfecf11265%2FScreen%20Shot%202021-09-01%20at%209.17.20%20AM.png?alt=media)
{% endtab %}
{% endtabs %}

## 例

YouTubeコンポーネントを使用すると、静的テキストまたはデータベースからのマジックテキストを使用して、ユーザーが公開または非公開のYouTubeビデオをアプリ内で直接視聴できます！このコンポーネントの動作例を見たり、この手順で使用された例を表示または複製するには、[こちらをクリックして](https://previewer.adalo.com/daa7bc64-c7aa-4e33-b74a-7a65fb73c2c7)ください。

## もっと詳しく

* カスタムリスト内でYouTubeコンポーネントを使用してビデオのプレイリストを作成することもできます。ただし、ビデオURLを含むテキストプロパティを持つコレクションがあることを確認してください。これを実際に見るには、この[サンプルアプリ](https://previewer.adalo.com/daa7bc64-c7aa-4e33-b74a-7a65fb73c2c7)をご覧ください。
* 任意の公開または非公開のYouTube URLを貼り付けることができます。ただし、プライベートリンクは現時点ではサポートされていません。
* 開始時刻などのリンクの末尾にあるパラメータは現在サポートされていません。

## ヘルプ

この記事に関する追加のヘルプが必要な場合は、いつでも[コミュニティフォーラム](https://forum.adalo.com/)で質問できます！投稿にこの記事へのリンクも貼り付けてください！

チュートリアルやヘルプドキュメントのリクエストがありますか？[お知らせください！](https://ideas.adalo.com/tutorial-requests)
