How to code calendar in PHP

How to Create a Calendar in PHP ( Part1 HTML & CSS )

How to Create a Calendar in PHP ( Part1 HTML & CSS )

 

 

 

Introduction & Demo

Today, I’m going to share “How to code calendar in PHP” videos.

Before you watch the video, please check the demo from here.

Coding calendar contains a lot of coding basics and functions like loops, mktime function, GET etc…
I think it will be helpful to learn how PHP works with HTML and how to deal with time functions.

Also, I used Bootstrap and Google Fonts in this tutorial.
Bootstrap helps us to make beautiful layout easily, so you can design your site without special CSS knowledge.

Once you’ve done, you can print it out and use as your schedule memo!

Happy Coding 🙂

 

You may also like…  New!! A Calendar with PHP & MySQL

 
 

Video

Part1 : HTML & CSS
(The video on the top.)

Part2 : PHP

How to Create a Calendar in PHP ( Part2 PHP )

How to Create a Calendar in PHP ( Part2 PHP )

 
 

Sample Code

<?php
// Set your timezone!!
date_default_timezone_set('Asia/Tokyo');

// Get prev & next month
if (isset($_GET['ym'])) {
	$ym = $_GET['ym'];
} else {
	// This month
	$ym = date('Y-m');
}

// Check format
$timestamp = strtotime($ym . '-01');
if ($timestamp === false) {
	$timestamp = time();
}

// Today
$today = date('Y-m-j', time());

// For H3 title
$html_title = date('Y / m', $timestamp);

// Create prev & next month link     mktime(hour,minute,second,month,day,year)
$prev = date('Y-m', mktime(0, 0, 0, date('m', $timestamp)-1, 1, date('Y', $timestamp)));
$next = date('Y-m', mktime(0, 0, 0, date('m', $timestamp)+1, 1, date('Y', $timestamp)));

// Number of days in the month
$day_count = date('t', $timestamp);

// 0:Sun 1:Mon 2:Tue ...
$str = date('w', mktime(0, 0, 0, date('m', $timestamp), 1, date('Y', $timestamp)));


// Create Calendar!!
$weeks = array();
$week = '';

// Add empty cell
$week .= str_repeat('<td></td>', $str);

for ( $day = 1; $day <= $day_count; $day++, $str++) {
	
	$date = $ym.'-'.$day;
	
	if ($today == $date) {
		$week .= '<td class="today">'.$day;
	} else {
		$week .= '<td>'.$day;
	}
	$week .= '</td>';
	
	// End of the week OR End of the month
	if ($str % 7 == 6 || $day == $day_count) {
		
		if($day == $day_count) {
			// Add empty cell
			$week .= str_repeat('<td></td>', 6 - ($str % 7));
		}
		
		$weeks[] = '<tr>'.$week.'</tr>';
		
		// Prepare for new week
		$week = '';
		
	}

}

?>
<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<title>PHP Calendar</title>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
	<link href='https://fonts.googleapis.com/css?family=Noto+Sans:400,700' rel='stylesheet' type='text/css'>
	<style>
		.container {
			font-family: 'Noto Sans', sans-serif;
			margin-top: 80px;
		}
		th {
			height: 30px;
			text-align: center;
			font-weight: 700;
		}
		td {
			height: 100px;
		}
		.today {
			background: orange;
		}
		th:nth-of-type(7),td:nth-of-type(7) {
			color: blue;
		}
		th:nth-of-type(1),td:nth-of-type(1) {
			color: red;
		}
	</style>
	
</head>
<body>
	<div class="container">
		<h3><a href="?ym=<?php echo $prev; ?>">&lt;</a> <?php echo $html_title; ?> <a href="?ym=<?php echo $next; ?>">&gt;</a></h3>
		<br>
		<table class="table table-bordered">
			<tr>
				<th>S</th>
				<th>M</th>
				<th>T</th>
				<th>W</th>
				<th>T</th>
				<th>F</th>
				<th>S</th>
			</tr>
			<?php
				foreach ($weeks as $week) {
					echo $week;
				}	
			?>
		</table>
	</div>
</body>
</html>

 
 

References

Bootstrap: http://getbootstrap.com/
Google Fonts: https://www.google.com/fonts. (I used “Noto Sans” in the video.)

 

About Sara

Working as a freelance programmer in Japan. I'll try to make coding as simple as possible. Hope you enjoy coding 🙂