Post on 09-Jul-2015
Empecemos...Abrimos la administración del campus y
vamos a la administración del sitio web
En este tutorial veremos la utilidad de colocar, en un link común, la posibilidad de que se despliegue una ventana con información, sin que el usuario salga de la página que está visitando. la llamaremos ventana emergente, porque aparece superpuesta a la de navegación actual, y puede cerrarse sin perjuicio de seguir el ”paseo”.
Seleccionamos la página en la cual queremos que se abra la ventana emergente, para editarla
Vamos a suponer que queremos abrir un link que muestre el sitio web del Ministerio de Nación, en una ventana nueva
Ubicamos el cursor en el espacio en el que queremos colocar el link.
Vamos a necesitar tener copiado (y disponible en el portapapeles) este texto que nos servirá para hacer el link.
<a onclick="window.open(this.href, this.target, 'toolbar=0,menubar=0,status=1, location=1,scrollbars=1,
width=300,height=400'); return false; " href="http://www.me.gov.ar" target="_blank"> Ministerio </a>
No es necesario entender el código!Basta con copiarlo tal cual, sin modificar los espacios, comillas y signos.Lo que está en rojo…después lo vemos
Para pegarlo, buscamos en la barra de menú el icono para pegar, pero el que tiene la letra ”H” (que indica HTML, es decir, el código de las páginas web) y hacemos clic
En la ventana Insertar texto HTML pegamos el código previamente copiado y presionamos Insertar
Notemos que ahora se lee el texto ”Ministerio” y ya se ve como un enlace
No olvidemos ir al pie de la página y presionar ”Modificar” para guardar los cambios
Volvemos a la vista de usuario para ver el resultado...
Un paso más allá
<a onclick="window.open(this.href, this.target, 'toolbar=0,menubar=0,status=1, location=1,scrollbars=1,
width=300,height=400'); return false;" href="http://www.me.gov.ar" target="_blank"> Ministerio </a>
Para editar el código y poder definir el tamaño de la ventana emergente, basta con modificar estos datos:
Pixeles de ancho Pixeles de largo
Dos pasos más allá
<a onclick="window.open(this.href, this.target, 'toolbar=0,menubar=0,status=1, location=1,scrollbars=1,width=300,height=400'); return false;" href="http://www.educ.ar" target="_blank"> el portal educar </a>
Y esto es para editar el código y elegir otro sitio como destino del link
Dirección o sitio webdestino (va pegado a las comillas!)
Texto que se mostrará como link.Puede ser una palabra o más (cuidado con usar acentos y caracteres especiales, ya que estamos en la vista de código puro).
Y la frutilla del postre
¿Qué tal si queremos que en la ventana emergente aparezca una información propia?
Volvamos al listado de páginas del sitio...
Elegimos la página que se verá emergente y sobre ella presionamos usando el botón derecho del mouse
Del menú contextual que se activa seleccionamos “Copiar dirección del enlace”
Veamos el contenido de los que acabamos de copiar...
javascript:VerNovedad2('http://infd.e-ducativa.com/sitio/upload/html/12.html')
Para eso lo pegamos en el bloc de notas
Esta es la dirección de destino para reemplazar en nuestro código original
<a onclick="window.open(this.href, this.target, 'toolbar=0,menubar=0,status=1, location=1,scrollbars=1,width=500,height=600'); return false;" href="http://infd.e-ducativa.com/sitio/upload/html/12.html" target="_blank"> Jornada La Rioja </a>
Veamos el resultado...
Tenemos que tener el código copiado en texto sin formato (bloc de notas es lo mejor) para poder modificarlo (dimensiones de la ventana emergente y página de destino)
Tenemos que tener también los datos a modificar (tamaño, dirección web...para poder usarlos en ese código que tendremos a mano)
En la página en la que queremos crear el enlace a la ventana emergente, desde el editor, colocamos el cursor en el punto que lo queremos insertar
Pegamos el código con el botón para pegar código (H) y presionamos insertar
No olvidemos el clic en “Modificar”
Resumiendo
¡Y listo! A rodar...