Documentos de Académico
Documentos de Profesional
Documentos de Cultura
<script type="text/javascript">
AC_FL_RunContent( 'codebase','
http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','3
00','height','80','src','../swf/ban_encuentros2','quality','high','pluginspage','http://www.macromedia.com
/go/getflashplayer','name','wmode','value','opaque','movie','../swf/ban_encuentros2','wmode','opaque '
); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="
http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
width="300" height="80">
<param name="movie" value="../swf/ban_encuentros2.swf" />
<param name="quality" value="high" />
Cómo cerrar sesión por inactividad o por cierre del navegador por parte del
usuario. Veremos como cerrar la sesión del usuario cuando:
Algo que puede parecer muy obvio para unos y muy complejo para otros, pero
que innegablemente muchos de nosotros nos hemos preguntado en algún
momento: ¿Cómo caducar una sesión en PHP?
//iniciamos la sesión
session_name("loginUsuario");
session_start();
R.- Esto es un pequeño truco que se vale de la posibilidad de ejectar sentencias de JS en la barra
de Dirección del navegador. Sólo se debe, una vez en la página que queremos ver a otra resolución,
poner en la barra de dirección:
javascript:resizeTo(800,540);
Sacado de http://www.amarasoftware.com/flash-problem.htm
Al final de la pagina ( o después de los flash, porque el javascript se ha de ejecutar después de que
se hayan insertado los objetos incrustados en la pagina) se referencia a un javascript que contiene
el siguiente código:
objects = document.getElementsByTagName("object");
for (var i = 0; i <; objects.length; i++)
{
objects[i].outerHTML = objects[i].outerHTML;
}
El javascript rescribe todos los objetos de la pagina, y estos se inicializan automáticamente. Esta
solución es ideal para mantener la funcionalidad de forma sencilla en las paginas que ya están
funcionando, incluyendo este código en el pie de pagina funcionaran todos los flashes que haya en
el sitio web.
Ej.
<;div id="NoFlashContent">;
Contenido para quien no tenga flash
- navegación alternativa
var enableeffect=true
var selection=new Array()
selection[0]='<a href="http://www.gamarod.com.ar" class="Texto">Home Page</a><br>'
selection[1]='<a href="mailto: gamarod@yahoo.com" class="Texto">Contactame</a><br>'
selection[2]='<a href="http://server2046.virtualave.net/gamarod/buscar.htm "
class="Texto">Buscador de Rutinas</a><br>'
selection[3]='<a href="http://server2046.virtualave.net/gamarod/lista.htm " class="Texto">Lista de
Correo</a><br>'
selection[4]='<a href="http://server2046.virtualave.net/gamarod/firmar.htm " class="Texto">Firmar el
Libro</a><br></font>'
if (document.layers)
document.menu01.document.menu02.visibility='show'
function dropit2(){
if (document.all){
menu03.style.left=document.body.scrollLeft+event.clientX-event.offsetX
menu03.style.top=document.body.scrollTop+event.clientY-event.offsetY+18
if (menu03.style.visibility=="hidden"){
if (enableeffect)
menu03.filters.revealTrans.apply()
menu03.style.visibility="visible"
if (enableeffect)
menu03.filters.revealTrans.play()
}
else{
hidemenu()
}
}
}
function dropit(e){
if (document.menu03.visibility=="hide")
document.menu03.visibility="show"
else
document.menu03.visibility="hide"
document.menu03.left=e.pageX-e.layerX
document.menu03.top=e.pageY-e.layerY+19
return false
}
function hidemenu(){
if (enableeffect)
menu03.filters.revealTrans.stop ()
menu03.style.visibility="hidden"
}
function hidemenu2(){
document.menu03.visibility="hide"
}
if (document.layers){
document.menu01.document.menu02.captureEvents(Event.CLICK)
document.menu01.document.menu02.onclick=dropit
}
else if (document.all)
document.body.onclick=hidemenu
</script>
<div id="menu03" style="position:absolute;left:0;top:0;layer-background-color:#E6E6E6;background-
color:#E6E6E6;width:200;visibility:hidden;border:2px solid black;padding:0px">
<script language="JavaScript1.2">
if (document.all)
menu03.style.padding='4px'
for (i=0;i<selection.length;i++)
document.write(selection[i])
</script>
</div>
<script language=" JavaScript1.2">
if (document.layers){
document.menu03.captureEvents(Event.CLICK)
document.menu03.onclick=hidemenu2
}
</script>
<br><br><br>
</BODY>
</HTML>
Ejemplo:
--------
<?php
$semana = array("lunes", "martes", "miércoles", "jueves", "viernes",
"sábado", "domindo");
echo count($semana);
reset($semana);
?>
Recorrer una tabla con las funciones anteriores se hace un poco lioso,
para ello se recomienda utilizar la función each():
<?php
reset($visitas);
{
echo "el día $clave ha tenido $valor visitas<BR>";
}
?>
Para iniciar una sesión lo haremos con la función session_start() y luego, las variables que
queramos mantener durante toda la visita del usuario las guardaremos en la variable $_SESSION.
Siempre que queramos utilizar las sesiones deberemos llamar antes a session_start() y siempre
antes que cualquier salida. Es decir, antes que "<html>" e incluso antes que cualquier echo o
función que imprima en pantalla.
Vamos a hacer un ejemplo para ver como funcionan las sesiones. Crearemos dos páginas,
"uno.php" y "dos.php". En la primera pondremos lo siguiente:
<?php
session_start();
$_SESSION['usuario'] = 'WebTaller';
?>
<html>
<head>
<title>Prueba de sesión</title>
</head>
<body>
<a href='dos.php'>Ir a la segunda página</a>
</body>
</html>
En esta primera página iniciamos la sesión y guardamos en la sesión el valor 'WebTaller' con
nombre 'usuario'. En la página "dos.php" pondremos el siguiente código:
<?php
session_start();
echo $_SESSION['usuario'];
?>
Si abrimos uno.php en el navegador y hacemos click en el enlace, iremos a la página dos.php donde
veremos imprimido 'WebTaller' si todo ha ido bien.
Esto es la base de las sesiones, y lo podemos aplicar por ejemplo para identificar a un usuario y
mantenerlo identificado durante toda su visita.
Trabajando con sesiones siempre tendremos que tener en cuenta:
En estos ejemplos estoy usando FPDF, que es una clase escrita en PHP para crear documentos
PDF, es completamente gratuita. [ Descargar FPDF].
<?php
require('fpdf.php');
$pdf=new FPDF();
$pdf->AddPage();
$pdf->SetFont('Arial','B',16);
$pdf->Cell(40,10,'Este es un ejemplo de creación de un documento PDF con PHP');
$pdf->Output();
?>
Con AddPage() agregamos una página y recibe como parámetro la orientación, pero si no se le
asigna una aquí, tomará el valor que se haya pasado al crear el objeto.
SetFont() define el formato de fuente con el que vamos a escribir texto en el documento. Puede
recibir por parámetro la familia (Arial, Courier, Times, etc), si no se define una familia (es decir, se
manda una cadena vacía) la famlia que se usará será la que se esté usando desde el principio del
documento.
Cell() inserta una celda en el documento. En este ejemplo solo se pasaron como parámetro el ancho
de la celda (40), el alto (10) y el texto que está dentro de la celda (Este es un ejemplo de creación
de un documento PDF con PHP). Estos parámetros son opcionales y podemos ver la lista de
parámetros que pueden usarse con Cell() en el manual de FPDF, en la sección donde se explica
Cell.
Por último, Output(), como su nombre lo dice, je, manda la salida del archivo a PDF y como por arte
de magia, tenemos un archivo pdf creado con PHP.
<?php
function codificador_hexa ($email_address) {
$codificado = bin2hex("$email_address");
$codificado = chunk_split($codificado, 2, '%');
$codificado = '%' . substr($codificado, 0, strlen($codificado) - 1);
return $codificado;
}
$em ='direccion@dominio.com';
$email = codificador_hexa($em);
echo '<a href="mailto:'.$email.'">Contactar</a>';
?>
Para poder ejecutar PHP dentro de un fichero CSS lo que necesitamos es especificar dentro de un
PHP un content-type como text/css:
Así pues lo que tendríamos, por ejemplo sería un archivo estilo.php que ejecutará comandos PHP y
que se "renderizará" en el cliente como una hoja de estilos. Para incluirlo dentro de nuestros
documentos lo haríamos con la siguiente instrucción:
break;
case "Tuesday":
echo "body {background-color: #CCFFCC;}";
break;
case "Wednesday":
echo "body {background-color: #336699;}";
break;
case "Thursday":
break;
}
?>
Quizá la funcionalidad más interesante sea la de servir determinados aspectos del CSS en función
del navegador cliente a través de la variable $HTTP_USER_AGENT variable. En este ejemplo, en
función de si el navegador es Internet Explorer o FireFox, se otorgan unas características u otras al
div "contenedor".
<?
header("Content-type: text/css");
if (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE')== true) { ?>
#contenedor {
margin-left:30px;
width: 700px;
text-align:left;
background-color:#FF0000;
}
<? } else if (strpos($_SERVER['HTTP_USER_AGENT'], 'Firefox') == true)
{?>
#contenedor {
margin-left: 50px;
width: 650px;
text-align:left;
}
<?
}
?>
Descripción
mixed eval ( string cadena_codigo )
eval() evalúa la cadena dada en cadena_codigo como código PHP. Entre otras cosas, esto puede
ser útil para almacenar código en un campo de texto en una base de datos para su ejecución
posterior.
Existen algunos factores a tener en cuenta cuando se usa eval(). Recuerde que la cadena pasada
debe ser código PHP válido, incluyendo cosas como la terminación de sentencias con un punto-y-
coma de modo que el intérprete no falle en la línea siguiente al llamado a eval(), y escapar
apropiadamente las cosas en cadena_codigo.
Recuerde también que las variables que reciben valores bajo eval() conservarán esos valores en el
script principal más adelante.
Una sentencia return finalizará la evaluación de la cadena inmediatamente. A partir de PHP 4, eval()
devuelve NULL a menos que se llame return en el código evaluado, en cuyo caso el valor pasado a
return es devuelto. En caso de que ocurra un error de análisis sintáctico en el código evaluado,
eval() devuelve FALSE. En caso de que ocurra un error fatal en el código evaluado, el script
completo finaliza. En PHP 3, eval() no devuelve un valor.
<?php
$cadena = 'taza';
$nombre = 'cafe';
$cad = 'Esta es una $cadena con mi $nombre en ella.' ;
echo $cad. "\n";
eval("\$cad = \"$cad\";" );
echo $cad. "\n";
?>
Sugerencia: Como con todo lo que presenta un resultado directamente en el navegador, se pueden
utilizar las funciones de control de salida para capturar el resultado de esta función y grabarlo - por
ejemplo - en una string.
Recoge los campos de un formulario enviado por metodo POST, y los almacena en variables que
tienen por nombre el "name" que se le pone en el formulario a cada campo.
<?
foreach($_POST as $nombre_campo => $valor)
{
$asignacion = \"$\" . $nombre_campo . \"=\'\" . $valor . \"\';\";
eval($asignacion);
}
/*
Se realiza un bucle foreach que va recorriendo cada uno de los elementos del post. En cada
iteración, se van accediendo a todos los elementos del post y se guarda en $ nombre_campo el
nombre del campo recibido por el formulario y en $valor, el valor que se había introducido en el
formulario.
Todo lo anterior se deduce de la primera línea. En las siguientes se compone en cada iteración,
cada una de las asignaciones que deberíamos haber escrito manualmente. Es decir, en la variable
asignación guardaremos una línea de código PHP que realiza la declaración de la variable de
formulario dentro de PHP y su inicialización con el valor que se hubiera escrito.
En la siguiente línea, donde está la función eval(), se ejecuta la sentencia generada en el anterior
paso. La función eval() de PHP ejecuta el contenido de una cadena de caracteres como si fuera una
sentencia PHP. (Podemos ver la documentación de la función eval() en la página de PHP
http://es.php.net/manual/es/function.eval.php)
*/
?>
El código del paginador fué desarrollado por "Jossmorenn", que si no me equivo es un usuario de
forosdelweb.com, pueden contactarlo desde esa web. Al resto de las cosas la incorporó Leonardo A.
Correa. Obviamente el código es tatalemte abierto y perfectamente modificable por todos. Por lo que
recomiendo detallar las correspondientes fuentes.
Vale aclarar que este código ya se encuentra maquetado con tablas y con CSS, así que no debes
hacer casi nada, salvo incluir los nombres de tablas que vas a manejar y los datos para la conexión
a tu base de datos.
Se incluye en el paquete de descarga de este paginador el fichero CSS, un archivo JVS para hacer
funcionar el menú desplegable y los respectivos includes en php para hacer funcionar el buscador.
El buscador trabaja mediante el comando MySQL "LIKE" se podría mejorar mediante incluir
comparaciones anidadas, pero creo que de la forma en que está funcionará bien para búsquedas
específicas. Además no complicamos tanto la existencia a los novatos.
Como había dicho antes se incluye un menú desplegable dinámico hecho con CSS y con Java
Script para listar categorías.
EL CÓDIGO:
<?php
// Inclusión de Buscador y menú desplegable Java Script, conexiones MySQL para listar y otras
modificaciones varias por: Web Proyecto
?>
<?php
$currentPage = $_SERVER["PHP_SELF"];
$maxRows_Rs = 6;// este numero es el numero de resultados que quieren que se vean por pagina
pueden poner algo asi: $maxRows_Rs = 6; para ver paginas con 6 resultados
$pageNum_Rs = 0;
if (isset($_GET['pageNum_Rs'])) {
$pageNum_Rs = $_GET['pageNum_Rs'];
mysql_select_db($database_pellegrini, $conn);
$id = $_GET['id'];
//*BUSCADOR DE REGISTROS!*/
if ($_GET['buscar'])
$buscar = $_GET['buscar'];
$row_Rs = mysql_fetch_assoc($Rs);
if (isset($_GET['totalRows_Rs'])) {
$totalRows_Rs = $_GET['totalRows_Rs'];
} else {
$all_Rs = mysql_query($query_Rs);
$totalRows_Rs = mysql_num_rows($all_Rs);
$totalPages_Rs = ceil($totalRows_Rs/$maxRows_Rs)-1;
$queryString_Rs = "";
if (!empty($_SERVER['QUERY_STRING'])) {
$newParams = array();
array_push($newParams, $param);
if (count($newParams) != 0) {
?>
<head>
</head>
<body>
<table width="770" height="35" border="0" align="center" cellpadding="0" cellspacing="0">
<tr bgcolor="#FCFCFC">
</div></td>
</tr>
</table>
<tr>
<div align="right"></div></td>
</tr>
</table>
<tr>
<tr>
<tr bgcolor="#F9F9F9">
</tr>
</table>
Marcar Imágenes en PHP
Marcar Imágenes en PHP
Con bastante frecuencia me encuentro a webmasters preocupados por que otros webmasters les
roben sus imágenes o que las pongan en otras webs sin mencionar el sitio original. Una solución
bastante eficiente para este problema es añadir una marca en una parte de la imagen con la url de
nuestro sitio web de tal forma que cuando alguien la coloque en algún otro lugar siempre se podrá
ver de donde proviene
Esto se puede hacer facilmente con PHP gracias a la biblioteca gráfica GD. Primero guardaremos
las imágenes que vayamos a mostrar con la marca en un directorio que no sea accesible desde la
web como puede ser un directorio protegido con htaccess o en su defecto un directorio con un
nombre extraño, para que nadie lo pueda encontrar. Nosotros las guardaremos en
/imgimgimgimgxz321zx/ . Crea un directorio en el directorio raiz de tu web que siga las directrices
que hemos explicado y sube ahí las imágenes.
Una vez hecho esto, necesitaremos el script PHP que muestra la imagen con su marca. Veamos
como hacerlo:
<?php
if(!isset($_GET['imagen'])) {
$imagen = '';
$ext = '';
} else {
$imagen = $_GET['imagen'];
$ext = strtolower(end(explode(".",$_GET['imagen']))); // Obtenemos así la extensión de la imagen
$bg = imagecolorallocate ( $im , 255 , 255 , 255 ); // El primer color que indiquemos será el color de
fondo
$textcolor = imagecolorallocate ( $im , 0 , 0 , 0 ); // Color negro para el texto
if($ext == "jpeg" || $ext == "jpg") { // Creamos una imagen desde una imagen jpeg
$im = imagecreatefromjpeg($dir.$imagen);
} elseif($ext == "gif") {
$im = imagecreatefromgif($dir.$imagen);
} else {
$im = imagecreatefrompng($dir.$imagen);
/* Ahora dibujaremos un rectángulo para que no tengamos problemas si la imagen es del mismo
color que le texto que vamos a escribir en ella */
$fontwidth = imagefontwidth(5);
$fontheight = imagefontheight(5);
imagefilledrectangle($im,0,$alto-20,$recuadro_ancho,$alto-5+$recuadro_alto,$blanco);
imagestring($im,20,0,$alto-20,$url,$negro);
imagejpeg($im,'',90);
?>
Guardaremos este código en un archivo llamado "mostrar.php" y ya está! Ya tenemos el script que
nos marca las imágenes!
Ahora solo queda utilizarlo en nuestra web. Por ejemplo donde antes teníamos la imagen así:
<img src="coche.jpg">
<img src="mostrar.php?imagen=coche.jpg">
Por supuesto, la imagen coche.jpg debe estar en el directorio que ya mencionamos anteriormente y
ahora si abrirmos nuestra web veremos como aparece la imagen imagen con una marca abajo a la
izquierda con la url de nuestra web.
A partir de esta idea se pueden conseguir otros tipos de marcas como por ejemplo poner el logo de
la web o que el texto sea más transparente y no dañe tanto a la imagen. Puedes encontrar más
información sobre la biblioteca GD aquí http://es2.php.net/gd
Antes Después
Lo que nos ocupa aquí es la forma de leer este tipo de archivos. Lo haremos gracias a la función
fgetcsv()
<?php
$fp = fopen ( "archivo.csv" , "r" );
while (( $data = fgetcsv ( $fp , 1000 , "," )) !== FALSE ) { // Mientras hay líneas que leer...
$i = 0;
foreach($data as $row) {
echo "Campo $i: $row<br>n"; // Muestra todos los campos de la fila actual
$i++ ;
echo "<br><br>nn";
}
fclose ( $fp );
?>
Este ejemplo muestra todo el contenido de un archivo csv en pantalla y modificando un par de cosas
podremos utilizarlo para generar una tabla con contenido o para volcar un archivo .csv a una base
de datos.
Comprobar si existe el dominio del
correo en PHP
Comprobar si existe el dominio del correo en PHP
Taller de PHP en el que vamos a utilizar una serie de funciones que nos permitirán verificar si
existe el dominio de un correo dado.
En Php existen varias funciones que nos permite obtener la veracidad de direcciones URL, DNS o
IPS.
Algo que puede resultar muy útil si queremos comprobar, si existe el dominio del correo aportado
por el usuario, Sin embargo solo comprueba el dominio, no si la cuenta de correo existe.
Su sintaxis es la siguiente:
Busca en DNS entradas del tipo type correspondientes a host. Devuelve verdadero(TRUE) si
encuentra algún registro; devuelve false( FALSO) si no encuentra ninguno o sucedió algún error.
type puede ser: A, MX, NS, SOA, PTR, CNAME, o ANY. Por defecto es MX.
El código es el siguiente:
<?? <?php
function validar_email($email){
$exp = "^[a-z'0-9]+([._-][a-z'0-9]+)*@([a-z0-9]+([._-][a-z0-9]+))+$";
if(eregi($exp,$email)){
if(checkdnsrr(array_pop(explode("@",$email)),"MX")){
return true;
}else{
return false;
}
}else{
return false;
}
}
// para aplicarla
if (validar_email($_GET[correo])){
// coloco las instrucciones
echo 'Es correcto el correo';
}else{
echo 'Es falso el correo';
}
?>
Explicación:
Lo primero es definir nuestra función, que tendrá como nombre validar_email(). Utilizaremos
Expresiones regulares para buscar las coincidencias y similitudes entre la expresión ($exp) y el valor
de ($email).
Ver: http://www.php.net/eregi
Si esta condición evalúa TRUE entonces quiere decir que efectivamente $email, Comienza por
cualquier letra que vaya de [a-z] , [0-9], puede contener un guión, punto u otro, seguido de una
@( arroba como obligatorio) y luego se repetiría el proceso para el nombre del dominio, y finalmente
un (.) PUNTO como obligatorio, donde continuaría la extensión del dominio como final de la cadena.
Ahora ejecutamos la función checkdnsrr(), Como ya dije anteriormente siempre y cuando eregi,
tome el valor TRUE, Con la función explode() dividimos el valor de $email en un ARRAY o MATRIZ,
tomando como punto de separación la @ ARROBA. Recordemos que ahora tenemos un Array
donde [0] es el usuario del correo y [1] es el domino del correo. Para luego obtener este ultimo valor
[1] de la matriz con array_pop().
El siguiente parámetro corresponde a buscar las entradas de tipo MX que es el default de esta
función.
Un ejemplo:
<?php
$codigohtml = '
<html>
<head>
<title>E-Mail HTML</title>
</head>
<body>
<a href="http://www.webtaller.com">Ir a WebTaller</a>
</body>
';
$email = 'pepito@grillo.com';
$asunto = 'E-Mail HTML';
$cabeceras = "Content-type: text/html\r\n";
mail($email,$asunto,$codigohtml,$cabeceras);
?>
De esta forma, los e-mails que enviemos se verán como una página Web. En las cabeceras
podemos añadir otras cosas, como por ejemplo si queremos especificar quien envía el e-mail
haremos:
Aparecerá por ejemplo "Thursday 17 de February del 2005", cosa que no quedará muy acorde con
nuestra página, si esta está en idioma Español.
La mejor solución es configurar las locales y PHP hará el resto por nosotros. Las locales son
traducciones de cosas básicas, como la fecha, que suelen venir en el sistema operativo. Veamos
como configurar las locales para el idioma Español:
set_locale(LC_ALL,"es_ES@euro","es_ES","esp");
Ponemos varias opciones por si la primera no está disponible, saltará a la siguiente y así
sucesivamente. Si ahora probamos el mismo código:
<?php
set_locale(LC_ALL,"es_ES@euro","es_ES","esp");
echo strftime("%A %d de %B del %Y");
?>
Si no disponemos de locales, podemos hacer la traducción nosotros mismos. Por ejemplo, para el
día de la semana haríamos algo así:
<?php
$dias = array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sábado");
echo "Hoy es ".$dias[date('w')];
?>
Para ello, lo más sencillo es utilizar la función explode. Con ella podremos dividr una cadena en
varias partes indicando un separador. En el primer caso, el del e-mail, el separador sería la arroba
(@). Veamos como funciona:
<?php
$email = explode("@","usuario@email.dom");
?>
En la variable $email ahora tenemos un array con dos valores. En la primera posición, tenemos
"usuario" y en la segunda "email.dom".
También podemos usar la construcción list() que permite asignar el valor a varias variables
directamente. Veamos como hacer el segundo caso, el de la fecha, con list. El separador en el caso
de la fecha es el guión. Veamos:
<?php
$fecha = "12-01-2005";
list($dia,$mes,$anyo) = explode("-",$fecha);
En esta oportunidad le voy a explicar de una manera entendible, como proteger una carpeta o las
carpetas de nuestra web de una forma fácil, primero entendamos que esta nota es para web que
estén hospedadas en servidores que permitían modificar los archivos .htaccess y .htpasswd que la
mayoría de las veces son los servidores pagos.
Lo primero que vamos hacer es crear la carpeta en el servidor que vamos a proteger la llamaremos
protegida (o lo que quieran) o si ya la tenemos obviemos este paso.
Ahora miramos dentro de esa carpeta que hemos creado y revisamos que no se encuentre un
archivo llamado .htaccess (tenemos que revisarlo directo del servidor dado que por vía ftp no
aparece)
La mayoría de las veces no aparece pero por si a caso, ahora bien creamos en nuestra pc un
archivo de texto que llamaremos - htaccess.txt y dentro metemos lo siguiente:
AuthUserFile /home/virtual/site0/fst/var/www/html/protegida/.htpasswd
AuthGroupFile /dev/null
AuthName Mi Web Carpeta Protegida"
AuthType Basic
<Limit GET>
require user webmaster
</Limit>
Ahora creamos una archivo de texto que llamaremos htpasswd.txt que es el que contendra los
logines y claves de esta forma por linea:
tony:vsfgf1546v5!
raul:1f54drt54g21
Ósea (login:clave) creo que se dieron cuenta que la clave es encriptada pero tranquilos les voy a dar
un script que encontré en internet para encriptar claves pero primero terminemos con esto.
Ahora suben los dos archivos (htaccess.txt y htpasswd.txt ) a la carpeta de su servidor quieran
proteger en este caso "/protegida" por medio de ftp pero de forma ASCII y los renombramos así:
( htaccess.txt = .htaccess ) (htpasswd.txt = .htpasswd) y listo ya tenemos la carpeta protegida.
* Ahora les paso lo prometido un script para encriptar claves que encontré por internet:
<?
//Script en PHP para encriptar contraseñas y poder usarlas en el archivo .htpasswd:
//Comentario añadido por amen:
// Tener el cuenta que el formato en un fichero de
// password es:
// login:pwdencriptado
if (!isset($submit)) {
?>
<BR>ENCRIPTAR PASSWORD
<br><br><FORM METHOD="POST" ACTION="encrypt.php">
<p>Password: <INPUT TYPE="TEXT" NAME="password"></p>
<p><input type="submit" value="Encriptar" name="submit"></p>
</FORM>
<?
}
if (isset($submit)) {
$password_encr=crypt($password,CRYPT_STD_DES);
echo "<br>ENCRIPTAR PASSWORD";
echo "<br><br>Encriptación de <b>$password</b> :";
echo "<br>$password_encr";
?>
<BR><br>Nueva Encriptación:
<br><br><FORM METHOD="POST" ACTION="encrypt.php">
<p>Password: <INPUT TYPE="TEXT" NAME="password"></p>
<p><input type="submit" value="Encriptar" name="submit"></p>
</FORM>
<?
}
?>
Sin embargo existe una forma que "DIFRAZA" la url, por decir alguna palabra, sin modificar la
funcionalidad de nuestra página; editando el archivo .htaccess que debe ubicarse al comienzo de
cada directorio.
<? RewriteEngine on
RewriteRule ^.*$ index.php
?>
Ya no tendremos ningún problema con los motores de búsqueda. Ahora nos queda una tarea
sumamente sencilla.
¿Como extraer esos valores que se almacenan en esa url?
Ciertamente $REQUEST_URI, nos devuelve todo el fragmento o path físico de la url actual. Lo
siguiente seria utilizar una función que nos permita dividir esa url; utilizando la / (Barra) como punto
de referencia, pudiese ser con explode() que nos devuelve una matriz con las cada una de las
partes.
Código Fuente:
<? PHP
$aux = substr( $_SERVER['REQUEST_URI'], strlen('/'));
if( substr( $aux, -1) == '/'){
$aux=substr( $aux, 0, -1);
}
$urlARRAY___ =explode( '/', $aux);
/////////////VALORES A UTILIZAR
$CATEGORIA=$urlARRAY___[0];
$SUBCATEGORIA=$urlARRAY___[1];
$ID=$urlARRAY___[2];
?>
<?php
$busqueda = "prueba";
$link = mysql_connect("host","user","pass");
mysql_select_db("db",$link);
$result = mysql_query("SELECT contenidos FROM tabla WHERE keyword LIKE '%$busqueda%'",
$link);
while($row = mysql_fetch_row($result)) {
?>
<?php
function cut_string($string, $charlimit)
{
if(substr($string,$charlimit-1,1) != ' ')
{
$string = substr($string,'0',$charlimit);
$array = explode(' ',$string);
array_pop($array);
$new_string = implode(' ',$array);
La Escuela Imperial de Ingenieros ha medrado, al igual que los Colegios de la Magia y el ejército, el
cual ha batallado alcanzando victorias y más ...
Código en PHP para el envio de boletines a emails almacenados en una base de datos.
Ahora está muy de moda el envío de boletines para informar de las novedades en las webs. El único
problema es que para hacerlo, la mayoría de webmasters tienen que depender de alguna empresa
(o servidor) que les gestione la base de datos y les envíe los emails cuando lo requieran.
En este artículo explicaré paso a paso como crear la tabla (en la base de datos MySQL) necesaria
para el almacenamiento de los emails y posteriormente, cómo enviar un boletín a todos ellos, con el
aliciente de que no aparezcan todos los destinatarios en el campo "Para:" del mensaje.
Mediante su gestor de la base de datos MySQL (seguramente "phpMyAdmin") debe crear una nueva
tabla en su base de datos. Aquí le facilitamos el archivo de texto para ello:
Tras esto usted ya tiene la tabla necesaria para almacenar los datos dentro de una base de datos
MySQL. Podría explicar como introducir los datos en esta tabla mediante formularios de registro...
pero eso ya lo dejo a gusto del webmaster.
Para enviar el boletín solo debe cambiar los datos del siguiente archivo php por los de su base de
datos y tendrá listo su archivo. Para enviar el boletín solo tiene que ejecutar este archivo en su
servidor (cargarlo: por ejemplo, entrar en http://usuarios.lycos.es/tunombredeusuario/prueba.php):
<?php
$mi_conexion=mysql_connect('servidor','nombre_de_usuarior','contraseña') or die('No se puedo
conectar con la base de datos!');
/*
Servidor: aquí debe poner la dirección de su servidor, en la mayoría de las compañías es 'localhost'
Nombre_de_usuario: debe pone su nombre de usuario en el servidor.
Contraseña: su contraseña.
*/
mysql_select_db('base_de_datos',$mi_conexion);
/*
Base_de_datos: nombre de su base de datos.
*/
/*
Email: es el nombre del campo que requerimos, si ha seguido nuestras instrucciones creando
nuestra misma tabla en la base de datos no debe cambiar esto.
Usuarios: es el nombre de la tabla donde está el campo 'email', si ha seguido nuestras instrucciones
creando nuestra misma tabla en base de datos no debe cambiar esto.
*/
$largo=strlen($losemails);
if ($largo>2)
{
//quitamos ultimos ", "
$losemails=substr($losemails,0,$largo-2);
}
else
{
echo "No hay destinatarios!";
die();
};
/*
Aquí debe poner su email en formato HTML
*/
$envia='enviante';
$remite='email_remitente';
/*
Enviante: Nombre del enviante
Email_remitente: email que desea mostrar como remitente.
*/
mysql_free_result($Tabla);
mysql_close($mi_conexion);
?>
El único problema que presenta este sistema es que al no aparecer nada en el campo "Para:" del
email, algunos gestores de email lo colocan como "correo no deseado". Acepto contribuciones de
otros lectores para mejorarlo.
<?php
//Copyright © McAnam.com
function textobarras($textohtml) {
$textohtml=str_replace("n","<br>",$textohtml);
$textohtml=str_replace("t"," ",$textohtml);
return $textohtml;
}
?>
Las sesiones de PHP son una herramienta muy usada en el desarrollo de web: permiten 'recordar'
datos del usuario entre una visita y otra. Un ejemplo tipico es recordar que un usuario esta loggeado
en un sitio, para que no tenga que ingresar su password nuevamente cuando vuelve a entrar.
Ivan R. describio en un documento como es posible tomar el control de sesiones abiertas por otros
usuarios de maneras bastante sencillas (esto trae muchos problemas se seguridad, como podran
imaginarse).
Aqui les propongo unas piezas de codigo que hacen mucho mas seguras las sesiones: al encriptar
ciertos datos, se vuelve imposible que otros usuarios puedan espiar las sesiones de los usuarios y
tambien impide que malvados hax0rs tomen el control de nuestras sesiones.
Las sesiones de PHP funcionan asi: cuando el usuario entra por primera vez al sitio, se le envia una
cookie que contiene un identificador (llamado session id o SID). Luego desde el PHP se pueden
asociar datos a este identificador.
Cada vez que el usuario entra al sitio, el sistema de sesiones trae los datos que corresponden a
este usuario (en realidad, los que corresponden al identificador de la cookie).
Tambien PHP ofrece otra manera de pasar el SID, cuando browsers no soportan cookies: en estos
casos, es posible pasar el SID por el URL.
2) Cuando la aplicacion PHP esta alojada en un servidor compartido (webhosting barato), cualquier
usuario puede ver los SESSIONIDs ejecutando simplemente "ls /tmp/sess_*"
Otro problema es que cualquier usuario con permisos para leer archivos del webserver puede ver el
contenido de las sesiones, con solo abrir el archivo de session que desee (/tmp/sess_*)
Soluciones:
PHP permite especificar funciones alternativas para manejar las sesiones. Usando este feature
(session_set_handler) desarrolle unas funciones que teoricamente solucionan este problema:
La idea es, que aparte de la cookie de session se le envia otra que contiene una cadena de texto
generada al azar.
Luego el nombre del archivo donde estan guardados los datos de la sesion es generado por el hash
MD5 resultante de concatenar el ID de session y el KEY (o sea, $filename="sess_sec_".md5($SID.
$KEY);). Haciendo esto logramos que sea imposible deducir el ID de la session viendo el nombre del
archivo que contiene los datos y mas importante, hacemos que sea imposible tomar el control de
una session engañando al servidor pasandole el SID, porque con un KEY equivocado (o vacio), el
server no encontrara el archivo que contiene los datos de la sesion y creara una nueva.
Para agregar una capa mas de seguridad y prevenir otros ataques, los datos de sesion guardados
en el archivo estan encriptados usando la cadena KEY de password, por lo que solamente el
poseedor de la KEY correcta podra tener acceso a los datos (asi evitamos que otros usuarios del
mismo servidor metan las narices en nuestras sesiones).
Aun faltan definir algunas funciones del sistema de sesiones, pero yo no las use nunca, asi que por
ahora, no las voy a implementar
Aunque los problemas de seguridad que planteo no preocuparan a mas de uno, es bueno saber que
las sessiones no son 100% seguras y que existen alternativas faciles de solucionar el problema
(solo hace falta insertar las funciones y usar las funciones de sesion comunmente)
# Apart from the session cookie we set another one, with the same name plus
# '_sec' at the end
# On that cookie, we set a random 32byte string (I'll refer to this string
# as 'key')
if (!isset($_COOKIE[$sess_sec])){
$md5=md5(uniqid(''));
setcookie($sess_sec,$md5,ini_get('session.cookie_lifetime'),
ini_get('session.cookie_path'),
ini_get('session.cookie_domain'));
$_SEC_SESSION['int']['key']=$_COOKIE[$sess_sec]=$md5;
$_SEC_SESSION['data']=serialize(array());
$empty=1;
}else{
$_SEC_SESSION['int']['key']=$md5=$_COOKIE[$sess_sec];
}
$_SEC_SESSION['int']['filename']=$filename_sec="$sess_path/sec_sess_".md5(session_id().$md5);
if (isset($empty)){
return 1;
}
if (!file_exists($filename_sec)){
fclose(fopen($filename_sec,'w'));
}
if (!$_SEC_SESSION['int']['fd']=fopen($filename_sec,'r')){
$_SEC_SESSION['data']=serialize(array());
return 0;
}
$data_enc=fread($_SEC_SESSION['int']['fd'],filesize($filename_sec));
fclose($_SEC_SESSION['int']['fd']);
if ($data_enc!=''){
$cipher=MCRYPT_DES;
$data=@mcrypt_ecb($cipher,$_SEC_SESSION['int']['key'],$data_enc,MCRYPT_DECRYPT);
}else{$data='';}
$_SEC_SESSION['data']=$data;
$_SEC_SESSION['int']['hash']=md5($_SEC_SESSION['data']);
return 1;
}
function sess_close(){
return true;
}
function sess_read($key){
return $GLOBALS['_SEC_SESSION']['data'];
}
function sess_write($id,$data){
global $_SEC_SESSION;
$sd=$data;
if ($_SEC_SESSION['int']['hash'] != md5($sd)){
$fd=fopen($_SEC_SESSION['int']['filename'],'w');
$cipher=MCRYPT_DES;
# Here we crypt the data with our key...
$data=@mcrypt_ecb($cipher,$_SEC_SESSION['int']['key'],$sd,MCRYPT_ENCRYPT);
fputs($fd,$data);
fclose($fd);
chmod($_SEC_SESSION['int']['filename'],0600);
}
}
function sess_destroy($key){
return(@unlink($GLOBALS['_SEC_SESSION']['int']['filename']));
}
function sess_gc($maxlifetime){}
session_set_save_handler('sess_open','sess_close','sess_read','sess_write','sess_destroy','sess_gc'
);
session_start();
if (!isset($_SESSION['times'])){
$_SESSION['times']=0;
}
$_SESSION['times']++;
print "This session ID is: ".session_id().
" but the name of the file that contains the data is ".
$_SEC_SESSION['int']['filename']."n";
print "Btw, this is the ".$_SESSION['times']." you see this page ;) (it works!)n";
?>
Introducción
Requerimientos
Conectarnos a la BD
Ahora simplemente nos conectamos a MySQL y seleccioanmso nuestra Base de Datos bd_banners.
Almacenar imágen en la BD
Antes de almacenar la imágen en la BD, debemos de procesarla para llegar a convertirla en datos
binarios.
$image = imagecreatefromgif('imagen.gif');
ob_start();
imagegif($image);
$jpg = ob_get_contents();
ob_end_clean();
NOTA: En este ejemplo se guarda una imágen tipo GIF, por eso se utilizan las funciones;
imagecreateformgif, imagegif. Si se desea almacenar una imágen tipo JPEG, utilizar las funciones;
imagecreatefromjpeg , imagejpeg. Asi solamente se cambia el tipo de imágen enlas funciones. Para
ver los tipos de imágenes que soporta PHP+GD da click aquí .
$jpg = str_replace('##','##',mysql_escape_string($jpg));
$result = mysql_query("INSERT INTO tbl_Banner SET Imagen='$jpg'");
Simplemente con esto guardamos la imágen en una variable y antes de mostrarla le decimos al
navegador que el contenido a mostrar es de imágen/gif. Se se va a mostrar imágenes JPEG cambiar
image/gif por image/jpeg y asi para los diferentes formatos.
$vector = array(
1 => "Nada nuevo hay bajo el sol, pero cuántas cosas viejas hay que no conocemos.",
2 => "El verdadero amigo es aquel que está a tu lado cuando preferiría estar en otra parte.",
3 => "La sabiduría es la hija de la experiencia.",
4 => "Nunca hay viento favorable para el que no sabe hacia dónde va.",
);
$numero = rand(1,4);
echo "$vector[$numero]";
Script completo
<?
// Completamos el vector con frases
$vector = array(
1 => "Nada nuevo hay bajo el sol, pero cuántas cosas viejas hay que no conocemos.",
2 => "El verdadero amigo es aquel que está a tu lado cuando preferiría estar en otra parte.",
3 => "La sabiduría es la hija de la experiencia.",
4 => "Nunca hay viento favorable para el que no sabe hacia dónde va.",
);
// Imprimimos la frase
echo "$vector[$numero]";
?>
Pasar la resolución de JavaScript a
PHP
En esta ocasión voy a mostrarles como pasar la resolución de JavaScript a PHP.
Todos sabemos que el lenguaje PHP, al ser del lado del servidor, no puede tomar nuestra
resolución. Pues, hay una forma sencilla de pasar las medidas de JavaScript a PHP con un solo
click!
Teniendo esto en cuenta, lo que haremos será un script, mezcla de PHP y JavaScript. Consistirá en
dos archivos: mostrar.php y getres.php .
El código es el siguiente:
<?
/******************************************
JavaScript to PHP Screen Resolution vBETA
by Lenn García
Date: 08-29-2004
******************************************/
?>
<script language="javascript">
function SetCookie() {
var width = screen.width;
var height = screen.height;
var res = width + 'x' + height;
document.cookie = 'PHPRes='+res;
location = '<?=$GLOBALS['siteurl'];?>';
}
• Antes de invocar al archivo getres.php debe definir una variable $GLOBALS con la
dirección de la página original ($_SERVER['REQUEST_URI']).
<?
$siteurl = $_SERVER['REQUEST_URI'];
$GLOBALS['siteurl'] = $siteurl;
require('getres.php');
echo $width.'x'.$height;
?>
Lo que hace el código es tomar la dirección desde el dominio principal (pero sin él), y luego
convertirla en variable super-global. Pide el archivo getres.php , y luego se muestran las variables.
Recuerda que debes tener habilitadas las cookies, en tu navegador, para poder utilizar este método.
Espero que esto te sea de ayuda, y cualquier cosa estoy en los foros
Enviando la imagen
La forma correcta de enviar una imagen al navegador es la siguiente:
<?
// Enviamos los encabezados de imagen png
Header( "Content-type: image/png" );
// Enviamos la imagen png
echo $imagen_png;
?>
La variable $imagen_png contiene la fuente de la imagen que podemos conseguir por ejemplo
leyendola de un archivo del servidor de la siguiente manera:
imagen.php
<?
Header( "Content-type: image/png");
$imagen_png = file_get_contents('imagen.png');
echo $imagen_png;
?>
Estos artículos son para servir imagenes en formato png (imagen.png), por eso enviamos el
encabezado Content-type: image/png, que en lugar de png, podria ser gif, jpg...
pagina.htm
<img src="imagen.php" border=0>
Y de esta manera, habremos combinado una imagen enviada por PHP y el contenido HTML.
En este articulo vamos a implementar una clase php que nos permita ordenar arrays con el clasico
algoritmo quick short, un algoritmo de ordenacion con una eficiencia en la busqueda muy alta.
En primer lugar la pagina php que nos servirá de ejmeplo para la clase:
ejemplo.php
<?
include('Quicksort.php');
$QS=new Quicksort;
$array=array('8','10','2','1','1','6','5','5','3'); $partido=$QS->QS_ordenaParteArray($array,2,5);
for($i=0;$i<count($partido);$i++)
echo $partido[$i]."n";
echo "n";
$QS->Quick_sort($array,0,count($array)-1);
for($i=0;$i<count($array);$i++)
echo $array[$i]."n";
?>
En primer lugar sacamos la ordenacion del array de ejemplo desde la posicion 2 a la 5. El segundo
ejemplo es la ordenacion del array completo.
Quicksort.php
<?
class Quicksort
{
function Quick_sort(&$array,$inicio,$fin)
{
$mitad=$array[floor(($inicio+$fin)/2)];
$i=$inicio;
$j=$fin;
do
{
while ($array[$i]<$mitad) $i++;
while ($array[$j]>$mitad) $j--;
if ($i<=$j)
{
$temp=$array[$i]; $array[$i]=$array[$j]; $array[$j]=$temp;
$i++; $j--;
}
} while ($i<=$j);
function QS_ordenaParteArray($array,$inicio,$fin)
{
$temp=array();
for($a=$inicio;$a<=$fin;$a++)
{
$temp[]=$array[$a];
}
$this->Quick_sort($temp,0,count($temp)-1);
return $temp;
}
}
?>
En resumen, una clase es una idea de un objeto que tiene sus carácterísticas, que a
partir de ahora llamaremos propiedades, y sus habilidades, su capacidad de realizar
ciertas acciones, que en programación llamaremos métodos. La clase coche, por
ejemplo, podría tener como propiedades el color, las puertas, el tamaño, la marca,
el modelo, la velocidad máxima, y como métodos las acciones de cambiar de
marcha, acelerar, frenar, abrir el capó, bloquear las puertas.
Pensemos en una aplicación que gestione los datos de los pacientes de una
consulta médica, de forma que en cada visita el médico pueda ver el historial del
paciente. Una opción recomendable para desarrollar este tipo de aplicación sería
crear una clase llamada Paciente y dotarla de propiedades como la edad, el sexo, el
peso, la estatura, el número de identificación y las observaciones. Podríamos
ampliar la aplicación creando una clase llamada Visita con propiedades como fecha,
hora y causa, y otra clase, por ejemplo, llamada Análisis que podríamos preparar
para representar los resultados.
Todas estas clases podrían ir entrelazadas desde los métodos. Por ejemplo, la clase
Paciente podría tener un método llamado nueva_visita que creara una nueva
instancia de la clase Visita y esta a su vez podría tener un método llamada
nuevo_analisis, que se aplicaría cuando el médico diese la orden a un paciente de
hacerse un Análisis.
<?php
class nombre_clase {
var $propiedad_1;
var $propiedad_2;
var $propiedad_3;
function método_1($parametro) {
instrucciones_del_método;
}
}
?>
Una vez definida la clase, que es el molde del objeto, se pueden crear instancias a
partir de ella. En PHP se hace de la siguiente forma.
<?php
$nombre_instancia = new nombre_clase($parametros);
?>
En PHP no hay una forma establecida de organizar las clases. Una buena forma de
hacerlo es escribiendo cada clase en un archivo distinto, de forma que a simple
vista y sin tener que ver el contenido se pueda saber dónde está cada una. Para
poder hacer uso de esa clase, es decir, para poder crear instancias de ella hay que
hacer que su definición se incluya, esté presente, en el archivo donde se cree su
instancia.
<?php
include("clases/class_persona.php");
$luis=new Persona();
?>
Sin la instrucción del include, que sustituye esa instrucción por el contenido de
class_persona.php, no se podría crear una instancia de la clase Persona, ya que la
aplicación no encontraría su definición en ningún sitio.
La única restricción del lenguaje, bastante lógica, es que no se puede definir una
clase dos veces, error en el que se puede caer símplemente haciendo más de una
llamada o inclusión al archivo de la clase. De esta forma no se puede hacer una
llamada al archivo que contiene la definición de la clase cada vez que se quiera
usarla, porque corremos el riesgo de, si tenemos un árbol de archivos algo
complejo, hacer dos veces el include y generar un error.
Una posible solución es hacer uso de la función include_once que previene este tipo
de situaciones. Incluye el archivo pasado por parámetro únicamente si antes no se
ha incluido. Si por el contrario detecta que ya se ha hecho una llamada no la vuelve
a hacer. La sintaxis es la misma.
<?php
include_once("clases/class_persona.php");
?>
Inclusión automática
Partiendo del include_once se puede hilar más fino y en base a ciertas capacidades
de PHP generar un código que guardado en un archivo incluya todas las clases de
golpe y porrazo, haciendo que nos despreocupemos de los includes. Se trata de
programar un script en PHP que lea todos los archivos de un directorio, y realice
una acción con cada uno de ellos. En este caso la acción a realizar es un
include_once.
<?php
$dir=opendir("./class");
while ($archivo=readdir($dir))
if ($archivo!="." && $archivo!=".." && $archivo!=" clases.php")
include_once($archivo);
closedir($dir);
?>
Paso a paso, este código abre el directorio situado en la ruta ./class, lee el listado
de archivos que hay dentro, y hace un include_once a cada archivo que se
encuentra, exceptuando clases.php, que es en el que se colocan estas líneas. Con
esto se consigue que en cada página de la aplicación sólo tengamos que hacer un
include al archivo clases.php para que se pueda usar cualquier clase definida en el
directorio.
<?php
include("class/clases.php");
?>
Herencia
PHP también está preparado para trabajar con la herencia de clases. El problema
surge al usar el sistema automático para incluirlas. Una clase no puede heredar las
características de otra, si no existe una definición previa de esa misma, como es
lógico. Por tanto, es probable que el código anterior reporte un error de ese tipo.
<?php
include_once("class_padre.php");
function método_1($parametro) {
instruccion_del_método;
}
}
?>
Cuando aprendemos nuestros primeros pasos con PHP, cualquier tutorial o manual que leemos, nos
enseña y vanagloria las bondades de poder incluir el código PHP directamente entre el HTML.
Entonces, es muy habitual ver ejemplos del tipo:
<html>
<head><title>Ejemplo de PHP embebido</title></head>
<body>
<?php
echo "Este texto se hace con PHP" ;
?>
</body>
</html>
Y como la mente y el alma de un principiante de cualquier tema, está preparada para aprender todo
lo que pueda, en el menor tiempo que pueda, toma este tipo de ejemplos como "verdades
universales" y comenzamos a ver código PHP embebido entre el HTML por TODOS lados. Pero no
hay que preocuparse, esto no es necesariamente malo, y todos lo hicimos en menor o mayor
medida al comenzar. Es un paso necesario que hay que aprender a superar. :D
Luego de un tiempo, y después de haber leido un poco más, aprendemos que todas las partes
comunes de código que son repetitivas, pueden residir en archivos separados y ser "Incluidas" en
nuestro código con tan solo el uso de una función:
<html>
<head><title>Ejemplo de PHP embebido</title></head>
<body>
<? include( 'includes/header.php' ); ?>
<table>
<tr>
<td width="120"> <? include( 'includes/menu.php' ); ?> </td>
<td>Aqui va el contenido del sitio web propiamente dicho. Recordar que es terriblemente MALO y
PERJUDICIAL para la salud de su sitio, utilizar archivos externos con extensión ".inc"</td>
</tr>
<? include( 'includes/footer.php' ); ?>
</table>
</body>
</html>
Entonces, ese es el momento en que include() se convierte en nuestro mejor amigo y descubrimos,
fascinados, como podemos lograr una verdadera mejora en el mantenimiento de nuestros sitios, al
tener que modificar 1 solo archivo y que este cambio, se vea reflejado en TODAS las páginas que
incluyan ese archivo. Hemos, señoras y señores, alcanzado el Nirvana.
Y si. Siempre existe una mejor manera de hacer las cosas. Y este caso no es la excepción.
Después de mucho pensar, y de mirar constantemente el código, una y mil veces, uno termina
siempre preguntándose : ¿Y si hiciéramos las cosas al revés? ¿Qué pasaría si en vez de incluir
todas las partes comunes de nuestro sitio (Header/Footer/etc), solamente incluyéramos el
contenido?
La primera cuestión que nos llega a la mente, es que sería necesario indicarle a nuestro
archivo.php, qué página queremos cargar. Veamos como podemos hacer esto :
<?php
// Leemos la variable que indica que página queremos cargar.
if(empty( $_GET [ 'modulo' ]))
$pagina = 'home.php' ;
else
$pagina = $_GET [ 'modulo' ];
include( 'includes/header.php' );
include( 'modulos/' . $pagina );
include( 'includes/footer.php' );
?>
De esta manera, si llamáramos a este archivo index.php , para cargar algún "modulo" de nuestro
sitio web, tan sólo deberíamos indicarlo en el URL, de esta manera :
http://www.nuestrositio.com/index.php?modulo=foro.php .
Vistas todas las desventajas de este primer acercamiento, veremos de que manera las podemos
solucionar con un poco de ingenio y mucho PHP.
Teniendo las consideraciones de seguridad y diseño en cuenta, vamos a desarrollar un sistema que
nos permita modularizar nuestro sitio, manteniendo cierta flexibilidad para poder indicar que Diseño (
o Layout, como lo llamaremos en el código ) utilizarán nuestros módulos. Además, mantendremos
un listado de todas las páginas que pueden ser invocadas, de manera que evitaremos que cualquier
archivo de los que el Webserver tenga acceso de lectura, pueden terminar "sin querer" en el
navegador de nuestro visitante.
Este listado podriamos guardarlo de diferentes maneras : archivos de texto con algún formato
estandar o propio, en una Base de Datos, en un archivo XML (como es costumbre en algunas
aplicaciones más complejas) o con tipos de datos propios del PHP (en este caso, arreglos). " Yo
escogo este último porque me place, vosotros podéis escoger el tipo que queráis " (los fanáticos de
Cha-Cha-Cha estarán esbozando una sonrisa). Y justifico mi decisión:
• No tengo personalmente nada en contra de los archivos de texto plano, pero parsear los
contenidos de uno, con el tipo de formato que sea, incluye cierta lógica de programación
extra innecesaria, ya que la idea es hacer las cosas lo más sencillas posibles y no al revés.
• Una base de datos definitivamente haría más sencillas las cosas, pero limitaría la utilidad de
este método a aquellos servidores que posean bases de datos. Se que los servidores que
no poseen bases de datos hoy por hoy son escasos, pero prefiero no basarme en esa
solución para hacer la aplicación lo más compatible posible.
• Muchos ven en el formato XML al "santo grial" de las soluciones para almacenar datos o
utilizarlos como sistemas de configuración. Y posiblemente para aplicaciones de escritorio
esto no sea tan errado, ya que el archivo XML se parsea una vez y luego se mantienen sus
datos en memoria durante toda la "vida" del programa. Pero en un ambiente web, sería
necesario no solo que el PHP tenga activada alguna de las opciones para trabajar con XML,
sino que se tendría que parsear el archivo XML ( con el gasto de recursos que esto conlleva
) una vez POR CADA pedido de página que se le hiciera el servidor. Definitivamente, NO.
Aparte, es un tutorial para principiantes, asi que vamos a hacer las cosas sencillas.
Así es que para nuestro sistema de configuración, vamos a utilizar los viejos y queridos arreglos
asociativos de PHP. El siguiente es un ejemplo básico para un sitio web realmente pequeño, pero ya
veremos de extenderlo a medida que nuestro ejemplo "evolucione".
Archivo conf.php:
<?php
/*
* Archivo de configuración para nuestra aplicación modularizada.
* Definimos valores por defecto y datos para cada uno de nuestros módulos.
*/
define ( 'MODULO_DEFECTO' , 'home' );
define ( 'LAYOUT_DEFECTO' , 'layout_simple.php' );
define ( 'MODULO_PATH' , realpath ( './modulos/' ));
define ( 'LAYOUT_PATH' , realpath ( './layouts/' ));
Aqui vemos, como en la primera parte de nuestro archivo, definimos algunas constantes que nos
van a servir: MODULO_DEFECTO, indicando cuál de los módulos cargar si no se indicó ninguno,
LAYOUT_DEFECTO que indica que "diseño" se utilizará por defecto en los módulos,
MODULO_PATH y LAYOUT_PATH, indicando directorios en los cuales vamos a almacenar
nuestros módulos y layouts. En el ejemplo, quedarán en dos directorios separados, pero podrían ser
el mismo sin problema.
Aqui vemos, que tenemos dos "módulos" en nuestra aplicación; "home" y "articulo" . Estos
nombres de índices, son los que le vamos a pasar a nuestra variable modulo , indicando a que
sección de nuestro sitio queremos acceder.
Como vemos, cada "sección" contiene ( o deberia indicar ) dos directivas: "archivo" y "layout" . El
primer valor es el nombre del archivo que efectivamente vamos a incluir, asociado con el nombre del
indice del arreglo. Esto soluciona en gran parte el problema de seguridad que nombramos
anteriormente, ya que no se indica directamente el nombre del archivo a incluir, sino que se indica a
través de un nombre ficticio, un alias.
El segundo valor, layout, es el nombre del archivo que contiene el diseño "base" de la aplicación.
Aqui tenemos dos opciones, indicar en el archivo de configuración el nombre del archivo de layout, o
expresar, mediante la constante definida antes, que cierto módulo utiliza el layout por defecto ( esto
ayuda a la claridad luego cuando se quiera revisar el archivo de configuración y se aconseja ). Como
podemos ver en el módulo "articulo", en este caso no se indica ningun archivo de layout. Esto
nosotros lo tomaremos como que al no indicarse, se desea utilizar el layout por defecto (Esta es una
opción realmente buena para los programadores holgazanes como yo, que no quieren escribir
grandes archivos de configuración).
Ya tenemos listo nuestro archivo de configuración, que servirá como columna vertebral de nuestra
nueva aplicación modularizable. Ahora veremos como lo utilizamos. Pero primero, veamos un poco
como organizaremos nuestro árbol de directorios en nuestra nueva aplicación, para tener todo bien
ordenado.
• includes/
• layouts/
• modulos/
• index.php
Así, vemos como tendremos un directorio para nuestros includes, uno para los módulos que
componen nuestra aplicación y otro para los distintos layouts. Recordemos que ahora, nuestro
archivo index.php será el único punto de entrada para nuestro sitio. Esto representa una ventaja ya
que podemos colocar alli todas las tareas repetitivas (inicialización de variables, conexión a una
base de datos, lectura de otros archivos de funciones o configuración, etc.). Otra de las ventajas es
que ante 1 cambio que afectaría a todo el sitio web, solo hay que realizarlo en 1 solo archivo,
solucionando alguno de los problemas que la metodología de varios archivos incluyendo partes
comunes acarreaba.
Archivo index.php:
<?php
// Primero incluimos el archivo de configuración
include( 'conf.php' );
Como bien explican los comentarios, lo que hacemos primero es incluir el archivo de configuración,
sin él no podríamos saber si un módulo está permitido o no, y que Layouts utilizar. Luego, validamos
que la variable " mod " contenga algo. De estar vacía o con un nombre de algún módulo inexistente
(segundo if() ), entonces hacemos que cargue el módulo por defecto, que está indicado en la
constante MODULO_DEFECTO. Lo mismo hacemos para el Layout a cargar, si no está indicado en
el archivo de configuración, tomamos por defecto el valor contenido en LAYOUT_DEFECTO.
Continuamos con nuestro index.php
Archivo index.php:
<?php
/** Aqui podemos colocar todos los comandos necesarios para
* realizar las tareas que se deben repetir en cada recarga
* del index.php - En el ejemplo, conexión a la base de datos.
*
* include('clases/class.DB.php');
* $db = new DB();
* $db->conectar();
*/
if ( file_exists ( $path_layout ))
include( $path_layout );
else
if ( file_exists ( $path_modulo ))
include( $path_modulo );
else
die( 'Error al cargar el módulo <b>' . $modulo . '</b>. No existe el archivo <b>' . $conf
[ $modulo ][ 'archivo' ]. '</b>' );
?>
Aqui vemos algo que comentábamos antes. Encerrado en comentarios, hay cierto código que
podemos incluir en nuestro index.php que, al ser ahora el único punto de entrada a todas las
páginas de nuestro sitio, será ejecutado para cada página. Ya no hay que repetirlo en todas las
páginas PHP, tan solo se coloca en el index.php . Esto es bueno, porque mientras menos repetición
de código haya, más sencillo de mantener es todo. Vemos alli como ejemplo, el código para incluir e
instanciar algún objeto de conexión a base de datos, pero podría ser cualquier otro código que
necesitemos ejecutar cada vez que se vea una página, como por ejemplo, algún Validador de
Usuarios registrados o el código necesario para dar seguimiento a las sesiones de Usuario.
Finalmente, nuestro archivo verifica que el archivo de Layout que se quiere incluir, exista primero.
De existir, entonces se incluye y ya veremos en un ejemplo, como nuestro archivo Layout debe
incluir luego, al archivo del módulo. Si no existiera el archivo de Layout, se intenta incluir
directamente el archivo del módulo que se pidió, sin Layout, y si éste archivo tampoco existiera
( demasiadas cosas que salen mal, no? ) entonces se muestra un error en la pantalla, indicando el
nombre del módulo y el archivo que no se pudo hallar.
Perfecto, ya tenemos todo listo para cargar los módulos que necesitemos. Ahora, veamos como
será un módulo de ejemplo y su archivo de Layout.
Creando Módulos
Tenemos dos opciones a la hora de crear un archivo de layout. Son las siguientes:
• Incluir Headers y Footers comunes a todas las páginas dentro del index.php, ANTES y
DESPUES de incluir el archivo de Layout, en el que dejaremos solo el diseño propio de la
página para que albergue al módulo. Esto es útil en el caso de que un archivo de Layout no
se encuentre o no sea necesario, y al incluir el Módulo, ya esté cargado el Header y luego
sea incluido el Footer.
• Hacer que el archivo de Layout, aparte de incluir el archivo del Módulo, sea el encargado de
incluir Headers y Footers, lo cuál puede ser útil si el diseño general de varias secciones del
sitio cambia drásticamente, como distintas subsecciones con Headers y Footers diferentes,
o en el caso de "Versiones para Imprimir" o la creación de versiones en PDF de ciertos
artículos.
Yo voy a elegir en este caso la segunda opción. Haré que el archivo de Layout 'layout_simple.php'
(el Layout por defecto, según el archivo de configuración) sea el encargado de incluir los archivos
que hacen de Header y Footer en la aplicación. Esto es preferible a la primera opción ya que si, por
ejemplo, queremos que un módulo específico de nuestra aplicación, devuelva un archivo .GIF como
resultado ( utilizando GD ), entonces de esta manera, podremos indicar para ESE módulo, un
archivo de Layout que se encargue de enviar los Headers correctos y luego incluir el archivo del
módulo. Pero no se preocupen por estas consideraciones, ahora, veamos un ejemplo de Layout,
que guardaremos en el directorio /layouts :
Archivo layout_simple.php:
<html>
<head>
<title>Tu Sitio Modular</title>
</head>
<body bgcolor="#9999cc">
<basefont color="white" face="Verdana" />
<?php include( 'includes/header.html' ); ?>
<table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr>
<td width="140" bgcolor="#5b69a6"> </td>
<td>
<?
if ( file_exists ( $path_modulo )) include( $path_modulo );
else die( 'Error al cargar el módulo <b>' . $modulo . '</b>. No
existe el archivo <b>' . $conf [ $modulo ][ 'archivo' ]. '</b>' );
?>
</td>
</tr>
</table>
<?php include( 'includes/footer.html' ); ?>
</body>
</html>
Ven ? es un simple archivo HTML con la estructura básica de las páginas de nuestro sitio,
incluyendo el Header, el Footer y el código necesario para llamar al módulo pedido por el usuario.
Por favor noten el uso de la variable $path_modulo , para indicarle al Layout el nombre del módulo
que queremos cargar, variable creada en el index.php y propagada al archivo de Layout por estar
éste, incluido en el primero.
Entonces, ya tenemos nuestro index.php, tenemos el Layout que se encarga de incluir el módulo...
Qué nos falta? Pues el módulo ! Éstos pueden ser tan complejos o tan simples como el usuario
quiera. En el ejemplo siguiente, un módulo "home" bien simple, que se carga por defecto en
nuestra aplicación :
Archivo home.php:
<h3>Bienvenido al Home</h3>
<p>Este es un ejemplo de un sitio modular, como vemos, las páginas que
componen los módulos, pueden ser tanto archivos.php como archivos.html,
todo dependiendo de si necesitamos interactividad o no con el Servidor.
La hora actual es : <b> <?=date ( "H:m:s" ); ?> </b></p>
<p>Para ver el contenido de un artículo, por favor, seguir el
<a href="?mod=articulo">siguiente link</a>.</p>
De nuevo, un poco de HTML por aquí, un poco de PHP por allá. Cabe notar, eso si, la manera en la
que hicimos un link hacia OTRA página de nuestro sitio: " ?mod=articulo ". Con esto, le indicamos
al navegador, que queremos cargar el mismo archivo que tenemos actualmente, solo que con este
nuevo " querystring ". Si la página actual fuera algo como:
http://localhost/modulares/index.php
http://localhost/modulares/index.php?mod=articulo
O sea, queremos cargar OTRO módulo, esta vez llamado " articulo ". Como ya todo el trabajo árduo
está hecho, solo tenemos que crear un archivo llamado art.php (ya que así lo indica el archivo de
configuración) en el directorio /modulos/ .
Archivo art.php:
< h3 > Título del Artículo </ h3 >
< p > Aqui tenemos el ejemplo de un artículo cargado en nuestra Web Modularizada .
En este ejemplo simple , el artículo o nota , está escrito en HTML directamente ,
pero podría estar siendo sacado de la base de datos si quisiéramos , no tenemos
limitación al respecto .</ p >
< p >< a href = "?mod=imp_art" target = "_blank" > Versión para Imprimir </ a > |
< a href = "?mod=home" > Volver al Home </ a >.</ p >
Así vemos, como crear un nuevo módulo es tan sencillo como crear el archivo pertinente, dejarlo en
el directorios de Módulos, y actualizar el archivo de configuración para que permita accederlo. Éste
módulo, al no indicarse que Layout utiliza, vemos como toma el Layout por Defecto, o sea, el mismo
que el Home. Cómo último paso, al final del artículo, tenemos dos links, uno, que nos regresa al
Home del Sitio y el otro, el que nos interesa ahora, que ofrece una "Versión para Imprimir" del
artículo. Modifiquemos nuestro archivo de configuración y agreguemos un nuevo módulo, que nos
permita ofrecer una versión "Imprimible" del Artículo. Luego de editarlo, quedaría asi :
Archivo conf.php:
<?php
/*
* Archivo de configuración para nuestra aplicación modularizada.
* Definimos valores por defecto y datos para cada uno de nuestros módulos.
*/
define ( 'MODULO_DEFECTO' , 'home' );
define ( 'LAYOUT_DEFECTO' , 'layout_simple.php' );
define ( 'MODULO_PATH' , realpath ( './modulos/' ));
define ( 'LAYOUT_PATH' , realpath ( './layouts/' ));
?>
¿Llamamos al mismo módulo? Así es. Pero la sutil diferencia es que lo incluimos con un Layout
distinto, más limpio, apto para salir por impresora. Aqui un ejemplo de este Layout, que utiliza
Cascading Style Sheets :
Archivo imprimir.php:
<?
$uri = "http://" . $_SERVER [ "SERVER_NAME" ]. $_SERVER [ "REQUEST_URI" ];
?>
<html>
<head>
<title>Versión para Imprimir</title>
</head>
<style type="text/css">
.imprimir {
margin: 3%;
border: 2px solid black;
padding: 2%;
}
#pie {
font-size: 8pt;
}
</style>
<body>
<div class="imprimir">
<?
if ( file_exists ( $path_modulo )) include( $path_modulo );
else die( 'Error al cargar el módulo <b>' . $modulo . '</b>. No existe el archivo <b>' . $conf
[ $modulo ][ 'archivo' ]. '</b>' );
?>
<i id="pie">Este artículo se puede encontrar en : <a href=" <?=$uri?> "> <?=$uri?> </a></i>
</div>
</body>
</html>
Finalizando
Ya finalizando con este artículo, logramos tener una aplicación web que posee la capacidad de
cargar distintos módulos y diseños dependiendo de los parámetros recibidos. Esto se parece mucho
a un Patrón de Diseño llamado Front Controller . Para los curiosos, ahi tienen dos links en los que
Google les puede enseñar un par de cositas.
Bueno, un montón de cosas, estas son las que se me ocurren en este momento. Estoy seguro que a
Uds. se les ocurrirán muchas más :
Esto ha sido todo por este momento, espero que lo que hayan leido en este artículo les sea de
utilidad en sus sitios web y les ayude a programar menos y más rápidamente. Nos vemos en el
siguiente artículo !
Autor: webstudio
Original de zonaphp.com
Para solucionar esto, usaremos la función mysql_error , esta función aplicada después de la
consulta que nos da el error o que creemos que nos puede dar el error, nos dará todos los detalles
del error en la última operación con la base de datos indicada.
Conociendo este error ya podremos modificar nuestra consulta para solucionar el problema, vamos
a imaginar que tenemos un error en la siguiente consulta y no sabemos lo que pasa:
<?
mysql_select_db ( "db_1" , $db );
mysql_query ( "SELECT * FROM tablaInexistente" , $db );
?>
En este caso, o recibiremos un error de PHP al trabajar con los datos de la consulta o los datos
serán en blanco, entonces ya sabemos que esta es la consulta que no funciona y miraremos
porqué:
<?
mysql_select_db ( "db_1" , $db );
mysql_query ( "SELECT * FROM tablaInexistente" , $db );
echo mysql_error ( $db ) . "n" ;
?>
Y obtendremos el siguiente resultado por pantalla: Table 'db_1.tablaInexistente' doesn't exist Bueno,
no hace falta haber estudiado en Oxford para entender el problema, la tabla tablaInexistente no
existe, asi que tendremos que crearla primero para evitar que el problema persista.
De esta manera podremos ir solucionando los problemas que nos surjan al trabajar con una base de
datos de MySQL, vereis que el mensaje de error suele ser bastante claro.
Consultas de selección aleatoria con
PHP
Para seleccionar datos aleatoriamente tenemos que tener en cuenta la normalización de SQL y que
posiblemente no todas apliquen a algunos gestores de bases de datos.
En primera debemos tener en claro una simple sentencia en SQL para seleccionar datos.
Con esta sentencia en sql lo que estamos haciendo es seleccionar los datos de la tabla, que los
ordene dependiendo del tipo campo y que tenga un límite de 10 campos. Es así como funciona una
sentencia común en SQL.
Para obtener registros aleatorios o azarosos de una tabla se requiere tener la siguiente sentencia:
Al igual nos mostrará 10 campos pero estos de manera aleatoria y de límite 10, esto es muy
eficiente para hacer más dinámico nuestro sitio web y de más vistosidad y facilidad de acceso a la
información.
Para unir esta sentencia con PHP para mostrar los resultados analicemos el siguiente código.
<?
## nos conectamos a mysql
include("conexion.php");
## Tomamos los datos aleatorios de la tabla
$query = mysql_query("SELECT * FROM `tabla` ORDER BY RAND() LIMIT 0, 10");
## creamos un bucle para que nos muestre los resultados
while ($campo = mysql_fetch_array($query)){
echo $campo["campo"];
}
## liberamos memoria de la sentencia
mysql_free_result($query);
## finalizamos conexión
mysql_close();
?>
El código PHP anterior nos muestra por pasos lo que se requiere para seleccionar los datos al azar,
existen algunos artículos referidos en la cual este artículo depende. Entre ellos puedes visitar:
"Conexión a MySQL", "Alternar filas de color con PHP", entre otros más asesores. También puedes
visitar el manual de PHP.net de Funciones MySQL.
<?
$vector = array("uno", "dos", "tres");
foreach ($vector as $valor) {
echo "Valor: $valor<br>" ;
}
?>
Esta expresión tambien nos permite trabajar con vectores con indice, en este caso trabajaremos así:
<?
$vector = array(
"uno" => 1,
"dos" => 2,
"tres" => 3 ,
"diecisiete" => 17
);
foreach($vector as $indice => $valor) {
print "$vector[$indice] => $valor.n" ;
}
?>
Como vemos en este caso especificamos la variable que identifica el indice y la que identifica el
valor separadas por =>
Dirección IP
Para conseguir la direccion IP de nuestro visitante desde PHP usaremos lo que se llama variables
globales.
Estas variables son variables que proporciona PHP acerca del visitante, consiguiendo informacion
cómo su IP, su nombre de Host, su sistema operativo...
global $REMOTE_ADDR;
Y una vez definida ya tendremos una variable con la direccion IP del visitante lista para usar:
<?
global $REMOTE_ADDR ;
$echo $REMOTE_ADDR ;
?>
O bien podemos acceder a la ip usano directamente el array superglobal _SERVER, evitandonos así
el tener que declarar la variable:
<?
echo $_SERVER [ 'REMOTE_ADDR' ];
?>
Nota: Tened cuidado los que useis un servidor gratuito, es posible que no tenga las variables
globales activadas.
Crear una capa contenedora (del ancho del sitio) que centre a
todas las restantes Recibidos Rutinas CSS
.capa_contenedora (
margin-left = auto;
margin-right = auto;
)
En muchas ocasiones, al maquetar una página web, se necesita recuadrar una información para
remarcar su contenido, destacándolo de otros textos del documento.
Es básicamente lo que vamos a hacer en el ejercicio de esta ocasión. Se trata de un ejemplo muy
sencillo, pero que sirve como continuación de otro artículo que hemos publicado en el taller de
HTML. (ENLACE A http://www.desarrolloweb.com/articulos/2025.php) En dicho taller realizábamos
los recuadros utilizando únicamente HTML, sin declaración de estilos, lo que no es muy adecuado
debido a las tendencias actuales.
CSS es, en estos momentos, la tecnología más adecuada para definir los estilos de un documento.
Lo que antes habíamos realizado con HTML se puede realizar con CSS obteniendo varias ventajas
de la maquetación con Hojas de Estilo en Cascada.
El ejercicio
Para empezar, sería bueno observar el objetivo de este ejercicio , para tener una idea exacta de lo
que vamos a hacer.
El ejercicio dispone de tres recuadros con estilos distintos, aunque a pesar de ello tienen códigos
muy similares. Para variar su aspecto, simplemente se cambia la declaración de estilos para cada
uno.
La maquetación con estilos se realiza utilizando etiquetas <DIV> en lugar de tablas. Por eso el
código incluye las etiquetas <DIV> necesarias y poco más.
<div id=tabla1>
<div id=cabtab1>
Recuadro curioso con HTML
</div>
<div id=cuerpotab1>
Este es el interior del recuadro. Esperamos que os resulte elegante... es muy sencillo.
</div>
</div>
Contiene tres etiquetas <DIV> una para englobar el recuadro entero, y asignarle estilos como el
borde o estilos que deseemos que se apliquen a todo el recuadro. También tendremos un <DIV>
para el encabezamiento del recuadro y otro para el cuerpo.
Los estilos que utilizamos para este recuadro son los siguientes.
#tabla1{
border: 1px solid #1E679A;
width: 280px;
}
#cabtab1{
background-color: #1E679A;
font-weight: bold;
color: #ffffff;
padding: 2 2 2 2px;
}
#cuerpotab1{
padding: 4 4 4 4px;
background-color: #ffffcc;
}
Cada <DIV> tiene asignado un estilo distinto dependiendo de nuestras necesidades.
Para el segundo recuadro podremos ver un código HTML casi idéntico. Lo único que cambiamos
son los identificadores de los <DIV> , para poder asignar unos estilos distintos al recuadro.
<div id=tabla2>
<div id=cabtab2>
Recuadro curioso con HTML
</div>
<div id=cuerpotab2>
Este es el interior del recuadro. Esperamos que os resulte elegante... es muy sencillo.
</div>
</div>
#tabla2{
border: 1px solid #165480;
width: 200px;
}
#cabtab2{
background-color: #5fa6d7;
font-weight: bold;
font-size: 8pt;
padding: 2 2 2 2px;
}
#cuerpotab2{
font-size: 8pt;
padding: 4 4 4 4px;
background-color: #ffffcc;
}
Como se puede ver, no tiene ninguna dificultad adicional con respecto al primer ejemplo, pues sólo
se definen estilos para cada uno de los <DIV> .
En el tercer recuadro hemos complicado un poquito el código, aunque nada reviste ninguna
complicación. En este caso, como el recuadro contenía un texto con varias opciones de una lista,
hemos incluido, dentro del cuerpo del recuadro, un <ul> (unordered list) con cada una de las
opciones a visualizar.
<div id=tabla3>
<div id=cabtab3>
Recuadro curioso con HTML
</div>
<div id=cuerpotab3>
<ul>
<li>Opción uno</li>
<li>Otra opción con texto en varias líneas</li>
<li>Lo que sea que desees destacar</li>
<li>Última opción</li>
</ul>
</div>
</div>
En la declaración de estilos también hemos definido el aspecto de la lista, para que se ajuste a
nuestras necesidades.
#tabla3{
border: 1px solid #80A93E;
width: 200px;
}
#cabtab3{
background-color: #B7F259;
font-weight: bold;
font-size: 8pt;
padding: 2 2 2 2px;
}
#cuerpotab3{
font-size: 8pt;
padding: 4 4 4 4px;
background-color: #F5ECB9;
}
#cuerpotab3 ul{
margin: 0 2 0 20px;
padding: 0 0 0 0px;
}
#cuerpotab3 li{
margin: 0 2 0 2px;
padding: 0 0 0 0px;
}
Para definir el estilo de la lista indicamos el identificador del <DIV> donde se encuentra la lista,
seguido de la etiqueta sobre la que deseamos declarar los estilos, en este caso "ul" para definir los
estilos de la lista y "li" para declarar los estilos de cada una de las opciones. En este ejemplo hemos
declarado los estilos necesarios para definir un margen adecuado para la lista y para cada una de
sus opciones.
Conclusión
Hemos visto una manera sencilla de hacer cajas con CSS. Tal vez este artículo es demasiado
básico, pero se trataba de mostrar cómo se pueden hacer con CSS algunas cosas que habíamos
hecho previamente con sólo HTML.
Como se puede ver, comparando este ejemplo con su contrapartida en HTML , Con CSS se
maqueta con mucha más coherencia y se obtiene un código mucho más claro.
El propósito de este artículo, es hacer que se muestre u oculte una capa cuando se pasa con
el ratón por encima de otra. Gracias a esta técnica, las páginas tendrán un aspecto mucho
más dinámico.
El propósito de este artículo, es hacer que se muestre u oculte una capa cuando se pasa con el
ratón por encima de otra. Gracias a esta técnica, las páginas tendrán un aspecto mucho más
dinámico.
Como Netscape e Internet Explorer llaman de forma distinta a las capas, lo primero que haremos,
será detectar qué navegador se está utilizando. Para ello, lo que vamos a hacer es crear dos
variables globales dentro de nuestro Script:
var ns4,ie4
Una vez están creadas e inicializadas las variables del navegador, tenemos que crear otra variable,
que contenga a la capa que queremos mostrar u ocultar. Esta variable se inicializará de forma
distinta dependiendo del navegador que esté utilizando el usuario.
La siguiente funcion inicializa el valor de la variable "capa" con el nombre que tiene la capa que
queremos mostrar u ocultar, en este caso se llamará "menu".
var capa
function init() {
if (ns4) {
capa = document.menu
}
if (ie4) {
capa = menu.style
}
}
function muestra(obj) {
if (ns4) obj.visibility = "show"
else if (ie4) obj.visibility = "visible"
}
Al igual que con la función anterior, dependiendo si el navegador es Netscape o IE, cambiaremos de
una forma u otra el atributo de la capa a oculto
function oculta(obj) {
if (ns4) obj.visibility = "hide"
else if (ie4) obj.visibility = "hidden"
}
Una vez tenemos definido las acciones de mostrar u ocultar capa, hay que crear el cuerpo del
documento, en primer lugar, pediremos al navegador que ejecute la función Init, de forma que la
variable capa esté lista para usar:
<body Onload="Init()">
Además tenemos que crear dos capas, la primera de ellas va a ser la que se va a ocultar y mostar.
El nombre de la capa deberá ser Menu, que es la que hemos decidido utilizar en el punto 2.
Además, hay que crear la segunda capa, que mostará la capa menu cuando el ratón esté encima de
ella, y la ocultará cuando no. Cada una de estas acciones las realizará las funciones Muestra y
Oculta, definidas en el punto 4.
Colocaremos además dentro de esta capa un enlace, con los manejadores de eventos necesarios
para realizar acciones cuando se pose o no el ratón sobre el. Cuando se produzca el evento
OnMouseOver (que el ratón entre en el enlace dentro de la capa), pediremos al navegador que
ejecute la función Muestra, y cuando se produzca el evento OnMouseOut (que el ratón salga del
enlace de la capa), pediremos al navegador que ejecute la función Oculta. Por lo que la definición de
la capa quedará de la siguiente forma:
6.Código completo:
<html>
<head>
<title>Untitled</title>
<script language="javascript">
var capa
function init() {
if (ns4) {
capa = document.menu
}
if (ie4) {
capa = menu.style
}
}
function muestra(obj) {
if (ns4) obj.visibility = "show"
else if (ie4) obj.visibility = "visible"
}
function oculta(obj) {
if (ns4) obj.visibility = "hide"
else if (ie4) obj.visibility = "hidden"
}
</script>
</head>
<body onLoad="init()">
<div id="menu" style= "position:Absolute;left:50; top:60; background-color:#ff1133; visibility:hidden">hola</div>
<div id="CapaNormal" style= "position:absolute;left:50; top:150;background-color:pink;"><a href="#"
OnMouseOver="muestra(capa)" OnMouseOut= "oculta(capa)">Ponte encima</a>...</div>
</body>
</html>
Con los conocimientos aquí aprendidos puedes intentar crear una barra de navegación dinámica
que tenga varias opciones que, al pasar el ratón por encima, se vean sus distintas descripciones.
Puedes encontrar en este sitio un artículo que te informa sobre cómo hacerlo.
Nota: Este artículo, aunque puede servir de ayuda e introducción al
trabajo con capas, se encuentra un poco desfasado. Existen
herramientas que pueden hacernos la vida más fácil.