8/9/2019 Ventanas emergentes en el sitio web

1/15

8/9/2019 Ventanas emergentes en el sitio web

2/15

Empecemos...

Abrimos la administracin del campus yvamos a la administracin del sitio web

En este tutorial veremos la utilidad de colocar, en un link

comn, la posibilidad de que se despliegue una ventana

con informacin, sin que el usuario salga de la pgina queest visitando. la llamaremos ventana emergente, porque

aparece superpuesta a la de navegacin actual, y puede

cerrarse sin perjuicio de seguir el paseo.

8/9/2019 Ventanas emergentes en el sitio web

3/15

Seleccionamos la pgina en la cual queremosque se abra la ventana emergente, para editarla

8/9/2019 Ventanas emergentes en el sitio web

4/15

Vamos a suponer que queremos abrir un link quemuestre el sitio web del Ministerio de Nacin, enuna ventana nueva

Ubicamos el cursor

en el espacio en elque queremos

colocar el link.

8/9/2019 Ventanas emergentes en el sitio web

5/15

Vamos a necesitar tener copiado (y

disponible en el portapapeles) este texto

que nos servir para hacer el link.

Ministerio

No es necesario entender el cdigo!

Basta con copiarlo tal cual, sin modificar los espacios, comillas y signos.

Lo que est en rojodespus lo vemos

8/9/2019 Ventanas emergentes en el sitio web

6/15

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 cdigo de las pginas web) y hacemos clic

En la ventana Insertar

texto HTML pegamos elcdigo previamente

copiado y presionamos

Insertar

8/9/2019 Ventanas emergentes en el sitio web

7/15

Notemos que ahora se lee el texto

Ministerio y ya se ve como un enlace

No olvidemos ir al pie de la pgina ypresionar Modificar para guardar los

cambios

8/9/2019 Ventanas emergentes en el sitio web

8/15

Volvemos a la vista de usuario para ver el

resultado...

8/9/2019 Ventanas emergentes en el sitio web

9/15

Un paso ms all

Ministerio

Para editar el cdigo y poder definir el

tamao de la ventana emergente,

basta con modificar estos datos:

Pixeles de ancho Pixeles de largo

8/9/2019 Ventanas emergentes en el sitio web

10/15

Dos pasos ms all

el portal educar

Y esto es para editar el cdigo y elegir

otro sitio como destino del link

Direccin o sitio web

destino (va pegado a

las comillas!)

Texto que se mostrar como link.

Puede ser una palabra o ms

(cuidado con usar acentos y caracteres especiales,

ya que estamos en la vista de cdigo puro).

8/9/2019 Ventanas emergentes en el sitio web

11/15

Y la frutilla del postre

Qu tal si queremos que en la

ventana emergente aparezca una

informacin propia?

Volvamos

al listado

de pginasdel sitio...

8/9/2019 Ventanas emergentes en el sitio web

12/15

Elegimos la pgina que

se ver emergente y

sobre ella presionamos

usando el botn derecho

del mouse

Del men contextual

que se activa

seleccionamos

Copiar direccin del

enlace

8/9/2019 Ventanas emergentes en el sitio web

13/15

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 direccin de destino para reemplazar en nuestro cdigo original

Jornada La Rioja

8/9/2019 Ventanas emergentes en el sitio web

14/15

Veamos el resultado...

8/9/2019 Ventanas emergentes en el sitio web

15/15

Tenemos que tener el cdigo copiado en texto sinformato (bloc de notas es lo mejor) para poder modificarlo(dimensiones de la ventana emergente y pgina de destino)

Tenemos que tener tambin los datos a modificar(tamao, direccin web...para poder usarlos en ese cdigo que

tendremos a mano) En la pgina en la que queremos crear el enlace a la

ventana emergente, desde el editor, colocamos elcursor en el punto que lo queremos insertar

Pegamos el cdigo con el botn para pegar cdigo (H)

y presionamos insertar No olvidemos el clic en Modificar

Resumiendo

Y listo! A rodar...