Foros del Web » Creando para Internet » Diseño Gráfico »

maquetación y diseño de interfaz gráfica con php

 Estas en el tema de maquetación y diseño de interfaz gráfica con php en el foro de Diseño Gráfico en Foros del Web. Hola Tras haber buscado em la red alguna solución sin exito, planteo mi problema a continuación, a ver si alguien puede echarme una mano con ...
  #1 (permalink)  
Antiguo 13/11/2010, 05:24
 
Fecha de Ingreso: noviembre-2010
Mensajes: 5
Antigüedad: 14 años, 1 mes
Puntos: 0
maquetación y diseño de interfaz gráfica con php
Hola

Tras haber buscado em la red alguna solución sin exito, planteo mi problema a continuación, a ver si alguien puede echarme una mano con el.

Me gustaría si es posible, mantener el diseño html de mi web, en las paginas que contengan php... es decir, en la sección del perfil del usuario, me gustaría que no tuviera el aspecto austero y simple que suelen tener las paginas php, siguiendo la linea de diseño que tiene el resto de la web.

He probado a hacer el cambio de la extension html a php, y el diseño base se mantuvo sin alteración, pero al redistribuir las opciones del perfil (nombre, lugar, etc...), en las casillas de una tabla, parece que el codigo php introducido no se presenta como válido. No se si es por que esta dentro de una div, haciendo que se anule cualquier función php o que es lo que pasa... soy nuevo en el lenguaje php, y este comportamiento es impredecible para mi.

Si alguien puede echarme una mano se lo agradecería.

Un saludo.
  #2 (permalink)  
Antiguo 14/11/2010, 05:51
Avatar de BapeMilo  
Fecha de Ingreso: octubre-2010
Mensajes: 71
Antigüedad: 14 años, 2 meses
Puntos: 1
Respuesta: maquetación y diseño de interfaz gráfica con php
publica tu source
y coloca tu error
  #3 (permalink)  
Antiguo 14/11/2010, 10:54
 
Fecha de Ingreso: noviembre-2010
Mensajes: 5
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: maquetación y diseño de interfaz gráfica con php
El codigo de la página seria el siguiente:

Código php: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.  
  5. <link rel="shortcut icon" href="../../favicon.ico" >
  6. <link rel="icon" type="image/gif" href="../../animated_favicon1.gif" >
  7.  
  8. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  9. <title>HNM - Login to continue</title>
  10. <style type="text/css">
  11. <!--
  12. #apDiv1 {
  13.     position:absolute;
  14.     width:175px;
  15.     height:164px;
  16.     z-index:1;
  17.     left: 1px;
  18.     top: 1px;
  19. }
  20. .Estilo21 {font-family: Castellar;
  21.     color: #aaaaaa;
  22.     font-size: 36px;
  23. }
  24. .Estilo24 {font-size: 40px}
  25. #apDiv4 {
  26.     position:absolute;
  27.     width:710px;
  28.     height:128px;
  29.     z-index:3;
  30.     top: 1px;
  31.     left: 166px;
  32. }
  33. #apDiv5 {
  34.     position:absolute;
  35.     width:290px;
  36.     height:138px;
  37.     z-index:4;
  38.     left: 970px;
  39.     top: 1px;
  40. }
  41. #apDiv2 {
  42.     position:absolute;
  43.     width:175px;
  44.     height:460px;
  45.     z-index:2;
  46.     left: 1px;
  47.     top: 153px;
  48. }
  49. body {
  50.     background-color: #AA6B2A;
  51. }
  52. #apDiv10 {
  53.     position:absolute;
  54.     width:700px;
  55.     height:260px;
  56.     z-index:6;
  57.     left: 276px;
  58.     top: 160px;
  59. }
  60. a:link {
  61.     text-decoration: none;
  62.     color: #aaaaaa;
  63. }
  64. a:visited {
  65.     text-decoration: none;
  66.     color: #aaaaaa;
  67. }
  68. a:hover {
  69.     text-decoration: none;
  70.     color: #aaaaaa;
  71. }
  72. a:active {
  73.     text-decoration: none;
  74.     color: #aaaaaa;
  75. }
  76. #apDiv3 {
  77.     position:absolute;
  78.     width:200px;
  79.     height:121px;
  80.     z-index:7;
  81.     left: 524px;
  82.     top: 439px;
  83. }
  84. #apDiv6 {
  85.     position:absolute;
  86.     width:751px;
  87.     height:17px;
  88.     z-index:8;
  89.     left: 255px;
  90.     top: 581px;
  91. }
  92. .Estilo35 {font-size: 16px}
  93. #apDiv7 {
  94.     position:absolute;
  95.     width:153px;
  96.     height:115px;
  97.     z-index:9;
  98.     left: 257px;
  99.     top: 292px;
  100. }
  101. #apDiv8 {   position:absolute;
  102.     width:297px;
  103.     height:61px;
  104.     z-index:6;
  105.     left: 403px;
  106.     top: 399px;
  107. }
  108. #apDiv9 {
  109.     position:absolute;
  110.     width:150px;
  111.     height:43px;
  112.     z-index:10;
  113.     left: 328px;
  114.     top: 480px;
  115. }
  116. .Estilo36 {font-family: Castellar}
  117. .Estilo39 {
  118.     font-family: Castellar;
  119.     font-size: 16px;
  120.     color: #aaaaaa;
  121. }
  122. .Estilo40 {font-family: Castellar; font-size: 16px; }
  123. #apDiv11 {
  124.     position:absolute;
  125.     width:1083px;
  126.     height:476px;
  127.     z-index:5;
  128.     left: 176px;
  129.     top: 180px;
  130. }
  131. #apDiv12 {
  132.     position:absolute;
  133.     width:220px;
  134.     height:32px;
  135.     z-index:6;
  136.     left: 181px;
  137.     top: 146px;
  138. }
  139. .style1 {
  140.     margin-left: 200px;
  141. }
  142. .style2 {
  143.     font-size: medium;
  144. }
  145. -->
  146. </style>
  147. </head>
  148.  
  149. <body>
  150.  
  151. <?php
  152. $username = $_COOKIE['loggedin'];
  153. if (!isset($_COOKIE['loggedin'])) die(a href="../home.html");      [B]// Aqui me da un problema de syntax error, unexpected T_STRING //[/B]
  154.     
  155. ?>
  156.  
  157. <div id="apDiv1">
  158.   <table width="175" height="160" border="0">
  159.     <tr>
  160.       <th width="175" height="148" bgcolor="#663300" scope="col"><div align="center"></div></th>
  161.     </tr>
  162.   </table>
  163. </div>
  164. <div id="apDiv5">
  165.   <table width="290" height="129" border="0">
  166.     <tr>
  167.       <th width="280" height="135" bgcolor="#663300" scope="col"> <form action="../../registration/login.php" method="post">
  168.         <table width="220" border="0">
  169.           <tr>
  170.             <th width="86" scope="col"><div align="right" class="Estilo35">Username:</div></th>
  171.             <th width="124" scope="col"><div align="left">
  172.               <input type="text" name="username" size="20" maxlength="20" />
  173.             </div></th>
  174.           </tr>
  175.           <tr>
  176.             <th scope="row"><div align="right" class="Estilo35">Password:</div></th>
  177.             <td><div align="left">
  178.               <input type="password" name="password" size="20" maxlength="20" />
  179.             </div></td>
  180.           </tr>
  181.           <tr>
  182.             <th colspan="2" scope="row"><input type="submit" value="Login" /></th>
  183.           </tr>
  184.         </table>
  185.       </form></th>
  186.     </tr>
  187.   </table>
  188. </div>
  189. <div id="apDiv2">
  190.   <table width="175" height="463" border="0">
  191.     <tr>
  192.       <th height="50" valign="bottom" bgcolor="#663300" scope="col"><span class="Estilo39"><a href="http://www.forosdelweb.com/home.html">Home</a></span></th>
  193.     </tr>
  194.     <tr>
  195.       <th width="200" height="15" valign="bottom" bgcolor="#663300" scope="row"><span class="Estilo39"><a href="http://www.forosdelweb.com/registration/login.html">Members</a></span></th>
  196.     </tr>
  197.     <tr>
  198.       <th height="15" valign="bottom" bgcolor="#663300" scope="row"><span class="Estilo39">Search</span></th>
  199.     </tr>
  200.     <tr>
  201.       <th height="15" valign="bottom" bgcolor="#663300" scope="row"><a href="http://www.forosdelweb.com/global map.html" class="Estilo40">Sites</a></th>
  202.     </tr>
  203.     <tr>
  204.       <th height="15" valign="bottom" bgcolor="#663300" scope="row"><a href="http://www.forosdelweb.com/registration/logout.php" class="Estilo36"></a></th>
  205.     </tr>
  206.     <tr>
  207.       <th height="15" bgcolor="#663300" scope="row">&nbsp;</th>
  208.     </tr>
  209.     <tr>
  210.       <th height="15" bgcolor="#663300" scope="row">&nbsp;</th>
  211.     </tr>
  212.     <tr>
  213.       <th height="15" valign="bottom" bgcolor="#663300" scope="row"><a href="http://www.forosdelweb.com/registration/logout.php" class="Estilo40">Logout</a></th>
  214.     </tr>
  215.     <tr>
  216.       <th height="15" bgcolor="#663300" scope="row">&nbsp;</th>
  217.     </tr>
  218.     <tr>
  219.       <th bgcolor="#663300" scope="row">&nbsp;</th>
  220.     </tr>
  221.   </table>
  222. </div>
  223.  
  224.  
  225. <div id="apDiv4" style="left: 166px; top: 1px">
  226.   <table width="810" height="128" border="0">
  227.     <tr>
  228.       <th width="710" height="135" bgcolor="#663300" scope="col"><div align="left">
  229.         <blockquote>
  230.           <blockquote>
  231.             <p>&nbsp;</p>
  232.           </blockquote>
  233.         </blockquote>
  234.       </div></th>
  235.     </tr>
  236.   </table>
  237. </div>
  238.  
  239. <form action="update.php" method="post" class="style1" >
  240.   <p>
  241. </p>
  242.     <p>&nbsp;</p>
  243.     <p>&nbsp;</p>
  244.     <p>&nbsp;</p>
  245.     <p><strong><span class="style2">Welcome</span></strong> 
  246.     <input type="text" name="username" disabled="disabled" value="<?php
  247. include "../config.php";
  248. mysql_connect($server, $db_user, $db_pass) or die (mysql_error()); 
  249. $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error()); 
  250.  
  251.    while ($qry = mysql_fetch_array($result)) { 
  252.       echo "$qry[username]"; 
  253.    } 
  254. ?>" />
  255. </p>
  256.     <p style="width: 1048px; height: 120px">
  257.  
  258.  
  259. <img src="<?php include "../config.php"; mysql_connect($server, $db_user, $db_pass) or die (mysql_error());  $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error());      while ($qry = mysql_fetch_array($result)) {       echo "$qry[avatar]";     }  ?>
  260. " alt="Avatar" />&nbsp;&nbsp;&nbsp;
  261.     <strong><span class="style2">Personal Details</span></strong><br />
  262. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  263.     First Name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
  264.       <input type="text" name="name1" value="<?php
  265. include "../config.php";
  266. mysql_connect($server, $db_user, $db_pass) or die (mysql_error()); 
  267. $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error()); 
  268.  
  269.    while ($qry = mysql_fetch_array($result)) { 
  270.       echo "$qry[name1]"; 
  271.    } 
  272. ?>" />
  273. <br />
  274. &nbsp;&nbsp;&nbsp;&nbsp; Second Name: 
  275.       <input type="text" name="name2" value="<?php
  276. include "../config.php";
  277. mysql_connect($server, $db_user, $db_pass) or die (mysql_error()); 
  278. $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error()); 
  279.  
  280.    while ($qry = mysql_fetch_array($result)) { 
  281.       echo "$qry[name2]"; 
  282.    } 
  283. ?>" />
  284. <br />
  285. &nbsp;&nbsp;&nbsp;&nbsp;; Email Address: 
  286.       <input type="text" name="email" value="<?php
  287. include "../config.php";
  288. mysql_connect($server, $db_user, $db_pass) or die (mysql_error()); 
  289. $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error()); 
  290.  
  291.    while ($qry = mysql_fetch_array($result)) {
  292.       echo "$qry[email]"; 
  293.    } 
  294. ?>" />
  295. <br />
  296. &nbsp;&nbsp;&nbsp;&nbsp; Your website (URL): 
  297.       <input type="text" name="website" value="<?php
  298. include "../config.php";
  299. mysql_connect($server, $db_user, $db_pass) or die (mysql_error()); 
  300. $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error()); 
  301.  
  302.    while ($qry = mysql_fetch_array($result)) {
  303.       echo "$qry[website]"; 
  304.    } 
  305. ?>" />
  306. <br />
  307.     <br />
  308.     <br />
  309.     <br />
  310.     <br />
  311.     <br />
  312.     <br />
  313.     </p>
  314.  
  315.  
  316.     <p>Your Avatar (URL): 
  317.       <input type="text" name="avatar" value="<?php include "../config.php"; mysql_connect($server, $db_user, $db_pass) or die (mysql_error());  $result = mysql_db_query($database, "select * from $table WHERE username = '$username'") or die (mysql_error());      while ($qry = mysql_fetch_array($result)) {       echo "$qry[avatar]";     }  ?>" />
  318.       <br />
  319.       Avatar size is 150px x 150px, resizing will occur if the image is larger than the 150px x 150px size..</p>
  320.     <p><strong>Change your password</strong></p>
  321.   <p> Old Password:&nbsp;&nbsp;
  322.     <input type="password" name="oldpass" />
  323.     <br />
  324.     New Password:
  325.     <input type="password" name="newpass" />
  326.     <br />    
  327.   </p>
  328.       <p>
  329.       <input type="submit" name="Submit" value="Submit" />
  330. </p>
  331. </form>
  332.  
  333. </body>
  334. </html>


Ahora saliendome el error marcado a la hora de direccionar a una pagina dependiendo de las cookies, no se si este "formato" llegaría a ser válido.

Si fuera posible, rogaría algún consejo que me explicara como poder mantener el diseño de la pagina, con la funcionalidad de un perfil grafico de usuario que devolviera estos y mas datos registrados en la base de datos.

Y si fuera posible, algún consejo sobre como quitar los cuadros de texto que recogen las respuestas de la bd, apareciendo simplemente como texto contiguo.

Muchas gracias de antemano.
Última edición por metacortex; 16/11/2010 a las 20:34 Razón: Encerrar código en bbtags
  #4 (permalink)  
Antiguo 16/11/2010, 20:38
Avatar de metacortex
Viejo demente
  
Fecha de Ingreso: junio-2004
Ubicación: Caracas - Venezuela
Mensajes: 9.027
Antigüedad: 20 años, 6 meses
Puntos: 832
Respuesta: maquetación y diseño de interfaz gráfica con php
Cita:
Iniciado por return Ver Mensaje
Hola

Tras haber buscado em la red alguna solución sin exito, planteo mi problema a continuación, a ver si alguien puede echarme una mano con el.

Me gustaría si es posible, mantener el diseño html de mi web, en las paginas que contengan php... es decir, en la sección del perfil del usuario, me gustaría que no tuviera el aspecto austero y simple que suelen tener las paginas php, siguiendo la linea de diseño que tiene el resto de la web.

He probado a hacer el cambio de la extension html a php, y el diseño base se mantuvo sin alteración, pero al redistribuir las opciones del perfil (nombre, lugar, etc...), en las casillas de una tabla, parece que el codigo php introducido no se presenta como válido. No se si es por que esta dentro de una div, haciendo que se anule cualquier función php o que es lo que pasa... soy nuevo en el lenguaje php, y este comportamiento es impredecible para mi.

Si alguien puede echarme una mano se lo agradecería.

Un saludo.
La carga dinámica no limita el diseño de la interfaz. Si acaso has visto páginas PHP con diseños malos simplemente se trata de eso: un diseño malo cuyo resultado no está relacionado con el trabajo de programación.
  #5 (permalink)  
Antiguo 17/11/2010, 03:24
 
Fecha de Ingreso: noviembre-2010
Mensajes: 5
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: maquetación y diseño de interfaz gráfica con php
Gracias por la respuesta.

El problema, es que no se si la carga dinámica esta bien o no... fiándome del codigo de colores de php, obviamente estaría mal... aunque no se por que, aqui si que aparece con los colores estandares de un código valido.

No se si al introducir el código en div se alteraría su funcionalidad... la verdad es que no tengo mucha idea de php, y por los manuales que he visto, no he aclarado mucho al respecto.

Podrías mandarme un modelo mas o menos sencillo de una página maquetada, al siguiente correo, please?

[email protected]

Etiquetas: diseño, interfaz, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 23:35.