16.1. イメージをテキストに挿入する

16.1.1. イメージファイルを選択する

同じ機能を使用して2種類の方法でイメージをテキストに追加できます:

  1. オンライン上の他の場所で利用可能なイメージにリンクします。

  2. あなたがMaharaに保存しているイメージを使用します。

注釈

イメージをテキストに簡単に追加することができます。しかし、リンクまたはアップロードするイメージを使用する権限があることを確認してください。

Insert an image into text

イメージをテキストに挿入する

  1. ビジュアルエディタに移動して イメージ ボタン tinymce_image をクリックしてください。

  2. イメージURL:外部イメージへのイメージURLをこのフィールドに貼り付けるか入力します。http:// または https:// で始まる必要があります。手順7に進むことができます。Maharaからイメージを挿入する場合は、次の手順でURLが自動的に追加されます。

  3. ファイル エリア: イメージを選択するファイルエリアを選択します:

    • マイファイル: あなたが作成したフォルダおよびファイルすべてが表示されます。

    • グループファイル: あなたが公開できるフォルダおよびファイル すべてが表示されます。

    • インスティテューションファイル: あなたがインスティテューション管理者の場合、インスティテューションフォルダおよびファイルが表示されます。

    • サイトファイル: あなたがサイト管理者の場合、すべてのサイトフォルダおよびファイルが表示されます。そうでない場合、あなたには サイトファイル 内の パブリック フォルダのみ表示されます。

  4. ライセンス情報: サイト管理者が ライセンスメタデータ を有効にしている場合、これらのフィールドが表示されます。また、インスティテューション内にいる場合は、インスティテューション管理者が ライセンスの提供を要求することがあります

    • ライセンス: あなたのデフォルトライセンスが表示されます。あなたのデフォルトライセンスを アカウント設定 で設定することができます。あなたはアーティファクトに関して個別に異なるライセンスを選択できます。

    • ライセンサ: 誰かが作成したファイルをアップロードする場合、あなたはここで作品に例えば氏名等の謝辞を提供できます。

    • オリジナルURI: あなたが他の人のファイルをアップロードする場合、他のユーザがアクセスしてオリジナルファイルを閲覧できるよう、オリジナルのインターネットアドレスを提供します。

  5. サイト管理者が イメージリサイズオプション を有効にした場合、イメージが指定されたサイズより大きい場合にリサイズするかどうか指定できます。あなたのポートフォリオのスペースを節約するためにこのオプションをお勧めします。

  6. ファイル: あなたのファイルをアップロードするために コンテンツファイル エリアに戻る必要はありません。あなたはこの画面より直接アップロードできます。

  7. フォルダパス: パンくずリストは現在のあなたの場所を示します。あなたがファイルをアップロードする場合、このフォルダ内に置かれます。

  8. 編集 ボタンをクリックすると、フォルダやファイルのコンポーネント、名前、説明、タグなどを変更できます。フィードバックのために送信したページに含まれているフォルダやファイルがある場合は、編集できません。

  9. あなたが選択したいファイルが含まれる行をクリックします。

  10. : イメージの幅を変更します。イメージが正しく認識されると、イメージのサイズ(ピクセル単位)が直接表示されます。

    注釈

    イメージのサイズは、レスポンシブデザインに対応するためにイメージの幅に設定された幅よりも小さい場合に自動的に縮小されます。

  11. 垂直スペース: イメージの上下にさらに (ピクセルで) スペースを追加してください。

  12. 水平スペース: イメージの左右にさらに (ピクセルで) スペースを追加してください。

  13. 罫線の幅: イメージに単純な黒の罫線を追加します。ここではその枠線の幅を選択できます。

  14. 配置: テキストとの関係でイメージを配置する場所を決めます。

  15. スタイル(CSS): 基本設定以外の変更を行う場合は、CSSスタイル情報を追加します。上記の変更を行った場合は、このフィールドに配置されますので、ここで直接変更することができます。

  16. あなたの変更を保持したい場合、送信 ボタンをクリックしてください。代わりにイメージの挿入を中断したい場合、キャンセル をクリックしてください。

  17. イメージの挿入を中断したい場合、 クローズ ボタン をクリックします。

イメージがどのように表示されているか不満な場合は、それを選択します(小さな四角いハンドルが表示されます)。もう一度イメージボタンtinymce_imageをクリックして調整します。

16.1.2. Base64イメージを使用する

HTMLエディタを使用できるテキストエリアに base64 でエンコードされたイメージファイルを挿入することができます。

Insert a base64 image via the HTML editor in the visual editor

ビジュアルエディタのHTMLエディタを使用してbase64イメージを挿入する

  1. イメージをbase64でエンコードするように変換します。あなたはそれをオンラインで行うことができるいくつかのウェブサイトがあります。エンコードされたイメージをコピーします。

  2. ビジュアルエディタに移動し、HTMLアイコンのHTMLアイコンをクリックします。

  3. base64イメージをイメージとして認識させるには、イメージタグに配置する必要があります。イメージタグの先頭に <img src =" と入力します。

  4. base64でエンコードされたイメージを貼り付けます。これは data:image で始まる文字列です。

  5. ブラウザがイメージの終わりを知るようにイメージタグを閉じます: " />

  6. OK ボタンをクリックしてビジュアルエディタに戻ります。イメージタグを正しく挿入すると、イメージが表示されます。

  7. イメージを選択して イメージ アイコン tinymce_image をクリックすることで、イメージのサイズと位置を変更できます。

  8. 保存 ボタンをクリックすると、ページ編集画面に戻ります。