Editor de contenidos

cmc · #1 (**permalink**) 13/03/2006, 19:47

Hola luego de haber pasado por todo el foro buscando un editor de contenidos que utilice css y no haberlo encontrado me resigno y tendre que hacerlo desde cero.

La idea es hacer una caja de texto donde el usuario ingrese un contenido.

Y aca la primer pregunta, ¿Es posible saber cual es el texto seleccionado por el usuario?

cmc · #2 (**permalink**) 15/03/2006, 13:41

Hola: tengo este codigo que logra casi lo que quiero hacer, pero (siempre existe un pero jeje) la idea es que no me muestre las etiquetas dentro de la caja de texto sino al texto formateado.

¿Que tendria que cambiar?

Gracias a "Turka" por el codigo, te mande un mensaje al privado.

caricatos · #3 (**permalink**) 15/03/2006, 13:56

¡Aquí falta algo...!

cmc · #4 (**permalink**) 15/03/2006, 14:01

Un detalle el codigo !!!!

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento sin t&iacute;tulo</title>
<script languaje="javascript">
function codigo(numero) {
etiquetas = new Array('<span class="negrita">','<span>','[i]','[/i]','[u]','[/u]');
seleccion = document.selection.createRange().text;
if (seleccion) {
document.selection.createRange().text = etiquetas[numero] + seleccion + etiquetas[numero+1];
form1.texto.focus();
seleccion = '';
return;
}

else {
insertar.mensaje.value += etiquetas[numero] + "texto" + etiquetas[numero+1] + " ";
form1.texto.focus();
return;
}
}
</script>
<style type="text/css">
<!--
.negrita {
	font-weight: bold;
}
.ítalica {
	font-style: oblique;
}
.tamaño_chico {
	font-size: 9px;
}
.tamaño_mediano {
	font-size: 10px;
}
.tamaño_grande {
	font-size: 12px;
}
.rojo {
	color: #FF0000;
}
.negro {
	color: #333333;
}
.celeste {
	color: #66CCFF;
}
-->
</style>
</head>

<body>
<form name="form1" method="post" action="">
  <textarea name="texto" cols="60" rows="10" id="texto"></textarea>
  <input type="button" value="Negrita" onClick="codigo(0)">
</form>
</body>
</html>

caricatos · #5 (**permalink**) 15/03/2006, 14:33

Hola:

Era eso... No estoy seguro, pero me parece que en mozilla no va...

Si te interesa una alternativa, fíjate en esta página: http://www.pepemolina.com/editor/index.html

Saludos

cmc · #6 (**permalink**) 16/03/2006, 06:13

Hola Caricatos: en principio gracias por responder, te cuento que cuando empece con todo esto lo primero que encontre fue ese link lo baje pero la verdad es que no lo pude modificar en funcion de lo que necesitaba, mi idea es utilizar los css, se puede, desde ya si me das una pista sobre mi post o sobre su archivo la verdad que si es sobre el mio mucho mejor asi lo termino de entender.

caricatos · #7 (**permalink**) 16/03/2006, 10:45

Es muy fácil...

Indica que estilos quieres y te contesto...

Saludos

cmc · #8 (**permalink**) 16/03/2006, 14:22

tengo que generar unos ocho estilos, por ejemplo

Estilo1: Negritas
Estilo2: Italica
Estilo3: Subrrayado
Estilo4: Color rojo
Estilo5: Color negro
Estilo6: Tamaño8
Estilo7: Tamaño10
Estilo8: Tamaño 12

¿Como seria?

caricatos · #9 (**permalink**) 16/03/2006, 14:54

Bueno, Simplificando podrás ver el código del entrecomillado:

Código:

function entrecomillar()	{
	_insertar(elEditor, '"' + prompt("entrecomillar", _lector()) + '"');
}

Pues para poner negrita:

Código:

function entrecomillar()	{
	_insertar(elEditor, '<b>' + prompt("entrecomillar", _lector()) + '</b>');
}

O con códigos BBCODE

Código:

function entrecomillar()	{
	_insertar(elEditor, '' + prompt("entrecomillar", _lector()) + '');
}

Tal vez con esto último se ponga negrita en esta misma página...

Luego tienes que cambiar lo que hay por delante y lo que hay por detrás del promp...

Saludos

caricatos · #10 (**permalink**) 16/03/2006, 14:56

¡Je, je!

Se ha puesto negrita cambiando los caracteres mayor y menos por los corcheres abiertos y cerrados.

cmc · #11 (**permalink**) 16/03/2006, 16:23

Ok lo prueba y les cuento