웹사이트의 게시판이나 블로그에서 등록일자를 사용자에게 직관적으로 표시하는 것은 매우 중요합니다.
본 포스팅에서는 PHP를 이용해 게시물의 등록일자를 ‘방금전’, ‘몇 시간 전’, ‘며칠 전’ 등의 상대적인 시간 형식으로 표시하는 방법을 설명합니다.
이를 통해 사용자 경험을 개선하고, 게시물의 최신성을 쉽게 파악할 수 있게 됩니다.
목차
1. 함수 소개
게시물의 등록일자를 상대적인 시간으로 표시하기 위해 다음의 두 가지 함수를 사용합니다.
- getRelativeDate: 주어진 날짜와 현재 날짜의 차이에 따라 상대적인 날짜를 반환합니다.
- getRelativeTime: 주어진 시간과 현재 시간의 차이에 따라 상대적인 시간을 반환합니다.
이 함수들은 주어진 날짜나 시간과 현재 시간의 차이를 계산하여 “방금전”, “X분전”, “X시간전”, “어제”, “X일전” 등의 형식으로 직관적으로 표시합니다.
2. 코드 예제
아래는 PHP에서 상대적인 날짜와 시간을 계산하여 표시하는 코드입니다.
아래의 코드를 print_date.lib.php에 만들어보겠습니다.
<?php
// print_date.lib.php
/**
* 주어진 날짜와 현재 날짜의 차이에 따라 상대적인 날짜를 반환하는 함수
*
* @param string $datetime - 비교할 날짜 시간 문자열
* @return string - 상대적인 날짜를 나타내는 문자열
*/
function getRelativeDate($datetime) {
$now = time();
$dateTimestamp = strtotime($datetime);
if (!$dateTimestamp) {
return " ";
}
// 날짜 차이를 초 단위로 계산
$diffInSeconds = $now - $dateTimestamp;
$daysAgo = floor($diffInSeconds / 86400);
// 날짜 차이에 따른 문자열 생성
if ($daysAgo < 1) {
return getRelativeTime($datetime);
} elseif ($daysAgo == 1) {
return '<span class="time-day">어제</span>';
} elseif ($daysAgo < 7) {
return '<span class="time-day">' . $daysAgo . '일전</span>';
} elseif (date('Y', $dateTimestamp) == date('Y')) {
// 7일 이상, 같은 해 내의 경우 MM-DD 형식으로 반환
return '<span class="time-date">' . date('m-d', $dateTimestamp) . '</span>';
} else {
// 다른 해의 경우 YYYY-MM-DD 형식으로 반환
return '<span class="time-date">' . date('Y-m-d', $dateTimestamp) . '</span>';
}
}
/**
* 주어진 시간과 현재 시간의 차이에 따라 상대적인 시간을 반환하는 함수
*
* @param string $time - 비교할 시간 문자열
* @return string - 상대적인 시간을 나타내는 문자열
*/
function getRelativeTime($time){
$now = time();
$dateTimestamp = strtotime($time);
$diffInSeconds = $now - $dateTimestamp;
$hours = floor(abs($diffInSeconds / 3600));
$minutes = floor(abs($diffInSeconds % 3600) / 60);
$seconds = floor(abs($diffInSeconds % 60));
if ($hours > 0) {
return '<span class="time-hour">' . $hours . '시간전</span>';
}
if ($minutes > 0) {
return '<span class="time-minute">' . $minutes . '분전</span>';
}
return '<span class="time-recent">방금전</span>';
}
?>위 코드를 통해 getRelativeDate 함수는 입력된 날짜와 현재 날짜의 차이에 따라 “어제” 또는 “X일전”을 반환합니다.
getRelativeTime 함수는 시간 차이에 따라 “방금전”, “X분전”, “X시간전”을 반환합니다.
3. CSS 스타일 적용
상대적인 날짜와 시간 텍스트를 시각적으로 매력적이게 표시하기 위해 CSS 스타일을 추가해보겠습니다.
다음은 스타일을 정의하는 styles.css 파일의 예제입니다.
/* styles.css */
/* 시간 표시 스타일 */
.time-hour {
color: #4f95b7;
font-weight: bold;
}
.time-minute {
color: #ff8521;
font-weight: bold;
}
.time-recent {
color: #ee3616;
font-weight: bold;
}
.time-day {
color: #333;
}
.time-date {
color: #666;
}이 CSS 클래스들은 상대적인 날짜와 시간 텍스트의 색상과 굵기를 설정하여 강조할 부분을 명확하게 표시합니다.
4. 적용 예시
PHP와 CSS 파일을 통합하여 등록일자를 표시하는 예제 파일인 index.html을 만들어보겠습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 상대 시간 계산 및 게시판 등록일자 표시</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<?php include 'print_date.lib.php'; ?>
<h1>PHP 상대 시간 계산 및 게시판 등록일자 표시</h1>
<p>현재 날짜로부터 몇 일 전인지: <?php echo getRelativeDate('2024-06-12 14:30:00'); ?></p>
<p>몇 시간 전인지: <?php echo getRelativeTime('2024-06-18 10:00:00'); ?></p>
</body>
</html>수행을 하면 서버 시간을 기준으로 몇 일전인지 몇 시간 전인지 출력을 하게 됩니다.
5. 결론
이 글에서는 PHP를 사용하여 게시판의 등록일자를 ‘방금전’, ‘몇 시간 전’, ‘며칠 전’ 등으로 표시하는 방법을 다루었습니다.
이 방법은 사용자에게 등록일자의 최신성을 직관적으로 전달하며, 게시물의 가독성을 높여줍니다.
제공된 예제 코드를 통해 쉽게 자신의 프로젝트에 통합하고, CSS를 통해 스타일을 조정하여 사용자 경험을 향상시킬 수 있습니다.
이 예제와 설명이 여러분의 프로젝트에서 상대적인 날짜 및 시간을 표시하는 데 도움이 되길 바랍니다.