web-dev-qa-db-ja.com

TinyMCE4のステータスバーのパスを削除する

TinyMCEからTinyMCE4に移行しました。ステータスバーでパスを削除する方法を知りたいです。しかし、サイズ変更機能を持たせるために、ステータスバーを保持したいと思います。

TinyMCEを使用すると、次のことを実行できます。

tinymce.init({
    ...
    theme_advanced_path : false
});

TinyMCE4で同じ結果を得るにはどうすればよいですか？

ありがとう

pathtinymcestatusbaruistatusbartinymce-4
24
ChibiTomo

これは私にとってはうまくいきます：

_.mce-path {/* CSS */
    display: none !important;
}
_

編集：

TinyMCE4では、tinymce.init();にパラメーターを渡してパスを無効にすることによる正式な方法はないと思います。 _statusbar: false_を渡すことができますが、残念ながらパスとサイズ変更アイコンが非表示になります！

CSSを使用して私が出した答えは、パスを非表示にしますが、サイズ変更アイコンはそのままです。ただし、tinymce.init();に_statusbar: true_があることを確認してください

23
evilReiko

TinyMCE 4では、次のように構成要素のパスをfalseに設定することで、ステータスバーのパスのみを削除できます。

tinymce.init({ elementpath: false });
68
Beck Johnson
tinymce.init({
    statusbar : false,
8
kcsoft

CSSアプローチは機能しますが、通常はページ内の各エディターにグローバルに適用されます。 TinyMCE 3の古いオプションは、異なるエディターに個別に適用できました。

この柔軟性を維持したかったので、次の解決策を見つけました。

a）.myMceNoPath .mce-path{display:none;}のようなCSSルールを定義します

b）パスを表示せずにサイズ変更ハンドルを提供するエディターインスタンスの場合、次のオプションを定義します。

resize: "both", 
init_instance_callback : function (ed) {
    ed.getContainer().className += " myMceNoPath";
}

これにより、クラスが動的にエディター要素に追加され、この方法でマークされたエディターにのみCSSを適用できるようになります。

3
immo

残念ながら、この機能はTinyMCE 4では廃止されています。ただし、CSSを使用していつでもこれを視覚的にブロックできます。次のようになります。

.mce-path {
 display: none;
}
2
Alex Lapin
tinyMCE.init({
    menubar:false,
    statusbar: false,
        //etc
})

From： TinyMCE 4でメニューとステータスバーを削除する

1
Vasileios Karagkounis

TinyMCE 4の簡単な解決策の1つは、パス要素の不透明度を透明に設定することです。

tinymce.init({
    ...
    init_instance_callback: function (editor) {
        $(editor.getContainer()).find(".mce-path").css("opacity", "0");
    }
});

これにより、ステータスバーに影響を与えずにパステキストが非表示になります。 init（）関数またはCSS表示プロパティのいずれかを介してステータスバーの表示を無効にすると、Wordカウントが変動し、スクロールバーと重なるサイズ変更アイコンが表示されることもわかりました。

コールバックとCSSの概念を指摘したimmoなどの功績をたたえます。私はこの特定の（jQuery）ソリューションが好きです。自己完結型であり、その親エディターにのみ適用されますが、バリエーションは可能です。

1
Dustin Carr

Theme_advanced_statusbar_locationを空の文字列に設定するとうまくいきました。

tinyMCE.init({

    theme_advanced_statusbar_location : "",
})
1
Dawn T Cherian

鉱山は、上記のダスティンカーの不透明度の概念に基づいています。TinyMCE4の場合、skin.min.cssを検索してmce-path-itemを検索し、display:inline-blockの直後にopacity:0を追加しました。最終的にはdisplay:inline-block;opacity:0; *display...のようになります

Carrが言うように、それは簡単なトリックです。要素をクリックしても、要素はまだそこにあります。これは、標準ユーザーには表示されません。

それが誰かを助けることを願っています...

編集：mce-dividerでも同じです;）

0
McNaddy

@Dustin Carrの回答に感謝します。私は彼の答えを少し拡張しました、それは私がやったことです、それは私にとってはうまくいき、ユーザーがパスの領域にカーソルを合わせるとカーソルがまったく表示されません（不透明度0の場合、パスの上にカーソルを表示し、パスはクリック可能なままです）。

tinymce.init({

...
init_instance_callback: function (editor) {
$(editor.getContainer()).find(".mce-path").css("visibility", "hidden");
},

});

HTH

0
Konrud

TinyMCE v5を使用しています。そして以下の作品。パスを非表示にするには、initobjectで「elementpath」：falseを渡し、ステータスバー全体を非表示にするには「statusbar」：falseを渡します。ステータスバー全体を非表示にすると、高さを増減する機能も失われます。

0
NSR