Integrando Dreamweaver, PHP y Fireworks en plantillas
7 de marzo de 2006 Autor: Jose Suarez Archivado en Fireworks, PHP/MySQL, TutorialesEn este articulo veremos como integrar PHP con HTML de manera sencilla utilizando Dreamweaver para la creacion de plantillas, pero antes utilizaremos Fireworks para poder prepara la plantilla de manera grafica.
Si eres un usuario de nivel basico, intermedio, y si tienes conocimientos de HTML y algo de Fireworks, sobre todo con el tema de exportación, te sera de mucha utilidad, porque con una plantilla PHP ya es posible cargar la cantidad de paginas que quieras de manera dinámica sin tener que perder el tiempo en volver a cargar las imagenes y toda la interfaz.
Recomendaciones:
Para comenzar, puedes utilizar este enlace para descargar todos los archivos utilizados:
Descargar Archivos de ejemplo
Primera parte : Exportando las areas con Fireworks
Pasos:
1.Abrir el archivo plantilla.png que se encuentra en la carpeta “original” del ZIP que ha descargado.

2.puede cambiar la apariencia de la plantilla modelo, por ejemplo, cambiar los datos de la empresa y el logo, pero tenga cuidado con las medidas de las imagenes que se van a generar.3.El titular de la plantilla sera el area donde colocaremos el nombre de la empresa o logo, esta sera un area de division que tenemos que exportar.
4.Utilice la herramienta SLICE TOOL (Herramienta de division) y defina la primera area.

5.Verifique con la herramienta ZOOM, las uniones entre el area definida y el limite de la imagen asi como con la linea base del titular que da inicio al contenido de la pagina, procure ser lo mas exacto posible.
6.Exporte la region seleccionada teniendo en cuenta las siguientes caracteristicas antes de exportar:

7.Recuerde crear una carpeta donde se iran guardando todas las imagenes, esta pertenecera a la carpeta raiz.
8.defina dos areas mas de division sobre las lineas laterales de la plantilla.Procure que la division no llege a la curva inferior:

9.Exporte las areas de division por serparado, establecer correctamenteque se van a exporta solo la imagen del area de division seleccionada. Para efectos practicos le puede asignar de nombre: linea_izquierda.jpg / linea_derecha.jpg
10.por ultimo defina el area de division para el pie de pagina (lacurva inferior):

11.Exporte esta area, por ejemplo con el nombre: pie_pagina.jpg
Listo, una vez con las piezas del rompecabezas procederemos a unirlas pero en Dreamweaver.
Hombre estoy en la busqueda de ejemplos como el tyo para poder construir mi propia pagina, gracias por compartir tus conocientos con los civernautas. cuando la pueda construir vuelvo a escribirle. mi próxima pregunta será como modificar el texto de mi página sin tener que volver a modificar mi página en casa. como la puedo hacer desde el servidor o desde mi página principal en internet.
Luis Berbesi
Me aparecido un ejemplo excelente pero tu ve un problema no me corren los links a las otras paginas
¿Has comprobado que no sean links de ejemplo?
Hola tal vez es un poco tarde mi respuesta pero solucione el problema declarando como variable $v=$_request['v']; y asunto solucionado Gracias por tu ejemplo me sirvio de mucho. Gracias por tus conocimientos…
Ahhh, las variables globales… 8-)
Ok esta muy bien hasta el la explotación de imágenes en Dreamweaver donde tengo problemas es en la tercera parte
• Hablas de inserta una tabla y de alinearla verticalmente BOTTON y horizontal RIGHT
¡¿ Como hago eso a lo mejor estoy lenta y no sé cómo hacerlo?
• Inserto los textos
¡¡¿Como hago el estilo y donde inserto el código que das?
Cabe aclarar que ya lo hice tal como lo dices pero al igual que a Saúl Miranda GarcÃa tampoco corren los link’s
No sé si serias tan amable en explicarlo por favor
Gracias
Hablas igualmente de unas paginas que ya están hechas en el ejemplo
¿Cómo creo las mÃas para mi sitio?
Para Ursula:
“Hablas de inserta una tabla y de alinearla verticalmente BOTTON y horizontal RIGHT
¡¿ Como hago eso a lo mejor estoy lenta y no sé cómo hacerlo?”
Estas opciones las puedes ver en la barra de propiedades de Dreamweaver al estar dentro de una celda.. o en su defecto podrias crear un estilo para ese caso.. la ventajan de DW es que ayuda mucho con los CSS.
“¿Como hago el estilo y donde inserto el código que das?” el CSS por defecto va entre las marcas
Aqui defines el estilo
esto si quieres meter el estilo dentro del HTML, cosa que actualmente no se hace.. lo mejor seria crear una hoja de estilos .css y vincularla
“Hablas de inserta una tabla y de alinearla verticalmente BOTTON y horizontal RIGHT
¡¿ Como hago eso a lo mejor estoy lenta y no sé cómo hacerlo?â€
Estas opciones las puedes ver en la barra de propiedades de Dreamweaver al estar dentro de una celda.. o en su defecto podrias crear un estilo para ese caso.. la ventajan de DW es que ayuda mucho con los CSS.
“¿Como hago el estilo y donde inserto el código que das?†el CSS por defecto va entre las marcas
<pre>
<style type="text/css">
<!–
.Estilo1 {
color: #993300;
font-weight: bold;
}
–>
</style>
</pre>
esto si quieres meter el estilo dentro del HTML, cosa que actualmente no se hace.. lo mejor seria crear una hoja de estilos .css y vincularla
<link href="thickbox.css" rel="stylesheet" type="text/css" />
Hola soy el autor del articulo, Cualquier consulta porfavor enviarla a esta cuenta :webtrainner@hotmail.com Saludos
Y recuerdo que tenemos un foro para preguntar! :-)
http://forum.dwug.es/
Exactamente….. :) .. espero que podamos colaborar aportando nuestras experiencias.. saludos
muchas gracias por tu aportacion y tu ayuda
Hola. Mi pregunta es cómo puedo definir una plantilla y poder modificar más tarde con una función en el body “OnLoad” para una sola página?
1.- Tengo una plantilla con un menú y una imagen corporativa
2.- Ya cuento con varias páginas que la utilizan
3.- Ahora tengo una página donde tengo que insertar la fecha a través de JavaScript, ya tengo las funciones pero deben ir el llamado en la parte del body.
4.- Mi problema es que quiero modificar la plantilla, pero no me deja poner editable la parte del body.
Hojalá me puedan ayudar, de antemano muchas gracias.
Saludos!!
Roberto:
1.- Selecciona la etiqueta body en la plantila y abre “Modify > Templates > Make Attribute Editable”
2.- En la ventana de diálogo, añade un nuevo atributo, “onload”
3.- Asignale un nombre, por ejemplo “onload_event”, comprueba que activas la casilla “make this attribute editable” e indica que será un atributo de tipo texto
4.- Puedes dejar en blanco el campo default
A partir de ahora, cada vez que crees una página basada en dicha plantilla, puedes ir a “Modify->Templa Properties…” y verás en la lista, el campo onload_event que creaste en la plantilla. Sólo tienes que insertar el nombre de la función a la que quieres llamar (recuerda utilizar comillas simples si vas a pasar alguna cadena de texto!)
Entonces como quedaria el codigo al insertar o midificar lo de la variable? $v=$_request[’v']
Gracias!
Hola Jarit:
Puedes reemplazar directamente $v por $_REQUEST['v'] ó $_GET['v']
switch($_GET['v']){
…..resto del codigo
}
El ejemplo esta bueno, pero, pero, pero es algo complicado y aburridor tener que hacerlo con php.
mas facil usas la version cs3 de dreamweaver y te creas un efecto de ajax, solo diseña tu web los menus el fondo
y puedes importarla como html luego la insertas en dreamweaver y listo cuanto tardasre haciendo una web 20 minutos asi de facil
el php es bueno para
formularios
bases de datos
Gracias por este espacio
Oye Juan pues deberias iluminarnos con tu sabiduria y compartirnos en un pequeño, sencillo y divertido tutorial el ejemplo que nos explique lo que se hace con DW-CS3 y AJAX, no lo crees? Mandanos la URL
Este tutorial no es aburrido y nada complicado, quiza sea sencilo pero la creatividad la pone cada quien!
- Gracias Andres, un amigo que sabe sobre php me indicó eso mismo ;)
Hola como estan…. por favor necesito ayuda, voy a insertar una tabla y me sale el siguiente error no se que estoy haciendo mal: msj Violacion de accesso compartido al acceder al c/user/pck/appdata/roaming/macromedia/dreamwievermx/configuracion/objets/commom/table.htm, por favor agradezco sus comentarios