TinyMCE 4 Añadir código css personalizado a menú editor

Inicio Forums Ayuda / Ajuda / Laguntza / Axuda / Help TinyMCE 4 Añadir código css personalizado a menú editor

Tagged: 

This topic contains 2 respuestas, has 2 voices, and was last updated by  SagoWeb Hace 6 años, 7 meses.

  • Author
    Entradas
  • #29500

    SagoWeb
    Member

    Hola,

    He creado unas cajas personalizadas para usarlas en exelearning (añadiendo el código en nav.css y content.css) y funcionan bien, pero quería facilitar su inserción en el contenido, añadiendo una entrada personalizada en el código del editor tinymce.

    Siguiendo las instrucciones de internet: https://www.tinymce.com/docs/demo/format-custom/ he puesto el código de ejemplo y funciona.

    Pero no consigo que el mío personalizado se cargue, ya que aunque siempre me dice que hay error de sintaxis.

     

    Este es el código que he intentado poner en settings js de tinymce 4:

    { title: ‘Caja-autor’, block : ‘div’, styles: { display: ‘inline-block’ , height: ‘auto’ , margin: ‘1rem’ , position: ‘relative’ , top: ‘50%’ , left: ‘50%’ , transform: ‘translate(-50%, 0)’ , max-width: ‘700px’ , width: ‘100%’ , padding-left: ’35px’ , padding-top: ’45px’ , padding-bottom: ’35px’ , padding-right: ’35px’ , background-repeat: ‘no-repeat’ , background-position: ‘right bottom’ , background-image: ‘url(https://s3-eu-west-1.amazonaws.com/autor.png)’, border-top: ’40px solid #e32526′ , border-bottom: ‘1px solid #655d5d80’ , border-left: ‘1px solid #655d5d80’ , border-right: ‘1px solid #655d5d80’ , box-shadow: ‘0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)’ , transition: ‘all 0.3s cubic-bezier(.25,.8,.25,1)’ } },

     

    Alguna solución.Lo que quisiera es que al seleccionar un texto en exelearning se aplicase como div (y no span que es lo que me hace ahora, y tengo que ponerlo manualmente en el código)

    No soy programadora y estoy muy perdida con estos códigos.

    Muchas gracias por vuestro tiempo

    Un saludo

    Ángeles

     

    SOLUCIONADO

    Pongo la solución por si es de interés para alguien que sea despistado/a como yo ; ):

    Me faltaba poner ‘ en los códigos:

    • Antes: border-right: ‘1px solid #655d5d80’
    • Ahora: ‘border-right’: ‘1px solid #655d5d80’

    YA FUNCIONA

    Gracias

    • This topic was modified Hace 6 años, 7 meses by  SagoWeb. Reason: Solucinado
  • #29505

    Ignacio Gros
    Keymaster

    Me alegra que lo hayas resuelto. Gracias por compartir la solución.

    Si quieres, para no tener que sobrescribir ese archivo, que es de eXe, puedes incluir ese código en tu propio Estilo usando la etiqueta ‘edition-extra-head’ en el fichero config.xml. Adjunto el fichero config.xml de MAX con ese cambio (sustituye ese archivo en el Estilo MAX, luego elige ese Estilo y añade un iDevice). Lo suyo es que lo hagas en un Estilo propio, no en uno de los de eXe. Por si prefieres hacerlo así…

    Saludos.

    Archivos adjuntos:
    You must be logged in to view attached files.
  • #29510

    SagoWeb
    Member

    Hola Ignacio,

    Gracias por el archivo, desconocía que podía realizarse ese cambio en el archivo config.

    El estilo que estoy modificando es un propio a partir de una copia de los de exe, dónde he añadido un css en nav y content, completamente modificado.

    ¡¡¡ Muchas gracias !!!

    Buen fin de semana

    Ángeles

     

You must be logged in to reply to this topic.

Skip to content