TinyMCEエディタ

TinyMCEテキストエディタはMoodleのエディタプラグインで、有効化、無効化、または管理>サイト管理>プラグイン>テキストエディタ>エディタの管理からデフォルトとして設定できます。

ユーザーはユーザーメニュー右上からTinyMCEエディター(デフォルトのエディターAttoよりも優先)を選択することもできます

エディタの折りたたみと展開

TinyMCEエディタが最初に表示されるのは1行のボタンだけです。左上のアイコンをクリックすると、3行に展開されます。

折りたたみビュー
拡大ビュー

ツールバーボタン

ツールバーに慣れていない人のために、ここにそれらの列にまとめられたボタンがあります。サイト管理者が追加のボタンを編集または提供できることを忘れないでください。

1行目

26tinymcerow1.png
1:展開 2.フォーマット 3.太字 4.イタリック
5.箇条書きリスト 6.番号付きリスト 7.リンクを追加 8.リンク解除
9.停止自動リンク 10.画像を追加する 11.絵文字を追加 12.メディアを追加する
13.埋め込みファイルの管理

行2

26tinymcerow2.png
1:元に戻す 2.やり直し下線 4.取り消し線
5.添え字 6.上付き 7.左寄せ 8.中央揃え
9.右寄せ 10.インデントを減らす 11.インデントを増やす 12.テキストカラー
13.背景色右に左左に右

行3

26tinymcerow3.png
1:フォントファミリー 2.Fontサイズ 3. HTMLを編集する 4.検索
5.検索/置換 6.折れないスペースを入れる 7.特殊文字を挿入する 8.挿入テーブル
9.面倒なコードをきれいにする 10.フォーマットを解除する 11.テキストとして貼り付ける MS Wordからの貼り付け
13.全画面表示を切り替える

カラーピッカー

  • 26colourpickers.png

フォントまたは背景色の選択には4つのレベルがあります。

  • 5 x 8色マトリックスのクイックピック
  • ピッカー、パレット、および名前付きタブにリンクしている「その他の色」

表を挿入

テーブルに罫線を追加する

セルの境界線は、読者が画面上の行をたどるのを支援するために不可欠です。まだ表示されていない場合は、次のように追加できます。

  1. テーブルを含むWikiページで、その[編集]タブをクリックします。
  2. テーブルのすべてのセルを慎重に選択してください
  3. 次に、選択部分の任意の部分を右クリック(Mac:Command +クリックまたはCtrl +クリック)してコンテキストメニューを表示します。そこからセル>テーブルセルのプロパティを選択します。その後、セルのプロパティダイアログボックスが表示されます。
  4. [詳細設定]タブをクリックし、[枠の色]を黒などに設定して[適用]をクリックし、[更新]をクリックします。
  5. 保存をクリックします。あなたのテーブルを含むWikiページはそのボーダーを表示してロードされます。

TinyMCEエディタ設定

TinyMCE HTMLエディタには、以下のオプションを含む独自の設定ページ[ 管理]> [サイト管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]> [全般]設定があります。

プラグイン

  • 方程式、顔文字、画像、メディア、自動リンク、および従来のスペルチェック用のボタンは、目をクリックすることで有効、無効、またはアンインストールできます。
  • さらに、方程式、絵文字、スペルチェックボタンには、設定画面へのリンクがあります。
"TinyMCEエディタプラグイン画面"
TinyMCEエディタプラグイン画面
埋め込みファイルを管理する

このプラグインを使用すると、現在のテキスト領域(ラベルやトピックの概要など)に埋め込まれているファイルを追加、削除、または上書きすることができます。 ( 埋め込みファイルリポジトリを補完します

ファイル管理ボタン
TinyMCE内から埋め込みファイルを管理する
方程式を挿入

[管理]> [サイトの管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]> [数式の編集]からアクセスすると、エディタコンテキストでTeXフィルタを有効または無効にして、[ドラッグ数式]ボタンを表示できます。グローバルカスタムTeXフィルタがある場合は、この設定を無効にします。

絵文字を挿入

[管理]> [サイトの管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]> [顔文字の挿入]の順に選択すると、エディタコンテキストで顔文字フィルタを有効または無効にして顔文字ボタンを表示できます。

レガシースペルチェッカー

従来のスペルチェッカーは、IE 9以下でのみ表示されますが、他のブラウザでは表示されません。あなたはそれを無効にすると、代わりにブラウザのスペルチェッカーの機能に依存している場合は、 管理者にその目をクリックすることで、従来のスペルチェッカプラグイン無効にすることでこれを行うことができます>サイト管理>プラグイン>テキストエディタ> TinyMCEのHTMLエディタ>一般設定

ブラウザでスペルチェックするには、単語を入力し(スペルが間違っていると赤い線が表示されます)、右クリックしてCtrl + Ctrlを押します。

ブラウザのスペルチェックのために右クリック+ CTRL

注:デフォルトのスペルエンジンはGoogleスペルであり、[ 管理]> [サイト管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]で変更できますが、これはGoogleではサポートされなくなり機能しません。 (IE9以前でのみ表示されていることに注意してください)これは削除される予定です。 MDL-38867を参照してください。ブラウザではスペルチェックをお勧めします。

PSpellを選択した場合は、aspell 0.50以降をサーバーにインストールし、aspellへのパスを[管理]> [サイトの管理]> [サーバー]> [システムパス]で設定する必要があります。

[ 管理]> [サイト管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]> [スペルチェック]から別のスペルエンジンを選択できます。


別のスペルエンジンを選択する

によると: http : //php.net/manual/en/book.pspell.php

"php 5.3以降。Pspellはサポートされなくなりました/バンドルされています。代わりに5.3でデフォルトでバンドルされているエンチャントを使用することができます。"

PSpellを選択した場合は、aspell 0.50以降をサーバーにインストールし、aspellへのパスを[管理]> [サイトの管理]> [サーバー]> [システムパス]で設定する必要があります。

エディタツールバーのカスタマイズ

管理者が削除または管理にエディタのツールバーのボックスを変更することにより、TinyMCEのエディタのツールバーにボタンを追加することができます>サイト管理>プラグイン>テキストエディタ> TinyMCEのHTMLエディタ>スクリーンキャストで示されているように一般的な設定は 2.4でテキストエディタをカスタマイズします

エディタツールバーボックス
水平方向の罫線ボタンが追加されたツールバーの例


利用可能なフォントリスト

デフォルトのフォントに加えて、サイト管理者はAdministration> Site administration>プラグイン>テキストエディタ> TinyMCE HTMLエディタ>スクリーンキャストで示されている一般設定のボックスに名前と文字列をタイプすることによって追加フォントを追加できます。

カスタムフォントの例

カスタム設定

[管理]> [サイト管理]> [プラグイン]> [テキストエディタ]> [TinyMCE HTMLエディタ]> [一般設定]の設定には、管理者がカスタムフォーマットを適用できるボックスがあります。例の詳細についてはMDL-37186を参照してください。またTinyMCE設定ページも参照してください。

例1:下部のツールバー
事例2:カスタムスタイル
  • 例:ツールバーを下に移動する:

以下を追加してください。

{"theme_advanced_toolbar_location" : "bottom"}
  • 例:独自のカスタムスタイルを追加する。

(これは、重要なメモ、キーポイントなどの「家のスタイル」が必要な場合などに便利です。)エディタのツールバーに「styleselect」と入力し、カスタムボックスに目的に合わせて次のコードを追加します。 :

{"style_formats" : [
 {"title" : "Bold text", "inline" : "b"},
 {"title" : "Red text", "inline" : "span", "styles" : {"color" : "#ff0000"}},
 {"title" : "Red header", "block" : "h1", "styles" : {"color" : "#ff0000"}} ]}

次の例では、ブートストラップベースのテーマを使用している場合は、ブートストラップCSSクラスを使用できます。

   {"style_formats" : [
       {"title" : "Well", "block" : "div", "classes" : "well"},
       {"title" : "Label", "inline" : "span", "classes" : "label"},
       {"title" : "Label - success", "inline" : "span", "classes" : "label label-success"},
       {"title" : "Label - warning", "inline" : "span", "classes" : "label label-warning"},
       {"title" : "Label - important", "inline" : "span", "classes" : "label label-important"},
       {"title" : "Label - info", "inline" : "span", "classes" : "label label-info"},
       {"title" : "Label - inverse", "inline" : "span", "classes" : "label label-inverse"},
       {"title" : "Button", "inline" : "a", "classes" : "btn btn"},
       {"title" : "Button - primary", "inline" : "a", "classes" : "btn btn-primary"},
       {"title" : "Button - info", "inline" : "a", "classes" : "btn btn-info"},
       {"title" : "Button - success", "inline" : "a", "classes" : "btn btn-success"},
       {"title" : "Button - warning", "inline" : "a", "classes" : "btn btn-warning"},
       {"title" : "Button - danger", "inline" : "a", "classes" : "btn btn-danger"},
       {"title" : "Button - inverse", "inline" : "a", "classes" : "btn btn-inverse"}
   ]}
  • 例:重要なスタイルを削除せずに、MS Word(tm)のスタイルでリッチコンテンツのコピーを有効にしてTineMCEに貼り付ける。
{"paste_retain_style_properties" : "margin, padding, width, height, font-size, 
  font-weight, font-family, color, text-align, ul, ol, li, 
  text-decoration, border, background, float, display"}

FirefoxとChromeでのTinyMCEのスピード

何人かのユーザーはTinyMCEの不当に遅いロードについて不満を言いました。たとえば、 https://moodle.org/mod/forum/discuss.php?d = 232089およびhttps://moodle.org/mod/forum/discuss.php?d = 223125のようになりますどうやら、 TinyMCEはFirefox(10〜20秒)の方がChrome(2〜3秒)よりもロードに時間がかかります。

TinyMCEをスピードアップするには、あなたの管理者アカウントからTinyMCEエディタ設定のすべてのプラグインを無効にすることを試みることができます:<moodleサイトアドレス> /admin/settings.php?section=editorsettingstinymce。それからエディタはすぐにロードされました。これは、絵文字を挿入するなど、マイナーな機能をいくつか取り除いていますが、一部のユーザーにとっては、絵文字を挿入する機能よりも読み込み速度がはるかに重要です。

スクリーンキャスト

TinyMCEテキストエディタの改良。

TinyMCE追加プラグイン

Moodle 2.4以降では、TinyMCEエディタを拡張し、 Moodleプラグインデータベースで利用可能な新しいプラグインに置き換えることができます 。これらのプラグインのいくつかは以下のとおりです。