심플한 워드프레스 404 페이지 템플릿

Last Updated: 2024년 11월 14일 댓글

방문자가 없는 페이지를 요청하면 404 오류 페이지가 표시됩니다. 워드프레스는 테마에서 제공하는 404 페이지 템플릿을 이용하여 이 페이지를 표시합니다. 원하는 경우 404 페이지를 커스텀할 수 있습니다.

404 페이지 템플릿을 효과적으로 커스텀하면 SEO에도 도움이 될 수 있습니다.

이 블로그의 경우 지난 8월 말부터 1개월 정도 DDoS 공격을 지속적으로 당했습니다. DDoS 공격이 이루어지면 특정 IP 주소들이 없는 URL을 지속적으로 요청하게 되고 서버가 그러한 HTTP 요청을 감당할 수 없게 되면 서버가 다운되거나 제대로 접속하지 못하는 현상이 발생합니다.

디도스 공격을 당하면서 404 페이지 요청이 늘어나서 404 페이지를 매우 심플하게 바꾸었습니다. (지금은 다시 이전 상태로 되돌렸습니다.)

심플한 워드프레스 404 페이지 템플릿

위의 그림과 같이 워드프레스에서 심플한 404 페이지를 표시하고 싶은 경우 차일드 테마 폴더 아래에 404.php 파일을 만들고 다음 코드를 추가할 수 있습니다.

<?php
// 파일 경로: your-theme/404.php

// 404 상태 코드를 명확하게 설정합니다.
http_response_code(404);

// 워드프레스 헤더 및 푸터를 제거하여 불필요한 로드 방지
// get_header();
// get_footer();

// 다크 모드 디자인의 심플한 HTML 404 페이지 출력
echo '<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="robots" content="noindex, nofollow">
    <title>404 - 페이지를 찾을 수 없습니다</title>
    <style>
        /* 최소한의 인라인 스타일로 다크 모드 구현 */
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            background-color: #121212;
            color: #ffffff;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        .container {
            text-align: center;
        }
        h1 {
            font-size: 64px;
            margin-bottom: 24px;
            letter-spacing: -1.5px;
        }
        p {
            font-size: 20px;
            margin-bottom: 16px;
        }
        a {
            color: #BB86FC;
            text-decoration: none;
            font-weight: bold;
        }
        a:hover {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>404</h1>
        <p>요청하신 페이지를 찾을 수 없습니다.</p>
        <p><a href="/">홈페이지로 돌아가기</a></p>
    </div>
</body>
</html>';
exit;
?>

404 페이지에 이미지를 넣고 싶은 경우 적절한 이미지를 만들어 추가하는 것도 가능합니다. 해외의 유명 사이트들을 방문하다 보면 404 페이지에 이미지를 표시하는 경우도 간혹 봅니다.

404 페이지 호출이 잦아서 트래픽을 많이 소모하는 경우 심플하게 만드는 것을 고려할 수도 있을 것입니다.

디도스 공격의 우려가 있는 경우에는 클라우드플레어(Cloudflare)에 가입하여 도메인을 연동하고 디도스 공격 시에 Under Attack 모드로 전환하면 대부분의 트래픽을 클라우드플레어에서 감당하므로 어느 정도 디도스 공격에 대한 방어가 가능합니다.

저는 디도스 공격이 시작되면 이메일로 알림이 오도록 설정했습니다.😄

참고


댓글 남기기

Leave a Comment