Hola ,es mi primer aporte ,he buscado ,por que al principio ,no lo sabía hacer xD ,pero lo descubrí y ahora os lo dejo
Nombre : Cómo añadir ,cosas al Editor ,Por Ej, el famoso "Spoiler"
Nivel: Fácil
Requisitos: FTP ,y hacer Backups ,cuando se necesite.

1er paso : Nos bajamos ,los siguientes archivos ,de nuestro FTP:

TUFORO/jscripts/editor.js

Y

TUFORO/jscripts/editor_themes/Office_2007/stylesheet.css

2º paso

Con el photoshop ,o cualquier programa de diseño ,hacemos un logo para spoiler ,yo hice una "S" fea ,la podéis ver en el adjunto.
y cuando lo terminéis la subís a :
TUFORO/jscripts/editor_themes/office_2007/images

3er Paso

Abrimos el editor.js y agregamos una línea ,en donde queráis ponerla , por ej:
Yo lo agregué despues de el botón de IMG :

Quote: this.createToolbar('insertables', {
container: 'bottom',
alignment: 'right',
items: [
{type: 'button', name: 'list_num', sprite: 'list_num', insert: 'list', extra: 1, title: this.options.lang.title_numlist},
{type: 'button', name: 'list_bullet', sprite: 'list_bullet', insert: 'list', title: this.options.lang.title_bulletlist},
{type: 'separator'},
{type: 'button', name: 'img', sprite: 'image', insert: 'image', extra: 1, title: this.options.lang.title_image},
{type: 'button', name: 'spoiler', sprite: 'spoiler', insert: 'spoiler', title: 'Oculta algo'},
{type: 'button', name: 'url', sprite: 'link', insert: 'url', title: this.options.lang.title_hyperlink},
{type: 'button', name: 'email', sprite: 'email', insert: 'email', extra: 1, title: this.options.lang.title_email},
{type: 'separator'},
{type: 'button', name: 'quote', sprite: 'quote', insert: 'quote', title: this.options.lang.title_quote},
{type: 'button', name: 'code', sprite: 'code', insert: 'code', title: this.options.lang.title_code},
{type: 'button', name: 'php', sprite: 'php', insert: 'php', title: this.options.lang.title_php}
]
});

Así debería de quedar

4º Paso:
Abrimos el Stylesheet.css y vamos al final del todo y agregámos:
.messageEditor .toolbar_button .toolbar_sprite_spoiler {
background: url('images/spoiler.gif') no-repeat;
}
-----------
donde pone :
.messageEditor .toolbar_button .toolbar_sprite_(spoiler)
"Spoiler" sin los () ,ponemos el nombre del botón ,el que hemos puesto en el editor.js
----------
donde pone:
background: url('images/spoiler.gif') no-repeat;
}
lo rojo lo cambiáis ,por la dirección de la imagen

5º Paso

Vamos a nuestro FTP , hacemos una Backup de los siguientes archivos ,editor.js y stylesheet.css

6º Paso:

Subimos a nuestro FTP ,el editor.js y el stylesheet.css ,los que hemos editado, y ya debe de funcionar.

Ahora mirad las capturas que os he dejado
Cambie la descripción a Otaku_Col ,para que veráis ,que si funciona ,xDD
Éste es mi primer aporte , 100% Hecho por Mí! no os quejéis mucho xDD

Muy bueno. Está bien explicado. Ya lo había hecho, pero con este tutorial, queda de maravilla.

Mi problema son los botones, ya que los que hice se ven medio feos, no combinan.

jaja ,eso es verdad xD ,me pasa lo mismo xD

gracias funciona correctamente, pero para aquellos no quieran sus mycode mezclados con otros agan esto:
en el archivo editor.js busquen:

		// Create our new text area

luego agregen :

       this.createToolbar('mytoolbar', {
           container: 'bottom',
           items: [
              {type: 'button', name: 'nombre_del_boton', sprite: 'nombre_del_boton', insert: 'nombre_del_boton', title: 'Lo que hace el boton'}

    ]
});

y se creara una linea nueva con los botones que agregues, luego sigan el tutorial de otaku_col

* si quieren agregar mas botones no se olviden de la " , " al final de la nueva linea ejem:

this.createToolbar('mytoolbar', {
container: 'bottom',
items: [
{type: 'button', name: 'youtube', sprite: 'youtube', insert: 'youtube', title: 'Inserta videos de Youtube'},
{type: 'button', name: 'megavideo', sprite: 'megavideo', insert: 'megavideo', title: 'Inserta videos de Megavideo'},
{type: 'button', name: 'spoiler', sprite: 'spoiler', insert: 'spoiler', title: 'Oculta Textos y/o Imagenes'}
]
});

*siempre la ultima linea no deve llevar ,

31 Jul, 2010, 2:54 pm lluquel wrote:
gracias funciona correctamente, pero para aquellos no quieran sus mycode mezclados con otros agan esto:
en el archivo editor.js busquen:

		// Create our new text area

luego agregen :

       this.createToolbar('mytoolbar', {
           container: 'bottom',
           items: [
              {type: 'button', name: 'nombre_del_boton', sprite: 'nombre_del_boton', insert: 'nombre_del_boton', title: 'Lo que hace el boton'}

    ]
});

y se creara una linea nueva con los botones que agregues, luego sigan el tutorial de otaku_col

* si quieren agregar mas botones no se olviden de la " , " al final de la nueva linea ejem:

this.createToolbar('mytoolbar', {
container: 'bottom',
items: [
{type: 'button', name: 'youtube', sprite: 'youtube', insert: 'youtube', title: 'Inserta videos de Youtube'},
{type: 'button', name: 'megavideo', sprite: 'megavideo', insert: 'megavideo', title: 'Inserta videos de Megavideo'},
{type: 'button', name: 'spoiler', sprite: 'spoiler', insert: 'spoiler', title: 'Oculta Textos y/o Imagenes'}
]
});

*siempre la ultima linea no deve llevar ,

Muy bueno ,lo agregaré ,pero puedes mostrar una imagen ,para que sea más fácil?

a mi no me reconose las imagenes sale en blanco alguien sabe porque?

A lo mejor no haz subido la imagen a "TUFORO/jscripts/editor_themes/office_2007/images" o el nombre que tenga ,y si no dale donde esta el boton ,click derecho y dale a "Ver Imagen" y si te sale el error 404 ,es que no guardaste la imagen
Edito: me equivocé xD

la imagne la subi a mi foro /images no era ahi? me sale en blanco nadamas

dale donde esta el boton ,click derecho y dale a "Ver Imagen" y si te sale el error 404 ,es que no guardaste la imagen. y miras la URL y la guardas

Está un poco complicado seguir el tuto, uno de estos días haré el mismo pero más documentado.