Dreamweaver CS4 / Guía DW CSS.005

Transcripción

1 1 Dreamweaver CS4 / Guía DW CSS.005 FORMULARIO, MAPA Y FTP Contenidos de esta guía Formulario de Contacto Mapa en tu web FTP 2008 Material exclusivo de Academia MacPC

2 Crear un Formulario 2 CREAR Existe un sitio web en el cual puedes crear una estrcutura de formulario y el crea tanto el HTML (nombre, cajas, botones) como el archivo PHP que es el lleva la información desde el HTMl a un correo. Una vez que ingresamos a la web debes seguir los siguientes pasos. PASO 1 Figura 1 En esta parte el From no se llena porque es la casilla que el usuario colocará su correo y esto permitira que cuando nos llegue e correo le respondamos. En el To tienes que colocar el correo al cual quieres que llegue la información. El Subject es el titulo con que llegarán todos los correos a la casilla señalada anteriormente. (Figura 1). PASO 2 Figura 2 Aquí hay que colocar los nombres de las cajas que queremos crear (todo con minusculas y sin espacios) para ello tambien tenemos 3 tipos de cajas: (Figura 2). Text Box: Text Area: Checkbox: Figura 3 PASO 3 Una vez que ya decidiste que cajas colocar, debes seleccionar con que lenguaje de programación quieres los códigos. PHP es un lenguaje gratis que funciona en toda plataforma. (Figura 3).

3 Que códigos copiar 3 Figura 4 PASO 4 Cuando seleccionas que lenguaje te crea dos archivos, un HTML con la estructura de las cajas y un PHP que permitirá llevar la información. Del HTML debes copiar las etiquetas de <form> a </form>, lo demás son comentarios.(figura 4). Figura 5 PASO 5 El codigo que copiaste lo tienes que pegar en la parte del codigo de tu hoja HTML en donde quieras que aparezca. Despues puedes aplicar estilos a los textos, separar los textos de las cajas y ajustarlo gráficamente.(figura 5). Visión del código Visión de la parte gráfica Figura 6 PASO 6 Volviendo al sitio del formulario ahora debes seleccionar todo el codigo del PHP, copiar y pegarlo en una nueva hoja de PHP, debes borrar todo lo que tenga la nueva hoja y pegar el codigo que dió el formulario, guardarlo con el nombre de contact.php (Figura 6).

4 Archivos adicionales 4 Figura 7 PASO 7 El código del HTML que nos da el sitio web, viene programado a que debe conectarse a un archivo llamado contact.php, además este código viene con una programación en que si hay pasa toda la información bien, se vincula a una página llamado ok.html y si hay algún problema se vincula a error.htm. (Figura 7). Figura 8 PASO 8 Si quieres puedes utilizar una base de otra página para crear o una nueva que se llamen ok.htm y error.htm (Figura 8). página ok.htm PASO 9 Si necesitas probar el formulario debes subirlo a un servidor, al menos que tengas instalado un software para que funcione el PHP. página error.htm

5 Colocar mapa en tu web 5 GOOGLE MAPS Figura 9 Figura 10 No solo sirve para buscar una dirección si no que tambien puedes colocar el mapa, una vez que ya buscaste la dirección y tienes el mapa, debes ir a a la opción de Mis Mapas para guardar la dirección (Figura 9), añades un mapa y lo dejas marcado, ingresas toda la información correspondiente al lugar marcado (Figura 10), si quieres haces un clic en el icono y puedes cambiar la figura del lugar demarcado. (Figura 11) Figura 11 Una vez hecha la marca debes dirigirte a la parte superior derecha del mapa en donde dice Enlazar (Figura 12), en él tienes las opciones de la URL para enviar por correo y la segunda es el código que debes pegar en una caja del sitio web. Este está contenido en un IFRAME que es un marco y permite que cuando el mapa está en tu web te puedas mover adentro de él. (Figura 13) Figura 12 Actualizas en la parte gráfica o visualizas en el navegador el mapa. (Figura 14) Figura 14 Figura 13

6 Configurar el FTP 6 Figura 15 QUE ES UN FTP Existen variados softwares que permiten traspasar los archivos desde el computador al servidor o hosting. Entre ellos para mac: - Cyberduck: software FTP gratuito (Figura 15). - Transmit: software FTP pagado, visualmente muy intuitivo. (Figura 16). Figura 16 Entre ellos para pc: - Filezilla: software para windows que permite subir los archivos. (Figura 17). Cuando vamos a subir los archivos debemos tener las claves de acceso que el hosting nos enrega al momento del pago. para ello necesitamos 3 datos importantes: (Figura 18). Figura 17 - Servidor: es la dirección del FTP, si no hay un dominio comprado se coloca la IP (Ejemplo: ), en cambio cuando ya está el dominio se coloca ftp.nombrefacil.cl - Usuario: principalmente se utilizan cuentas de correos como usuarios, pero tambien hay instancias en donde se aplica un usuario con letras y números (ejemplo: dn98765zj) - Contraseña: aquí se utilza cualquier palabra que se designe. Figura 18 Con estos tres elementos podemos acceder y dejar los archivos en el servidor. SE PROHIBE TODA REPRODUCCION PARCIAL O TOTAL DE ESTE MATERIAL, EN CUALQUIER FORMATO IMPRESO O DIGITAL, QUE NO SEA UTILIZADO PARA LOS FINES EDUCATIVOS DE ACADEMIAMACPC. ACADEMIAMACPC