Código de PHP - Ejemplo de crear un simple calendario

Imágen de perfil

Ejemplo de crear un simple calendariográfica de visualizaciones


PHP

estrellaestrellaestrellaestrellaestrella(16)
Actualizado el 09 de Diciembre del 2014 por Xavi (Creado el 12 de Septiembre del 2013)
55.901 visualizaciones desde el 12 de Septiembre del 2013. Una media de 336 por semana
Código que muestra como crear un simple calendario para nuestra página web.

Versión 1
estrellaestrellaestrellaestrellaestrella(16)

Actualizado el 09 de Diciembre del 2014 (Creado el 12 de Septiembre del 2013)gráfica de visualizaciones de la versión: Versión 1
55.903 visualizaciones desde el 12 de Septiembre del 2013. Una media de 336 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

Puedes ver un ejemplo aquí
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<?php
# definimos los valores iniciales para nuestro calendario
$month=date("n");
$year=date("Y");
$diaActual=date("j");
 
# Obtenemos el dia de la semana del primer dia
# Devuelve 0 para domingo, 6 para sabado
$diaSemana=date("w",mktime(0,0,0,$month,1,$year))+7;
# Obtenemos el ultimo dia del mes
$ultimoDiaMes=date("d",(mktime(0,0,0,$month+1,1,$year)-1));
 
$meses=array(1=>"Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio",
"Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre");
?>
 
<!DOCTYPE html>
<html lang="es">
<head>
	<!--http://www.lawebdelprogramador.com-->
	<title>Ejemplo de un simple calendario en PHP</title>
	<meta charset="utf-8">
	<style>
		#calendar {
			font-family:Arial;
			font-size:12px;
		}
		#calendar caption {
			text-align:left;
			padding:5px 10px;
			background-color:#003366;
			color:#fff;
			font-weight:bold;
		}
		#calendar th {
			background-color:#006699;
			color:#fff;
			width:40px;
		}
		#calendar td {
			text-align:right;
			padding:2px 5px;
			background-color:silver;
		}
		#calendar .hoy {
			background-color:red;
		}
	</style>
</head>
 
<body>
<h1>Ejemplo de un simple calendario en PHP</h1>
<table id="calendar">
	<caption><?php echo $meses[$month]." ".$year?></caption>
	<tr>
		<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th>
		<th>Vie</th><th>Sab</th><th>Dom</th>
	</tr>
	<tr bgcolor="silver">
		<?php
		$last_cell=$diaSemana+$ultimoDiaMes;
		// hacemos un bucle hasta 42, que es el máximo de valores que puede
		// haber... 6 columnas de 7 dias
		for($i=1;$i<=42;$i++)
		{
			if($i==$diaSemana)
			{
				// determinamos en que dia empieza
				$day=1;
			}
			if($i<$diaSemana || $i>=$last_cell)
			{
				// celca vacia
				echo "<td>&nbsp;</td>";
			}else{
				// mostramos el dia
				if($day==$diaActual)
					echo "<td class='hoy'>$day</td>";
				else
					echo "<td>$day</td>";
				$day++;
			}
			// cuando llega al final de la semana, iniciamos una columna nueva
			if($i%7==0)
			{
				echo "</tr><tr>\n";
			}
		}
	?>
	</tr>
</table>
</body>
</html>



Comentarios sobre la versión: Versión 1 (16)

esmeralda
03 de Septiembre del 2014
estrellaestrellaestrellaestrellaestrella
buenas me gustaría saber si ese calendario se puede ver mas grande y los fecha por separado es como si fueron una lista para asistencias ya que necesito que marque con X los campos
Responder
Gilberto
28 de Octubre del 2014
estrellaestrellaestrellaestrellaestrella
muchas gracias que compartes tus sabios conocimientos. En verdad me has instruido!
Responder
isabel
31 de Octubre del 2014
estrellaestrellaestrellaestrellaestrella
Una consulta, como hago para extraer la fecha a una variable que luego quiere llenar en un text
Responder
Adalberto Turby
24 de Noviembre del 2014
estrellaestrellaestrellaestrellaestrella
Muchas gracias, es un excelente ejemplo, gracias me has salvado
Responder
Gustavo
07 de Enero del 2015
estrellaestrellaestrellaestrellaestrella
Gracias, muy bien la explicación!!
Responder
David
31 de Marzo del 2015
estrellaestrellaestrellaestrellaestrella
Gracias, un magnifico ejemplo
Responder
ElMago55
13 de Abril del 2015
estrellaestrellaestrellaestrellaestrella
Hola me sirvio mucho el ejemplo les envio el codigo modificado por mi ya que tenia problemas con los años biciestos, Atentamente ElMago55
<!DOCTYPE html>
<html lang="es"><head>
<title>Calendario con horas Programadas para un Trabajador</title>
<meta charset="utf-8">
<style>
#calendar { font-family:Arial; font-size:12px; }
#calendar caption {text-align:left; padding:5px 10px; background-color:#003366; color:#fff; font-weight:bold; }
#calendar th { background-color:#006699; color:#fff; width:40px; }
//#calendar td { text-align:right; padding:2px 5px; background-color:silver; }
//#calendar .hoy { background-color:red; }
.rojo { color:#FF0000; }
.amarillo { color:#F7FE2E; }
.verde { color:#01DF01 ;}
</style>
</head>
<body>
<h1>Calendario con Horas Programadas para un Trabajador</h1>
<?php
//funcion q devuelve cantidad de dias de un mes en un año
function getMonthDays($Month, $Year){
if( is_callable("cal_days_in_month")) { return cal_days_in_month(CAL_GREGORIAN, $Month, $Year); }
else { return date("d",mktime(0,0,0,$Month+1,0,$Year)); }
}
//funcion que crea calendarios
function pcalenda($month,$year) {
$ddias=getMonthDays($month, $year); // Numero de dias del mes
$diaSemana=date("w",mktime(0,0,0,$month,1,$year)) ; //dia de la semana del primer dia Devuelve 0 para domingo, 6 para sabado
$meses=array(1=>"Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio","Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre");
echo "<table id='calendar' border=1><caption>". $meses[$month]." ".$year."</caption><tr> <th rowspan=2>Dias Horas</th>";
switch ($diaSemana) {
case 1 : echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; $dis =7 ;break;
case 2 : echo "<th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; $dis =6; break;
case 3 : echo "<th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; $dis =5; break;
case 4 : echo "<th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; $dis =4; break;
case 5 : echo "<th>Vie</th><th>Sab</th><th>Dom</th>"; $dis =3; break;
case 6 : echo "<th>Sab</th><th>Dom</th>"; $dis =2; break;
case 0 : echo "<th>Dom</th>"; $dis =1; break;
}
$cc = floor(($ddias-$dis)/7) ; //semanas completas
for($i=1; $i<=$cc; $i++) { echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; }
$diasfin = ($ddias-$dis)%7 ; // ultima semana semana incompleta
switch ($diasfin) {
// case 0 : echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th><th>Dom</th>"; break;
case 1 : echo "<th>Lun</th>"; break;
case 2 : echo "<th>Lun</th><th>Mar</th>"; break;
case 3 : echo "<th>Lun</th><th>Mar</th><th>Mie</th>"; break;
case 4 : echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th>"; break;
case 5 : echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th>"; break;
case 6 : echo "<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th>"; break;

}
echo "</tr><tr bgcolor='silver' align='center'>";
$day=1 ;
for($i=1;$i<=($ddias);$i++) { echo "<td align='center'>$day</td>"; $day++; /*dias*/ }
echo "<tr>";
/* Esta parte es si se quiere agreagar un horario pintando horas en el calendario
* for ($i=0; $i<=($ddias*6); $i++) { $varh[$i] = 0 ; } $ndv =0; ;//inicializa variables
$varh[0]='08'; $varh[1]='15'; //el 1 de 8 15
$varh[2]='19'; $varh[3]='24'; //el 1 de 19 24
$varh[6]='04'; $varh[7]='10'; //el 2 de 4 10
$varh[156]='05'; $varh[157]='15'; //el 27 de 5 15 //$varh[(n-1)*6]
for ($ho = 1; $ho < 25; $ho++) { //crea las horas
echo "<tr align='center'><td>"; if (strlen($ho)<2) { echo "0$ho:00" ; } else { echo "$ho:00" ; }
for ($di=1; $di <=($ddias); $di++ ) { //crea los dias de la semana
if ($ho>=$varh[$ndv] && $ho<=$varh[$ndv+1]) {echo "</td><td bgcolor=#F7FE2E class='amarillo'>_____"; }
elseif ($ho>=$varh[$ndv+2] && $ho<=$varh[$ndv+3]) { echo "</td><td bgcolor=#01DF01 class='verde'>_____"; }
elseif ($ho>=$varh[$ndv+4] && $ho<=$varh[$ndv+5]) { echo "</td><td bgcolor=#FF0000 class='rojo'>_____"; }
else { echo "</td><td>"; }
$ndv = $ndv+6; }
$ndv= 0; echo "</tr>"; } */
for ($ho = 1; $ho < 25; $ho++) { //crea las horas
echo "<tr align='center'><td>"; if (strlen($ho)<2) { echo "0$ho:00" ; } else { echo "$ho:00" ; }
for ($di=1; $di <=($ddias); $di++ ) { //crea los dias de la semana
echo "</td><td>"; }
echo "</tr>"; }
echo "</table>"; }
//---------------------------------
Prueba del Calendario
pcalenda(2,2016); pcalenda(2,2015); pcalenda(2,2017);
Responder
paula
28 de Junio del 2015
estrellaestrellaestrellaestrellaestrella
Hola, como podría hacer para que si yo selecciono un dia, al hacerle click se me pinte de otro color.
Responder
Gilberto Garcia
30 de Mayo del 2016
estrellaestrellaestrellaestrellaestrella
Es muy sencillo, solo vas a tu hoja de estilos, le pones un id="rojo" a tus celdas, y pones hover
#rojo:hover{
text-align:left;
padding-left:20px;
color: #ffa500;
border:solid 1px hsla(250, 100%, 50%, 0.07);
}
o puedes cambiar el background:#FFFCCC; por ejemplo y cambias la celda o el día a otro color.
Responder
Pedro
21 de Septiembre del 2015
estrellaestrellaestrellaestrellaestrella
Me daba problemas, porque el mes de agosto no me ponia el 31, lo solucione cambiando dos lineas

$diaSemana=date("w",mktime(0,0,0,$month,1,$year))+7;
por
$diaSemana=date("w",mktime(0,0,0,$month,1,$year));
y añadiendo esta linea

if($diaSemana==0) $diaSemana=7;
y me lo deja correcto.
Responder
Lukus203
07 de Enero del 2016
estrellaestrellaestrellaestrellaestrella
Hola a todos, una pregunta, ¿el tipo de letra en la segunda linea hay que copiarlo?
Responder
Guillermo
21 de Enero del 2016
estrellaestrellaestrellaestrellaestrella
Hola, yo también necesitaría ponerle contenido a cada día como efemérides, como se podría lograr tomar el control de cada día (haciendo click) sobre el calendario?, muy bueno! gracias.
Responder
Martin
08 de Mayo del 2016
estrellaestrellaestrellaestrellaestrella
¿sería posible publicar en él efemerides extraídas de una bd?
Gracias por anticipado
Responder
Gilberto Garcia
30 de Mayo del 2016
estrellaestrellaestrellaestrellaestrella
Estimado Xavi, genial tu calendario. Y todos los que hacen posible este foro. Por favor me pueden ayudar, sucede que al navegar por mi calendario el scroll me jala hacia arriba o hacia abajo, creo que el problema esta en la variable $_SERVER[´PHP_SEF´], intente de todo hasta con javascript para mantenerlo fijo, pero me jala a la clase del javascript. El problema surge cuando lo incorporo con include en un div html. Ve el ejemplo: www.gs-instalaciones.com
Dejo el Srcipt, y agardezco mucho la ayuda.
<!DOCTYPE html>
<html lang="es">

<head>
<meta charset="utf-8"/>
</head>
<body></body>
</html>
<?php
# definimos los valores iniciales para nuestro calendario
$month=date("n");
$year=date("Y");
$diaActual=date("j");
# Obtenemos el dia de la semana del primer dia
$meses=array(1=>"Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio",
"Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre");
$dias=array(1=>"Lunes","Martes", "Miércoles", "Jueves", "Viernes", "Sábado","Domingo");

//definimos meses y años pasados, meses y años posteriores
if (!isset($_REQUEST["mes"])) $_REQUEST["mes"] = date("n");
if (!isset($_REQUEST["anio"])) $_REQUEST["anio"] = date("Y");

$month = $_REQUEST["mes"];
$year = $_REQUEST["anio"];

$prev_year = $year;
$next_year = $year;
$pasados = $year;
$futuros = $year;
$prev_month = $month-1;
$next_month = $month+1;

if ($prev_month == 0 ) {
$prev_month = 12;
$prev_year = $year - 1;
}
elseif($next_month == 13 ) {
$next_month = 1;
$next_year = $year + 1;
}
else{
$prev_month=$month-1;
$next_month=$month+1;
$pasados=$year-1;
$futuros=$year+1;
}

echo'<table id="fecha">';
echo'<caption>';
//echo'<a href="javascript:void(0);" onclick="getElementById("top");"></a>';
echo '<div id="top">';
$previo = $_SERVER['PHP_SELF'].'?mes='. $prev_month.'&anio='. $prev_year."#top";
$antes = $_SERVER['PHP_SELF'].'?anio='. $pasados."#top";
echo'<a href='.$antes.'><img src="imagenes/izquierda.jpg" align="left"/></a>';
echo'<a href='.$previo.'><img src="imagenes/right.jpg" align="left"/></a>';
$despues = $_SERVER['PHP_SELF'].'?anio='. $futuros."#top";
$next = $_SERVER["PHP_SELF"]."?mes=". $next_month."&anio=".$next_year."#top";
echo'<a href='.$despues.'><img src="imagenes/derecha.jpg" align="right"/></a>';
echo'<a href='.$next.'><img src="imagenes/left.jpg" align="right"/></a>';
echo $meses[$month].", ".$year ;
echo '</div>';
echo '</caption>';
echo'<tr>';
echo'<th>Lun</th><th>Mar</th><th>Mie</th><th>Jue</th><th>Vie</th><th>Sab</th>';
echo'<th class="dom">Dom</th>';
echo'</tr>';
echo'<tr bgcolor="#ececec">';

# Devuelve 0 para domingo, 6 para sabado
$diaSemana=date("w",mktime(0,0,0,$month,1,$year))+7; //elimine $dia antes de $month
# Obtenemos el ultimo dia del mes
$ultimoDiaMes=date("d",(mktime(0,0,0,$month+1,1,$year)-1));
$last_cell=$diaSemana+$ultimoDiaMes;
// hacemos un bucle hasta 43, que es el máximo de valores que puede
// haber... 6 columnas de 7 dias
for($i=1;$i<=43;$i++)
{
if($i==$diaSemana)
{
// determinamos en que dia empieza
//agregamos el dia semanal
$day=1;
}
if($i<$diaSemana || $i>=$last_cell)
{
// celca vacia
echo "<td> </td>";
}else{
// mostramos el dia
if($day==$diaActual)
echo "<td class='hoy'>$day</td>";
else
echo "<td>$day</td>";
$day++;
}
// cuando llega al final de la semana, iniciamos una columna nueva
if($i%7==0)
{
echo "</tr><tr>\n";
}
}

echo'</table>';
setlocale(LC_ALL, 'esp_ESP');
$dia=strftime("%A, %d de %B de %Y");
echo'<div id="feet">';
echo"$dia";
echo'</div>';
?>
Responder
guille
20 de Julio del 2016
estrellaestrellaestrellaestrellaestrella
muy bueno, funciona perfecto!
alguna idea para hacer que empiece por domingo y no por lunes la semana?

gracias
saludos
Responder
Johan Vasquez
04 de Octubre del 2016
estrellaestrellaestrellaestrellaestrella
Hola amigos quien me podría orientar, sobre como crear un cronograma de turnos en horariso rotativos .. para una empresa .. por favor ????
Responder

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s2483