Home > General > Remover estilo o formato en TinyMCE

En la mayoria de proyectos al desarrollar la parte de la administracion de contenidos el problema que se me presentaba era al copiar conetenidos de word ya que este agregaba estilos propios que al pegarlos hacen que aumenten el codigo y la otra que al visualizarlo se vea de manera incorrecta.

En la mayoría de proyectos al desarrollar la parte de la administración de contenidos el problema que se me presentaba era al copiar contenidos de Word ya que este agregaba estilos propios que al pegarlos hacen que aumenten el código y la otra que al visualizarlo se vea de manera incorrecta.

En TinyMCE existe una directiva llamada “valid_styles” al ser una opción no documentada comúnmente se usa de la siguiente manera

valid_styles : 'color,font-size,font-weight,font-style,text-decoration',

pero esta siendo usada de mala menara por que se debe de manejar como un arreglo

valid_styles : { '*' : 'color,font-size,font-weight,font-style,text-decoration'},

Al examinar el código se define que el  primer atributo define qué elementos se aplica a (en este caso * lo es todo), y el segundo atributo es la lista de estilos CSS permitidos.

Así, un ejemplo de configuración completa podría ser algo como esto:

$('textarea').tinymce({
  // Location of TinyMCE script
  script_url : '../tinymce/jscripts/tiny_mce/tiny_mce.js',
  mode : "textareas",
  theme : "advanced",
  skin : 'o2k7',
  skin_variant : 'silver',
  plugins : "paste,table,contextmenu",
  theme_advanced_buttons1 : "fontsizeselect,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,code,|,help",
  theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,removeformat,cleanup,|,undo,redo,|,outdent,indent,blockquote,|,bullist,numlist,|,link,unlink",
  theme_advanced_buttons3 : "tablecontrols",
  theme_advanced_toolbar_location : "top",
  theme_advanced_layout_manager : "SimpleLayout",
  theme_advanced_toolbar_align : "left",
  theme_advanced_path : "false",
  theme_advanced_statusbar_location : "bottom",
  theme_advanced_resizing : true,
  cleanup_on_startup : false,
  fix_list_elements : false,
  fix_nesting : false,
  fix_table_elements : false,
  valid_styles : {'*' : 'color,font-size,font-weight,font-style,text-decoration'},
  paste_use_dialog : true,
  paste_auto_cleanup_on_paste : true,
  extended_valid_elements : "a[name|href|target|title|onclick],img[src|border=0|alt|title|hspace|vspace|width|height|align],hr[width|size|noshade],font[size|color|style],span[align|style],h1,h2,h3,h4,h5,h6",
  content_css : "/wysiwyg_editor_rendering.css"
});