コンテンツ作成者ガイド
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ハブ追加終了追加開始を開きます。追加終了

追加開始「追加終了追加開始すべて追加終了追加開始」の下には、インストール可能なすべてのコンテンツタイプのリストが表示されます。追加終了追加開始コンテンツタイプの詳細追加終了追加開始ページに進むには、任意のコンテンツタイプで[ 追加終了追加開始取得]を追加終了追加開始クリックします。追加終了

追加開始上の追加終了追加開始コンテンツの種類の詳細追加終了追加開始ページあなたは、各コンテンツタイプの詳細を読みscreenshootsとサンプルコンテンツを見ることができます。[ 追加終了追加開始インストール追加終了追加開始 ]をクリックして、選択したコンテンツタイプをインストールします。追加終了

追加開始コンテンツタイプがインストールされ、使用できるようになりました。[ 追加終了追加開始使用追加終了追加開始 ]をクリックしてエディタを開き、コンテンツの作成を開始します。追加終了

追加開始選択できるコンテンツタイプには、「追加終了追加開始すべて追加終了追加開始」と「追加終了追加開始コンテンツタイプ」の追加終了追加開始 2つのリストがあります。追加終了
追加開始 「追加終了追加開始自分のコンテンツタイプ追加終了追加開始」では、サイトにインストールしたすべてのコンテンツタイプのリストが表示されます。新しいコンテンツタイプをインストールすると、ここに表示されます。追加終了
追加開始「追加終了追加開始すべて追加終了追加開始」を選択すると、利用可能なすべての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のエディタとコードを貼り付けてください。

- ビジュアルエディタに戻り、埋め込んだコンテンツを表示します。

- ブログ投稿の編集を続け、いつものように保存してください。



