online full example ejemplos editable path tinymce statusbar uistatusbar tinymce-4

path - full - tinymce plugins



Eliminar ruta en la barra de estado en TinyMCE4 (10)

Acabo de migrar de TinyMCE3 a TinyMCE4 y me pregunto cómo eliminar la ruta en la barra de estado. Pero quiero mantener mi barra de estado para poder cambiar el tamaño de la funcionalidad.

Con TinyMCE3 podemos hacerlo con:

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

¿Cómo puedo obtener el mismo resultado con TinyMCE4 ?

Gracias


tinymce.init({ statusbar : false,


Lamentablemente, esta característica está en desuso en TinyMCE 4 . Pero siempre puedes bloquear esto visualmente a través de CSS. Debe verse algo como esto:

.mce-path { display: none; }


Esto funciona para mí:

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

EDITAR:

En TinyMCE4 , no creo que haya una manera oficial de hacerlo pasando un parámetro a tinymce.init(); para deshabilitar la ruta Puede pasar la statusbar: false pero eso ocultará la ruta Y el ícono de cambio de tamaño, desafortunadamente!

La respuesta que di al utilizar CSS oculta la ruta, pero el ícono de cambio de tamaño permanece allí. Pero asegúrese de tener la statusbar: true en el tinymce.init();


El enfoque CSS funciona, pero generalmente se aplica globalmente a cada editor en la página. La opción anterior de TinyMCE 3 podría aplicarse individualmente para diferentes editores.

Quería mantener esta flexibilidad y encontré la siguiente solución:

a) Defina una regla CSS como .myMceNoPath .mce-path{display:none;}

b) Para una instancia de editor que debe proporcionar un identificador de cambio de tamaño sin visualización de ruta, defina las siguientes opciones:

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

Esto agrega dinámicamente una clase al elemento editor, lo que nos permite aplicar el CSS solo a los editores específicamente marcados de esta manera.


Una solución rápida en TinyMCE 4 es establecer la opacidad del elemento de ruta en transparente:

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

Esto debería ocultar el texto de la ruta sin afectar la barra de estado. Descubrí que la deshabilitación de la visibilidad de la barra de estado a través de la función init () o de la propiedad de visualización de CSS también genera un número de palabras flotantes y un icono de cambio de tamaño que se superpone a la barra de desplazamiento.

Crédito a inmo y a otros por señalar los conceptos de callback y CSS. Me gusta esta solución particular (jQuery) porque es autónoma y se aplica solo a su editor principal, aunque las variaciones son posibles.


El mío se basa en el concepto de opacidad de Dustin Carr anterior: para TinyMCE 4, skin.min.css , busqué skin.min.css mce-path-item y justo después de display:inline-block , agregué opacity:0 . Así que finalmente es algo así como display:inline-block;opacity:0; *display... display:inline-block;opacity:0; *display...

Es solo un truco rápido, como dice Carr: el elemento todavía está allí cuando hago clic en él, es solo que el usuario estándar no lo ve.

Espero que ayude a alguien ...

EDITAR: Lo mismo para mce-divider;)


Gracias a @Dustin Carr por su respuesta. He ampliado su respuesta un poco, eso es lo que hice, funciona bien para mí y cuando el usuario coloca el cursor sobre el área de la ruta, no muestra el cursor (con opacidad 0 muestra el cursor sobre la ruta y la ruta sigue siendo clicable).

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

HTH


En TinyMCE 4 puede eliminar solo la ruta en la barra de estado estableciendo el elemento de configuración path en false, así:

tinymce.init({ elementpath: false });


Establecer theme_advanced_statusbar_location para vaciar la cadena funcionó para mí.

tinyMCE.init({ theme_advanced_statusbar_location : "", })