Converting Date and Time from a specific Time Zone to another using PHP Tutorial

Submitted by oretnom23 on Saturday, March 25, 2023 - 17:08.

In this tutorial, you can learn how to Convert Date and Time from a specific Time Zone to another using PHP Language. The tutorial aims to provide students and beginners with a reference for learning to set and manage date time zones using PHP Language built-in class or object. Here, I will be providing a simple web page script that demonstrates the conversion of a date and time from a specific time zone into a different time zone.

What is Time Zone?

A Time Zone offsets from Universal Time Coordinate (UTC). A time zone is a region that adheres to a common standard time for social, commercial, and legal activities. Because it is easy for locations in frequent communication to preserve the same time, time zones typically follow the boundaries between countries and their subdivisions rather than rigidly following longitude.

How to convert Date and Time Zone from a specific Time Zone to another?

The Date and Time time zone can be easily converted from a specific time zone to another time zone using the PHP's built-in classes or objects called DateTime and DateTimeZone. These 2 PHP classes can be used to set the specific date and time into a certain Time Zone and generate the different time zone offset values.

Snippet

The below PHP snippet demonstrates the usage of the DateTime and DateTimeZone classes of PHP to convert the date time zones.

<?php 
// March 25, 2023 12:45 AM
$dateTime = "2023-03-25 00:45";
// Set Date TimeZone as UTC
$dateTime = new DateTime($dateTime, new DateTimeZone('UTC'));
// Convert Date Time to 'Asia/Manila' Time Zone
$dateTime->setTimezone(new DateTimeZone('Asia/Manila'));
// Converted Value
$convertedValue = $dateTime->format("F d, Y g:i A");
// output: March 25, 2023 08:45 AM
?>

Example Web Page

The below scripts result in a simple web page written in HTML, CSS, and PHP. The contains a simple page layout with date and time form to convert the time zone from UTC to 'Asia/Manila'. The Formatted UTC and converted (Asia/Manila) date and time values are both shown in a single panel.

Page Interface

The following script is a PHP file script named index.php. It contains the HTML elements of the page layout, panels/containers, and form elements of the web page. This file also contains the PHP script for converting the entered date and time from UTC to Asia/Manila Time zone.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>PHP - Set Date Time Zone</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="style.css">
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
    <div class="content-md-lg py-3">
        <div class="col-lg-6 col-md-10 col-sm-12 col-12 mx-auto">
            <div class="page-title">Converting Date and Time from specific Time Zone to another using PHP</div>
        </div>
        <hr style="margin:auto; width:25px" class="border-light opacity-100">
        <div class="container-lg">
            <div class="row py-3 justify-content-evenly">
                <div class="col-lg-4 col-md-5 col-sm-10 col-12">
                    <div class="card bg-dark rounded-0 border-dark-subtle text-light">
                        <div class="card-body rounded-0">
                            <h3 class="text-center"><b>Select UTC Date and Time</b></h3>
                            <hr class="border-light opacity-100 mx-auto" style="width:25px;height:2px">
                            <form action="">
                                <div class="mb-3">
                                    <label for="dateTime" class="text-white-50">Select UTC Date and Time</label>
                                    <input type="datetime-local" name="dateTime" value="<?= date("Y-m-d\Th:i", strtotime($_GET['dateTime'])) ?? '' ?>" class="form-control rounded-0" required="required">
                                </div>
                                <div class="text-center">
                                    <button class="btn btn-sm btn-primary rounded-0">Convert</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-5 col-sm-10 col-12">
                    <div class="card bg-dark rounded-0 border-dark-subtle text-light">
                        <div class="card-body rounded-0">
                            <h3 class="text-center"><b>UTC to 'Asia/Manila' Time Zone</b></h3>
                            <hr class="border-light opacity-100 mx-auto" style="width:25px;height:2px">
                            <br>
                            <br>
                            <?php 
                            $dateTime = $_GET['dateTime'] ?? "";
                            if(!empty($dateTime)){
                                $dateTime = new DateTime($dateTime, new DateTimeZone('UTC'));
                                //Original
                                $originalValue = $dateTime->format("F d, Y g:i A");
                                // Conver Date Time to diefferent Time Zone
                                $dateTime->setTimezone(new DateTimeZone('Asia/Manila'));
                                // Converted Value
                                $convertedValue = $dateTime->format("F d, Y g:i A");
                            }
                            ?>
                            <div class="mb-3">
                                <dl>
                                    <dt class="text-center text-white-50">UTC Date and Time</dt>
                                    <dd class="text-center fw-bolder h3"><b><?= $originalValue ?? "----- --, ---- --:-- -- " ?></b></dd>
                                </dl>
                            </div>
                            <div class="mb-3">
                                <dl>
                                    <dt class="text-center text-white-50">Asia/Manila Date and Time</dt>
                                    <dd class="text-center fw-bolder h3"><b><?= $convertedValue ?? "----- --, ---- --:-- -- " ?></b></dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Stylesheet

The scipt below is the CSS file script known as style.css. It contains the custom style or codes for some of the page elements.

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@200&family=Space+Mono&display=swap" rel="stylesheet');
:root{
    --space-mono-font: 'Space Mono', monospace;
    --border-dark-subtle: #373838; 
}
*{
    box-sizing: border-box;
}
body *{
    font-family: var(--space-mono-font);
}
/**
Page Design
*/
body,
html{
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}
body{
    background-color: #282A3A;
}
.page-title{
    font-size: 2.5rem;
    font-weight: 500;
    color: #fff;
    letter-spacing: 3px;
    font-family: var(--secular-font);
    text-align: center;
    text-shadow: 0px 0px 3px #2020208c;
}
.border-dark-subtle{
    border-color: var(--border-dark-subtle) !important;
}

Snapshots

The images below are the snapshots of the overall result of the web page scripts that I provided above.

Form Panel

Convertion Panel

Page Layout

There you go! I have also provided the complete source code zip file of the web page scripts that I provided above on this website and it is free to download. The download button is located below this tutorial's content. Feel free to download and modify it to do some experiments to enhance your programming capabilities.

That's it! I hope this Converting a Date and Time from a specific Time Zone to another using PHP Tutorial will help you with what you are looking for and will be useful for your current and future PHP Projects.

Explore more on this website for more Tutorials and Free Source Codes.

Happy Coding =)

Add new comment

270 views