¿Cómo crear un nuevo botón en cuadro de comentarios?

[curiosport]

Hola explicaré de otra forma mi problema:

En esta imagen vemos solo tres botones, Video, Imagen, Emoticon, al darles click nos aparece un cuadro adicional en que debemos poner el link y en el cuadro de texto nos saldrá el link + el código:

Código [Seleccionar] Expandir


Video= [video]link[/video]
Imagen= [img=link]



Ahora lo que yo quiero hacer es agregar un nuevo botón a ese cuadro pero no sé qué código poner (este es solo un ejemplo):




Y otra cosa es que cuando recargo la página eso se pierde, lo que yo quiero es que sea permanente pero solo en mi PC.

No quiero el cuadro adicional, quiero simplemente que al darle click  me salga automáticamente este código en el cuadro de texto :



Sorry si no se me entiende pero es que no sé mucho de programación.

PD: La página web no es mía.

Gracias.

[ivancea96]

No has dicho qué foro, blog, o lo que sea utilizas.
Si lo que quieres es hacerlo con HTML y JS, solo es poner un onclick en el botón, y agregar lo que necesitas al texto. ¿Cuál es tu pregunta?

[curiosport]

justo lo que dijiste es lo que quiero hacer.

CSS o HTML.

[eLank0]

Código [Seleccionar] Expandir

<button>Texto</button>

Usando jQuery tendría una estructura similar a:

Código [Seleccionar] Expandir

$('button').click(Stronger);

var Stronger = function(e) {
         $(tuElement).css('font-weight', 'bolder');
}

Esto es sólo un ejemplo rápido y sencillo, hay mil y una maneras de hacerlo, con jQuery y sin.

Salu2

[curiosport]

hay mil y una maneras de hacerlo, con jQuery y sin.

Ahm, pero de donde saco el icono? en que momento pongo Inspeccionar elemento para ejecutar el comando? en que lugar pongo esto:

Sorry es que no sé mucho de estos códigos.
Gracias.

[curiosport]

No has dicho qué foro, blog, o lo que sea utilizas.

Uhm te sirve el código?

<div class="markItUpHeader">
<ul>
<li class="markItUpButton markItUpButton1 mark-youtube">
<a href="" title="Insertar video (Ctrl+Y)">Insertar video (Ctrl+Y)</a>
</li>
<li class="markItUpButton markItUpButton2 mark-image">
<a href="" title="Agregar Imagen">Agregar Imagen</a>
</li>
<li class="markItUpButtonmarkItUpButton3 mark-emoji">
<a href="" title="Insertar Emoticon">Insertar Emoticon</a>
</li>
</ul>
</div>

Ahí está el código solo para 3 Botones (Video, Imagen Emoticon).
Espero que me puedas ayudar a crear un cuarto Botón de Negrita.
Gracias.

[engel lex]

para agregar el boton con jquery sería algo así

Código (javascript) [Seleccionar] Expandir

$(".clase_del_div ul").append('<li>aquí el código respectivo al boton</li>');

ese codigo debe tener una función que hará algo como

Código (javascript) [Seleccionar] Expandir

$("textarea").val($("textarea").val()+"[b][/b]")

sin embargo tienes que ver como estructuras eso y que los selectores (lo que está dentro de $(" ") ) están correctamente apuntados

[curiosport]

Hola!!!  Estuve  analizando todo el objeto de la caja de comentarios con el inspeccionar elemento y "logré" crear un "script"  que no solo me permitía agregar el botón de Negrita sino que también el botón de cursiva, cuando ya hallas el código de Negrita crear el de Cursiva es realmente muy fácil, pero me he topado con TRES PROBLEMAS bastante raros por cierto y por ahora iré solo con el primer problema:

Hay tres cuadros de comentarios:

MP, Shout's, Post's  (los dos últimos están relacionados y el MP es independiente al resto).

Y por cada cuadro de comentarios hay un problema (lo que da un total de tres problemas).

Primer problema  (en los MP):

Normalmente se ve así:

http://i.imgur.com/hKXH5Km.png



Y cuando ejecuto este código desde la consola:

Código [Seleccionar] Expandir

settingsComment.markupSet.unshift
({name:lang['Negrita'], beforeInsert: markButtons.bold, action: 'bold', key: 'B', openWith: '[b]', closeWith: '[/b]', className: "mark-bold"},
{name:lang['Cursiva'], beforeInsert: markButtons.italic, action: 'italic', key: 'I', openWith: '[i]', closeWith: '[/i]', className: "mark-italic"});
var clone = $('#nbody_fastreply').clone();
$('#nbody_fastreply')
   .parents('.nmarkitfastreply')
   .replaceWith(clone);
$('#nbody_fastreply').markItUp(settingsComment);

Pasamos a verlo así:

http://i.imgur.com/kfsq3Dw.png



Y todos los botones funcionan OK, excepto el último,  los emoticones.

Se supone que cuando doy clic en ese icono debería salir esto:

http://i.imgur.com/hi2779m.png



Pero el emoticón no responde y no despega la lista de emoticones  

Ahora, cuando guardo ese código en el GreaseMonkey para que se ejecute automáticamente,  sucede esto:

http://i.imgur.com/In0jVMW.png



Y el icono de emoticones sigue sin funcionar.

El problema me parece que está en la función clon del código antes mencionado, pero de ahí ya no tenga idea, repito... no sé programar en este lenguaje, simplemente usé mi lógica y con un poco de investigación llegué acá, pero ya no puedo más  

PD: Si es necesario, les puedo brindar una cuenta clon de dicha página web.

Gracias.

CHUCHOREA MANDA SALUDOS.