コンテンツ作成者ガイド
H5Pのコンテンツを作成しようと考えている方のためのガイドです。
基本
H5Pを使用すると、Webページ上でリッチなインタラクティブコンテンツを簡単かつ迅速に作成できます。
このドキュメントでは、以下の方法について説明します。
- 既存のH5Pコンテンツをアップロードする
- H5Pコンテンツの編集
- 新しいH5Pコンテンツを作成する
既存のH5Pコンテンツをアップロードする
開始する方法の1つは、h5p.orgのサンプルとダウンロードページからH5Pコンテンツタイプを選択することです。コンテンツの左下にあるダウンロードアイコンをクリックして、サンプルコンテンツのいずれかをダウンロードします。
これで、このファイルをH5Pハブ経由でサイトにアップロードできます。以下は、これを行う方法に関する説明です：
プラットフォームの管理メニューで次の項目を選択します。
- Drupal：コンテンツの追加 > インタラクティブコンテンツ
- WordPress：H5Pコンテンツ > 新規追加
- Moodle：活動またはリソースを追加する > インタラクティブコンテンツ
[ コンテンツタイプの選択]をクリックして、H5Pハブを開きます。
上部の[ アップロード ]タブをクリックして、既存の.h5pファイルをアップロードします。
アップロードするファイルを選択し、「使用」をクリックします。
エディタがロードされ、H5Pコンテンツの編集を開始できます。
一番上のリンクは、選択したコンテンツタイプについて、削除開始h5p.orgのTurtorials削除終了とExample Contentの削除開始ページに削除終了削除開始移動削除終了削除開始します。削除終了
新しいH5Pコンテンツを作成する
プラットフォームの管理メニューで次の項目を選択します。
- 削除開始Drupal：コンテンツの追加>インタラクティブコンテンツ削除終了
- 削除開始ワードプレス：H5Pコンテンツ>新規追加削除終了
- 削除開始Moodle：アクティビティまたはリソースを追加する>インタラクティブコンテンツ 削除終了
新しいH5Pコンテンツを作成するには、最初にコンテンツタイプをインストールする必要があります。以下は、H5Pハブを使ってこれを行う方法の説明です：
サイトのH5Pコンテンツを編集する
既存のH5Pコンテンツをアップロードした後、内蔵のエディタを使用して編集できます。
- Drupal：H5PノードのEditボタンを押します。
- WordPress：H5Pインスタンスの編集ボタンを押します。
- Moodle：H5Pインスタンスの横にあるEdit / Edit Settingsリンクを押します。
Editを押すと、次のようなエディタが表示されます。
ここでは、H5Pのすべてのフィールドを編集できます。保存するとH5Pも更新されます。上部にある「チュートリアル」リンクと「例」リンクを使用して、このコンテンツタイプの詳細と使用法の例をご覧ください。
標準エディタでは、すべてのフィールドが順番に表示されます。高度なコンテンツの場合、これはすぐに維持することが困難になります。エディタを拡張することは、標準的な機能を拡張する（つまり、リストのタブ付きビューを提供するなど）エディタライブラリを介してサポートされるか、完全なWysiwyg編集エクスペリエンスを提供することができます。以下は、プレゼンテーションエディタとインタラクティブビデオエディタの簡単な例です。
H5Pコンテンツの作成についてもっと知りたいですか？見てみましょう チュートリアル では 、コンテンツ作成者ガイドを。
H5Pコンテンツを埋め込む
h5p.org（または他のサイト）で作成されたH5Pコンテンツは、あなたのサイトに埋め込むことができます。コンテンツの下にある[埋め込み]ボタンを押してコードをサイトにコピーするだけです。
以下は、WordPressのブログ記事にH5Pコンテンツを埋め込む方法の例です：
- 埋め込みたいコンテンツの下にある[埋め込み]リンクをクリックします。
- コードをコピーします。
- WordPressのブログのポストエディタswith to Textualのエディタとコードを貼り付けてください。
- ビジュアルエディタに戻り、埋め込んだコンテンツを表示します。
- ブログ投稿の編集を続け、いつものように保存してください。
H5Pを使用すると、Webページ上でリッチなインタラクティブコンテンツを簡単かつ迅速に作成できます。
このドキュメントでは、以下の方法について説明します。
- 既存のH5Pコンテンツをアップロードする
- H5Pコンテンツの編集
- 新しいH5Pコンテンツを作成する
既存のH5Pコンテンツをアップロードする
開始する方法の1つは、h5p.orgのサンプルとダウンロードページからH5Pコンテンツタイプを選択することです。コンテンツの左下にあるダウンロードアイコンをクリックして、サンプルコンテンツのいずれかをダウンロードします。
これで、このファイルをH5Pハブ経由でサイトにアップロードできます。以下は、これを行う方法に関する説明です：
プラットフォームの管理メニューで次の項目を選択します。
- Drupal：コンテンツの追加 > インタラクティブコンテンツ
- WordPress：H5Pコンテンツ > 新規追加
- Moodle：活動またはリソースを追加する > インタラクティブコンテンツ
[ コンテンツタイプの選択]をクリックして、H5Pハブを開きます。
上部の[ アップロード ]タブをクリックして、既存の.h5pファイルをアップロードします。
アップロードするファイルを選択し、「使用」をクリックします。
エディタがロードされ、H5Pコンテンツの編集を開始できます。
一番上のリンクは、選択したコンテンツタイプについて、追加開始h5p.org追加終了追加開始のTurtorials追加終了とExample Contentの追加開始ページに移動します。追加終了
新しいH5Pコンテンツを作成する
プラットフォームの管理メニューで次の項目を選択します。
- 追加開始Drupal：コンテンツの追加 > インタラクティブコンテンツ追加終了
- 追加開始WordPress：H5Pコンテンツ > 新規追加追加終了
- 追加開始Moodle：活動またはリソースを追加する > インタラクティブコンテンツ 追加終了
新しいH5Pコンテンツを作成するには、最初にコンテンツタイプをインストールする必要があります。以下は、H5Pハブを使ってこれを行う方法の説明です：
サイトのH5Pコンテンツを編集する
既存のH5Pコンテンツをアップロードした後、内蔵のエディタを使用して編集できます。
- Drupal：H5PノードのEditボタンを押します。
- WordPress：H5Pインスタンスの編集ボタンを押します。
- Moodle：H5Pインスタンスの横にあるEdit / Edit Settingsリンクを押します。
Editを押すと、次のようなエディタが表示されます。
ここでは、H5Pのすべてのフィールドを編集できます。保存するとH5Pも更新されます。上部にある「チュートリアル」リンクと「例」リンクを使用して、このコンテンツタイプの詳細と使用法の例をご覧ください。
標準エディタでは、すべてのフィールドが順番に表示されます。高度なコンテンツの場合、これはすぐに維持することが困難になります。エディタを拡張することは、標準的な機能を拡張する（つまり、リストのタブ付きビューを提供するなど）エディタライブラリを介してサポートされるか、完全なWysiwyg編集エクスペリエンスを提供することができます。以下は、プレゼンテーションエディタとインタラクティブビデオエディタの簡単な例です。
H5Pコンテンツの作成についてもっと知りたいですか？見てみましょう チュートリアル では 、コンテンツ作成者ガイドを。
H5Pコンテンツを埋め込む
h5p.org（または他のサイト）で作成されたH5Pコンテンツは、あなたのサイトに埋め込むことができます。コンテンツの下にある[埋め込み]ボタンを押してコードをサイトにコピーするだけです。
以下は、WordPressのブログ記事にH5Pコンテンツを埋め込む方法の例です：
- 埋め込みたいコンテンツの下にある[埋め込み]リンクをクリックします。
- コードをコピーします。
- WordPressのブログのポストエディタswith to Textualのエディタとコードを貼り付けてください。
- ビジュアルエディタに戻り、埋め込んだコンテンツを表示します。
- ブログ投稿の編集を続け、いつものように保存してください。