WordPress에서 404 페이지를 편집하는 방법(사용자 정의 가이드) | WP 버프

모든 콘텐츠 제작자와 사이트 관리자는 작은 세부 사항이 매우 중요하며 인터넷에는 두 번째 인상이 없다는 것을 알고 있습니다. 아름다운 색 구성표, 뛰어난 애니메이션 효과 또는 매력적인 404 페이지는 사용자 경험을 만들거나 깨뜨리는 세부 정보입니다.

404 페이지는 페이지를 찾을 수 없는 상황을 설명하는 기술적인 표현입니다. 예를 들어, 사용자가 브라우저 탭에서 URL을 잘못 입력했거나 해당 웹 페이지가 더 이상 온라인 상태가 아니기 때문일 수 있습니다.

다음 단락에서는 WordPress에서 404 페이지를 편집하는 방법을 배웁니다. 매력적인 404 페이지는 당황스러운 순간을 극복하는 최고의 솔루션입니다. 사이트 방문자를 실망시키는 대신 우수한 404 페이지가 브랜드 이미지를 높이는 데 기여할 것입니다.

404 페이지란?

링크를 클릭하거나 브라우저 탭에 URL 주소를 입력합니다. 그런 다음 브라우저는 방문하려는 웹 사이트를 호스팅하는 서버에서 데이터를 요청하기 시작합니다. 인터넷 브라우징에 대한 기본적인 설명입니다. 브라우저와 서버 간의 정보 교환은 무엇보다도 몇 가지 상태 코드를 의미합니다. 또한 웹 페이지 리디렉션, 클라이언트 또는 서버 오류 또는 정보 제공 목적을 설명하는 상태가 있습니다.

4XX 형식의 모든 상태 코드는 클라이언트 오류를 ​​나타냅니다. 예를 들어, 403 Forbidden은 서버가 브라우저의 요청을 이해하지만 데이터 제공을 거부하는 경우입니다. 지금까지 404 페이지는 가장 유명한 상태 코드입니다. 깨진 링크를 클릭하거나, 존재하지 않는 웹페이지로 연결되는 잘못된 URL을 입력하거나, 요청한 리소스가 존재하지 않은 경우 404 페이지가 표시됩니다.

거대한 잡지 뉴스나 자주 방문한 상점과 같은 필수 사이트에도 404 페이지 오류가 포함될 수 있습니다. 물론 어쩔 수 없는 일이지만 당혹스러운 상황을 이겨낼 줄 알아야 한다. 따라서 사이트에 대해 보기 좋은 404 오류 페이지를 만들기 위해 가능한 모든 일을 했다면 도움이 될 것입니다.

좋은 404 페이지의 해부학

일부 웹사이트는 멋진 404 페이지가 포함된 목록에서 언급함으로써 백링크와 대중의 인정을 받습니다. 사이트 방문자는 404 페이지에서 좋은 디자인이나 유머러스한 메시지를 높이 평가합니다. 이것은 보기 좋은 404 오류 페이지가 온라인 비즈니스의 우선 순위임을 확신시켜 줄 것입니다. 다음은 좋은 404 페이지에 포함되어야 하는 내용입니다.

● 오류 메시지 – 사용자는 404 페이지에 도달하는 순간부터 문제를 인식해야 합니다. 모든 사람이 이해할 수 있도록 명시하십시오.

● 콘텐츠 링크 – 사용자가 사이트를 떠나는 것을 원하지 않습니다. 관련 콘텐츠에 대한 링크를 제공합니다. 최고의 콘텐츠 또는 누락된 페이지와 관련된 내용은 전적으로 귀하에게 달려 있습니다. 중요한 것은 그것들을 귀하의 사이트에 유지하는 것입니다.

● 사과 – 불편을 끼쳐드려 죄송합니다. 가능하면 유머를 사용하십시오. 귀하의 사이트에 두 번째 기회를 주기 위해 유머를 사용하는 것이 가장 좋은 방법입니다.

● 좋은 디자인 – 사람들은 404 페이지에 도달했을 때 실망하고 과민 반응하는 경향이 있습니다. 매력적인 콘텐츠와 함께 멋진 디자인은 마음을 바꿀 수 있습니다. 훌륭한 404 페이지를 만들기 위해 최선을 다하십시오.

WordPress에서 404 페이지를 편집하는 방법

운 좋게도 WordPress에는 404 페이지를 편집할 수 있는 다양한 옵션이 있습니다. 가장 숙련된 사용자는 404.php 파일을 편집할 수 있습니다. 이것은 404 오류 페이지를 표시하는 파일입니다. Elementor와 같은 페이지 빌더 사용을 선호하는 웹 관리자는 404 페이지를 만들 수 있습니다. 마지막으로 코딩 기술이 부족한 사람들을 위해 404 페이지를 만드는 몇 가지 플러그인을 사용할 수 있습니다. WordPress에서 404 페이지를 만들고 편집하는 모든 방법을 살펴보겠습니다.

FTP 클라이언트를 통해 404 페이지 편집

좋은 경험 법칙은 코드를 편집하기 전에 사이트의 백업 복사본을 수행하는 것입니다. 이 단계를 절대 건너뛰지 마십시오. 대부분의 경우 사이트 백업이 필요하지 않지만 준비하지 않으면 나쁜 일이 발생합니다. 따라서 안심하고 백업을 수행하십시오!

전체 사이트 백업을 수행했고 문제에 대해 더 자세히 알아볼 준비가 되었다고 가정해 보겠습니다. 선택한 FTP 클라이언트를 사용하고 localhost 사이트에 연결합니다. 404.php 파일이라는 파일을 검색합니다. 이 파일은 404 오류 웹페이지를 표시하는 파일입니다. 일반적으로 WordPress 테마에는 전용 404.php 파일이 있지만 일부는 이 파일을 놓칠 수 있습니다. 테마 코드에 404.php 파일이 포함되어 있는지 다시 확인하십시오. 테마에 404.php 파일이 없으면 파일을 만들어야 합니다. 새 파일을 만들고 다음 코드 줄을 복사합니다.

404 페이지 템플릿

 <?php /** * The template for displaying 404 pages (Not Found) * * @package WordPress * @subpackage Twenty_Thirteen * @since Twenty Thirteen 1.0 */ get_header(); ?> <div class="content-area"> <div class="site-content" role="main"> <header class="page-header"> <h1 class="page-title"><?php _e( 'Not Found', 'twentythirteen' ); ?></h1> </header> <div class="page-wrapper"> <div class="page-content"> <h2><?php _e( 'This is somewhat embarrassing, isn't it?', 'twentythirteen' ); ?></h2> <p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentythirteen' ); ?></p> <?php get_search_form(); ?> </div><!-- .page-content --> </div><!-- .page-wrapper --> </div><!-- #content --> </div><!-- #primary --> <?php get_footer(); ?>

출처 : WordPress Codex에서 오류 404 페이지 만들기

이것은 404 Page of Twenty Thirteen 테마의 코드입니다. 편집 및 프로젝트 사용에 적합한 기본 페이지입니다. 물론 다른 기본 WordPress 테마를 살펴보고 404 페이지를 확인할 수 있습니다. Twenty Thirteen 테마의 404 페이지는 사이트의 머리글과 바닥글을 호출하므로 페이지가 사이트 스타일과 일치합니다. 사이트가 어떻게 보이든 404 오류 페이지는 유사한 디자인을 갖습니다. 그러나 이 페이지에 표시되는 내용을 조정해야 합니다. 이 단계에서 콘텐츠 제작자의 재능이 개입합니다.

선택적으로 404.php 파일을 편집하여 사이트에 게시된 콘텐츠를 표시할 수 있습니다. 옵션은 무한하므로 404 페이지 오류를 개선할 수 있는 몇 가지 잠재적인 양식을 살펴보겠습니다.

• 최근 7개 게시물의 제목 표시 - 이 코드 조각을 404.php 파일에 붙여넣기만 하면 됩니다.

 <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 7, 'format' => 'custom', 'before' => '<span class="my-post-title">', 'after' => '</span>, ' ) ); ?>

• 임의의 7개 게시물 제목 표시 7개의 임의 게시물을 표시하려면 다음 코드를 붙여넣습니다.

 <ul> <?php $rand_posts = get_posts( array( 'posts_per_page' => 5, 'orderby' => 'rand' ) ); if ( $rand_posts ) { foreach ( $rand_posts as $post ) : setup_postdata( $post ); ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endforeach; wp_reset_postdata(); } ?> </ul>

로고 또는 재미있는 이미지(고양이와 개는 항상 작동)를 추가하여 시청자를 웃게 만들고 두 번째 기회를 제공하세요. 다음으로 편집 작업을 마친 후 404 페이지를 테스트합니다. 404 페이지를 표시하려면 브라우저 표시줄에 사이트 주소를 입력하고 그 뒤에 임의의 문자열을 추가합니다. 결과는 다음과 같아야 합니다.

 https://example.com/dfdfddfd

작동하지 않는 경우 서버가 사용자 정의 404.php 파일을 찾을 수 없기 때문입니다. 이 시나리오에서는 사이트 .htaccess 파일로 이동하여 다음 코드 줄을 붙여넣어야 합니다.

오류 문서 404 /index.php?error=404

중요 : 신규 또는 최근에 시작한 웹사이트를 편집하는 경우 .htaccess 파일이 없을 수 있습니다. 큰 문제는 아닙니다. 사이트의 영구 링크를 변경하고 작업을 저장하십시오. 그런 다음 즉시 원하는 영구 링크 형식으로 되돌립니다. 이러한 방식으로 .htaccess 파일을 생성하게 됩니다.

테마 편집기를 통해 404 페이지 편집(권장하지 않음)

WordPress의 404 페이지 편집과 관련된 많은 기사에서 테마 편집기를 실행 가능한 솔루션으로 언급합니다. 그렇지 않아! WordPress 관리 대시보드에서 직접 사이트 코드를 편집하는 것이 편리하고 간단하지만 위험하고 결국 실패할 수 있습니다. 말할 것도 없이, 온라인 상태이고 모든 사람이 액세스할 수 있는 동안 사이트를 편집하는 것은 전혀 전문적이지 않습니다. 게다가 테마를 업데이트하면 편집 내용이 사라집니다(하위 테마를 사용하지 않는 한).

페이지 빌더를 통해 404 페이지 편집

이 방법은 안전하고 간단하며 효과적입니다. Elementor, Divi Builder, Beaver Builder, SeedProd 또는 Themify Builder와 같은 페이지 빌더에 익숙할 것입니다. 당신이 선택하는 것은 당신이 그것을 잘 이해하고 있는 한 관련이 없습니다. 이 빌더를 사용하면 코드를 한 줄도 작성하지 않고도 우수한 404 페이지를 만들 수 있습니다. 코드 스니펫을 사이트 파일에 붙여넣는 것이 걱정된다면 이것이 가장 좋은 솔루션입니다.

블로그와 즐겨찾는 페이지 빌더의 문서를 확인하면 404 페이지를 만드는 방법을 설명하는 자습서를 찾을 수 있습니다. 또한 일부 페이지 빌더에는 404페이지 전용 템플릿이 있습니다. 템플릿을 선택하고 브랜드에 맞게 개인화하십시오.

404 페이지 WordPress 플러그인

전용 플러그인으로 404 페이지를 만드는 방법은 많지 않습니다. 그러나 몇 가지 플러그인에 주의를 기울일 필요가 있습니다. 그들의 장점은 404페이지를 만들고 편집하기 위해 코드를 작성할 필요가 없다는 것입니다. 플러그인은 간단하고 효과적이며 가볍습니다.

404페이지  

좋은 404 오류 페이지를 만들려면 코더가 되어야 한다고 생각하고 싶을 수 있습니다. 이 플러그인 덕분에 모든 사람이 매력적인 404 오류 페이지를 구상할 수 있습니다. 게다가 404page 플러그인은 페이지 빌더만큼 복잡하지 않습니다. 당신은 최종 제품에 집중합니다 – 좋은 404 오류 페이지.

플러그인을 설치하고 활성화합니다. 그런 다음 사이트의 나머지 페이지와 동일한 방식으로 404 페이지를 만듭니다. WordPress 관리 대시보드에서 모양 > 404 오류 페이지 로 이동하여 사이트 사용자 지정 404 오류 페이지로 방금 구축한 페이지를 선택합니다.

이 플러그인은 웹페이지 리디렉션을 허용하지 않습니다. 웹 페이지가 누락되었음을 검색 봇에게 알릴 뿐입니다. 404page는 개발자의 개인 프로젝트이므로 이 플러그인 뒤에는 에이전시가 없습니다. 플러그인이 100,000개의 활성 설치와 거의 완벽한 등급(5점 만점에 4.9개)이라는 점을 고려하십시오. 이러한 상황에서 플러그인 개발자는 우리의 감사를 받을 만합니다!

모든 404 홈페이지 및 깨진 이미지 리디렉션으로 리디렉션  

플러그인의 이름은 그다지 인상적이지는 않지만 매우 암시적입니다. 플러그인은 이전 대안과 다르게 404 페이지 오류를 처리합니다. 잘 디자인된 404 페이지로 방문자를 즐겁게 하는 대신 이 플러그인은 모든 404 오류를 홈페이지나 다른 웹페이지로 리디렉션합니다. 이 플러그인의 가장 큰 장점은 사이트에서 끊어진 링크를 제어할 수 있다는 것입니다. 또한 이 플러그인을 사용하여 사용자를 리디렉션할 수 있습니다. 예를 들어 사람들이 업데이트되지 않은 블로그 게시물을 방문하게 하는 대신 이 플러그인을 사용하여 업데이트된 버전으로 안내합니다.

Colorlib 404 커스터마이저  

이 플러그인은 사용이 간편하며 매력적인 404페이지를 만드는 데 도움이 됩니다. 필요에 맞게 사용자 지정할 수 있는 전문적으로 제작된 404 템플릿이 함께 제공됩니다. Colorlib 404 Customizer 플러그인을 사용하면 소셜 미디어 버튼을 삽입하고, 배경색이나 이미지를 변경하고, 텍스트 제목을 구성할 수 있습니다. 고급 사용자는 사용자 정의 CSS 코드를 추가할 수 있습니다. 플러그인은 오픈 소스이므로 플러그인 개선에 기여할 수 있습니다.

페이지 빌더를 사용하거나 테마를 통해 수행하십시오 .

이미 페이지 빌더를 사용하고 있다면 이를 통해 404를 사용자 정의할 수 있는 옵션이 이미 있습니다. 거의 모든 페이지 빌더에서 404 페이지를 편집할 수 있습니다. 다음은 할 수 있다고 확신하는 플러그인 목록입니다.

● 미풍

● 엘리멘터

● 비버 빌더

● 디비 빌더

● 사이트 출처

OceanWP, GeneratePress 또는 Astra와 같은 테마를 사용하는 경우 테마 옵션을 통해 수행할 수 있습니다. 데모 콘텐츠를 가져오면 완성된 멋진 404 페이지를 얻을 수 있습니다. 데모 콘텐츠를 가져오고 사전 제작된 디자인을 사용하는 경우의 유일한 단점은 웹사이트가 데모와 거의 비슷하게 보인다는 것입니다. 예를 들어 이 웹사이트와 Astra 데모를 살펴보십시오. Astra의 시작 사이트 라이브러리를 살펴본 모든 사람은 웹 사이트 소유자가 직접 만든 것이 아님을 빠르게 인식할 것입니다. 이는 사용자가 사이트를 얼마나 신뢰하는지에 해를 끼칠 수 있습니다.

긍정적인 측면에서 Astra, OceanWP 및 500,000명 이상의 사용자가 있는 기타 테마는 매월 시작 사이트 라이브러리를 더 확장합니다.

너에게로

이제 WordPress에서 404 페이지를 편집하는 방법에 대한 명확한 아이디어가 생겼습니다. 이를 수행하는 데는 여러 가지 솔루션이 있으며 자신의 기술과 요구 사항에 적합한 솔루션을 선택해야 합니다. 중요한 것은 시청자를 즐겁게 하는 흥미로운 404 오류 페이지를 갖는 것입니다. 404 페이지를 디자인하고 구현하는 데 사용하는 방법과 도구는 고객과 관련이 없습니다. 훌륭한 404 오류 페이지가 없는 것은 변명의 여지가 없습니다! 드로잉 보드로 이동하여 사용자 정의 오류 페이지 작성을 시작하십시오!