WordPress에서 404 페이지 템플릿을 개선하는 방법(2가지 방법)

최근 게시물 게시판 wordpress WordPress에서 404 페이지 템플릿을 개선하는 방법(2가지 방법)

  • WordPress에서 404 페이지 템플릿을 개선하고 싶습니까?

    기본 WordPress 404 페이지를 개선하면 더 나은 사용자 경험을 만들고 이탈률을 줄이고 페이지뷰를 늘릴 수 있습니다.

    이 기사에서는 WordPress에서 404 페이지 템플릿을 단계별로 사용자 정의하는 방법을 보여줍니다.

    WordPress에서 404 페이지 템플릿을 개선하는 이유는 무엇입니까?

    기본 WordPress 404 페이지를 방문하는 대부분의 방문자는 귀하의 워드프레스 웹사이트 빨리.

    이는 이탈률을 높이고 사용자 경험을 저하시키며 검색 엔진 순위에 부정적인 영향을 줄 수 있습니다.

    WordPress 404 페이지를 개선하여 방문자를 인기 있는 게시물로 보낼 수 있으며, 페이지뷰 증가 및 이탈률 감소, 일회성 방문자를 장기 독자 및 고객으로 전환합니다.

    404페이지 예시

    방문자가 사이트에 더 오래 머무를수록 구매하고, 더 많은 게시물을 읽고, 이메일 목록, 그리고 더.

    또한, 귀하의 워드프레스 SEO, 검색 엔진 트래픽을 더 많이 얻을 수 있습니다.

    노트 : 맞춤 404 페이지를 만드는 것도 중요하지만 방문자가 웹사이트를 방문하는 데 사용하는 404 URL을 추적한 다음 적절한 리디렉션을 설정하여 SEO 순위를 개선해야 합니다.

    자세한 내용은 다음 가이드를 참조하세요. WordPress에서 404 페이지를 쉽게 추적하고 리디렉션하는 방법.

    즉, WordPress에서 404 페이지 템플릿을 개선하는 방법을 살펴보겠습니다.

    방법 1. 코드 없이 WordPress에서 사용자 정의 404 페이지 만들기

    404 페이지 템플릿을 개선하는 가장 초보자 친화적인 방법은 SeedProd 페이지 빌더 플러그인을 사용하는 것입니다.

    SeedProd 이다 WordPress를 위한 최고의 랜딩 페이지 빌더. 코드를 작성하지 않고도 WordPress 페이지를 생성, 편집 및 사용자 지정할 수 있습니다.

    이 플러그인을 사용하면 포함된 404 페이지 템플릿을 사용하여 사용자 정의 404 페이지를 쉽게 만들 수 있습니다.

    가장 먼저 해야 할 일은 SeedProd 플러그인을 설치하는 것입니다. 자세한 내용은 단계별 가이드를 참조하세요. WordPress 플러그인을 설치하는 방법.

    노트 : ~이있다 SeedProd 무료 버전 사용할 수 있지만 필요한 404 페이지 템플릿이 있으므로 Pro 버전을 사용할 것입니다.

    활성화 시 다음으로 이동해야 합니다. SeedProd » 설정 그리고 라이센스 키를 입력합니다. SeedProd 웹사이트의 계정 페이지에서 이 정보를 찾을 수 있습니다.

    SeedProd 라이센스 키 입력

    그 후, 로 이동 SeedProd » 페이지 ‘404 페이지’ 메타 상자에서 ‘404 페이지 설정’ 버튼을 클릭합니다.

    그러면 404 페이지 템플릿을 선택할 수 있는 페이지로 이동합니다.

    404 페이지 설정

    신속하게 시작하는 데 도움이 되도록 선택할 수 있는 전문적으로 디자인된 수십 개의 404 페이지 템플릿이 있습니다.

    템플릿을 선택하려면 템플릿 위로 마우스를 가져간 다음 ‘확인 표시’ 아이콘을 클릭합니다. 이 자습서에서는 ‘Oh No 404 Page’ 템플릿을 사용하지만 원하는 템플릿을 사용할 수 있습니다.

    404 페이지 템플릿 선택

    템플릿을 선택하면 끌어서 놓기 빌더로 이동하여 404 페이지 사용자 지정을 시작할 수 있습니다.

    화면 왼쪽에서 404 페이지에 추가할 수 있는 블록과 섹션을 찾을 수 있습니다. 페이지의 오른쪽은 라이브 미리보기입니다. 페이지의 모든 요소를 ​​편집하고 사용자 지정할 수 있습니다.

    SeedProd 편집기

    먼저 텍스트를 추가하고 사용자에게 다음에 수행할 작업을 알려줄 것입니다. 단순히 404 페이지를 방문하고 떠나는 대신 방문자를 가치 있는 콘텐츠와 취해야 할 다음 조치로 안내할 수 있습니다.

    이렇게 하려면 ‘텍스트’ 블록을 페이지로 드래그하고 클릭하여 텍스트를 변경합니다.

    텍스트 블록 추가

    다음으로, 우리는 홈페이지 버튼 링크를 변경하고 대신 가장 가치 있는 콘텐츠 중 하나에 링크할 것입니다.

    이것은 귀하의 게시물이 될 수 있습니다 워드프레스 블로그 그것이 가장 인기 있거나 가장 많은 수익을 가져다주는 것입니다.

    먼저 ‘Headline’ 블록 위로 드래그하고 새 헤드라인을 추가합니다.

    헤드라인 블록 추가

    그런 다음 다른 ‘텍스트’ 블록 위로 드래그하고 기사를 설명하는 텍스트를 입력합니다.

    그런 다음 버튼을 클릭하여 버튼 편집기 화면을 불러옵니다.

    버튼 텍스트 변경

    여기에서 텍스트, 색상, 크기 등을 사용자 지정할 수 있습니다.

    WordPress 404 페이지에 가장 인기 있는 게시물 추가

    다음으로 가장 인기 있는 기사를 추가할 수 있습니다. 이 기사는 인기가 있는 것으로 입증되었으므로 방문자가 좋아하는 것을 찾을 가능성이 높습니다.

    이를 수행하는 가장 쉬운 방법은 다음을 사용하는 것입니다. 몬스터 인사이트 플러그인. 그건 WordPress를 위한 최고의 분석 솔루션 3백만 개 이상의 웹사이트에서 사용됩니다.

    이 플러그인을 사용하면 WordPress 웹사이트 어디에서나 인기 있는 게시물을 간단히 추가할 수 있습니다.

    자세한 내용은 다음 가이드를 참조하세요. WordPress에서 조회수별로 인기 게시물을 표시하는 방법.

    플러그인이 활성화되고 설정되면 페이지에 단일 단축 코드를 추가하기만 하면 됩니다.

    이렇게 하려면 ‘단축 코드’ 블록을 페이지로 끌어다 놓기만 하면 됩니다.

    단축 코드 블록 추가

    그런 다음 다음 단축 코드를 입력하여 가장 인기 있는 게시물을 표시합니다.

    [monsterinsights_popular_posts_widget theme="beta"]

    그만큼 theme=“beta” 부분은 인기 게시물이 표시되는 방식을 나타냅니다. 다양한 테마가 어떻게 보이는지 보려면 다음으로 이동하십시오. 인사이트 » 인기 게시물 ‘인기 게시물 위젯’을 클릭합니다.

    ‘테마 선택’ 섹션에서 각 테마와 이름을 볼 수 있습니다.

    인기 게시물 테마 선택

    위와 동일한 단계에 따라 인기 게시물 위에 헤드라인을 추가할 수도 있습니다.

    WordPress 404 페이지에 문의 양식 추가

    그런 다음 404 페이지에 직접 문의 양식을 추가할 수 있습니다. 이렇게 하면 방문자가 위의 링크에서 원하는 것을 찾을 수 없는 경우 귀하에게 연락할 수 있습니다.

    사이트에 문의 양식을 추가하는 가장 좋은 방법은 WPForms 플러그인. 그건 WordPress를 위한 최고의 연락처 양식 플러그인 4백만 개 이상의 웹사이트에서 사용됩니다.

    자세한 내용은 단계별 가이드를 참조하세요. WordPress에서 연락처 양식을 만드는 방법.

    플러그인이 활성화되고 설정되면 ‘문의 양식’ 블록을 페이지로 끌어다 놓기만 하면 됩니다.

    문의 양식 블록 추가

    그런 다음 드롭다운 목록에서 연락처 양식을 선택하기만 하면 됩니다.

    404 페이지에 추가하려면 먼저 연락처 양식을 만들어야 합니다.

    연락처 양식 드롭다운 선택

    연락처 양식 위에 ‘제목’ 또는 ‘텍스트’ 블록을 추가할 수도 있습니다.

    해당 블록을 추가하려면 위와 동일한 단계를 따르십시오.

    문의 양식 헤드라인 블록

    변경이 완료되면 페이지의 오른쪽 상단 모서리에 있는 ‘저장’을 클릭해야 합니다.

    페이지를 실시간으로 게시하려면 ‘저장’ 옆에 있는 드롭다운 화살표를 선택하고 ‘게시’를 클릭하십시오.

    변경 사항을 저장하고 페이지를 라이브로 만들기

    로고 및 탐색 메뉴를 클릭하고 왼쪽 패널에서 변경한 다음 위와 동일한 편집 프로세스를 수행하여 변경할 수도 있습니다.

    계속해서 페이지를 사용자 정의하고, 새 블록을 추가하고, 다양한 레이아웃을 테스트하여 방문자가 선호하는 것을 확인하십시오.

    404 페이지 템플릿 최종

    당신이 우커머스 상점 소유자는 다음을 수행하여 404 페이지를 사용자 정의할 수 있습니다. 인기상품 전시 더 많은 판매를 돕기 위해.

    새 404 페이지를 활성화하려면 SeedProd » 페이지 그런 다음 ‘404 페이지’ 토글을 ‘활성’으로 전환합니다.

    404 페이지 활성화

    이제 방문자는 기본 옵션 대신 전환율이 높은 404 페이지를 보게 됩니다.

    전문가 팁: WordPress 404 페이지의 성능을 추적하여 변환 방식과 가장 유용한 변경 사항을 확인할 수 있습니다. 자세한 내용은 에 대한 초보자 가이드를 참조하십시오. WordPress에 Google 애널리틱스를 설치하는 방법.

    방법 2. 코드를 추가하여 WordPress에서 사용자 정의 404 페이지 만들기

    이 방법은 코드를 추가하고 WordPress 테마 파일을 수정해야 하기 때문에 초보자에게 친숙하지 않습니다.

    이전에 이 작업을 수행하지 않은 경우 초보자 가이드를 참조하십시오. 웹에서 워드프레스로 스니펫 붙여넣기.

    먼저 WordPress 테마 폴더에 새 파일을 만들고 이름을 지정해야 합니다. 404.php. 테마에 이미 404.php 파일을 선택한 다음 대신 해당 파일을 편집해야 합니다.

    이 파일을 편집하려면 워드프레스 호스팅 FTP 클라이언트 또는 파일 관리자 도구가 있는 계정.

    FTP 404.php 파일

    웹사이트에 연결하면 다음을 볼 수 있습니다. 404.php WordPress 테마 폴더에 있는 파일.

    노트 : WordPress 테마를 사용자 지정하기 전에 WordPress 사이트를 백업하는 것이 좋습니다. 자세한 내용은 다음 가이드를 참조하세요. WordPress 사이트를 백업하고 복원하는 방법.

    404 페이지에 가장 인기 있는 게시물 표시

    가장 먼저해야 할 일은 무료를 설치하고 활성화하는 것입니다. 워드프레스 인기 게시물 플러그인. 중 하나입니다 WordPress용 최고의 인기 게시물 플러그인.

    자세한 내용은 단계별 가이드를 참조하세요. WordPress 플러그인을 설치하는 방법.

    활성화 시 이 템플릿 태그를 404.php 인기 게시물을 표시할 파일입니다.

    
    <?php wpp_get_mostpopular(); ?>
    

    404 페이지에서 가장 많이 댓글이 달린 게시물 표시

    가장 댓글이 많은 게시물을 WordPress 404 페이지에 추가하기 위해 위에서 활성화한 것과 동일한 플러그인을 사용합니다.

    가장 많이 댓글이 달린 게시물을 표시하려는 위치에 다음 템플릿 태그를 추가하기만 하면 됩니다.

    
    <?php wpp_get_mostpopular("range=all&order_by=comments"); ?>
    

    당신은 또한 우리의 가이드를 확인할 수 있습니다 WordPress에서 가장 많은 댓글이 달린 게시물을 표시하는 방법.

    404 페이지에 최근 게시물 표시

    여러 가지 방법이 있습니다 최근 게시물 표시 워드프레스에서.

    가장 쉬운 방법은 404 템플릿에 이 템플릿 태그를 추가하여 최근 게시물을 표시하는 것입니다.

    
    <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => '', 'after' => '<br />' ) ); ?>
    

    404 페이지에 임의의 게시물 표시

    WordPress에 임의의 게시물 목록을 표시하려면 사이트의 임의의 게시물 목록을 표시하려는 404 템플릿에 이 코드를 추가하기만 하면 됩니다.

    
    <ul>
    <?php 
    $posts = get_posts('orderby=rand&numberposts=5'); 
       foreach($posts as $post) { ?>
            <li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
            </li>
       <?php } ?>
    </ul>
    

    컴팩트 아카이브로 월간 아카이브 추가

    웹 사이트에 많은 콘텐츠가 있는 경우 이를 구성하는 한 가지 좋은 방법은 월간 아카이브를 표시하는 것입니다.

    여기 WPBeginner에서는 404 페이지에 월간 아카이브를 다음을 사용하여 표시합니다. 컴팩트 아카이브 플러그인. 이 플러그인은 우리 팀에서 개발 및 유지 관리합니다.

    자세한 내용은 다음 가이드를 참조하세요. WordPress에서 압축 아카이브를 만드는 방법.

    플러그인이 활성화되고 설정되면 다음 코드를 404.php 파일.

    
    <p><strong>By Date</strong></p>
    <ul>
    <?php compact_archive($style="block"); ?>
    </ul>
    

    사용자가 404 페이지를 방문하면 압축된 게시물 아카이브가 표시됩니다.

    다음은 404 페이지에 표시되는 방법입니다.

    컴팩트 아카이브 WPBeginner

    WordPress용 샘플 404 템플릿

    다음은 샘플입니다. 404.php 기본 WordPress 테마 Twenty Twenty-One의 404페이지 템플릿을 기반으로 하는 파일입니다.

    
    <?php
    /**
     * The template for displaying 404 pages (not found)
     *
     * @link https://codex.wordpress.org/Creating_an_Error_404_Page
     *
     * @package WordPress
     * @subpackage Twenty_Twenty_One
     * @since Twenty Twenty-One 1.0
     */
    
    get_header();
    ?>
    
    	<header class="page-header alignwide">
    		<h1 class="page-title"><?php esc_html_e( 'Nothing here', 'twentytwentyone' ); ?></h1>
    	</header><!-- .page-header -->
    
    	<div class="error-404 not-found default-max-width">
    		<div class="page-content">
    			<p><?php esc_html_e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentytwentyone' ); ?></p>
    			<?php get_search_form(); ?>
    			
    			<h4>While you're here, check out some of our popular content:</h4>
     
    <div class="col1">
    <div class="col-header">          
    <strong>Popular</strong>
    </div>
    <?php wpp_get_mostpopular(); ?>
    </div>
     
    <div class="col2">
    <div class="col-header">          
    <strong>Comments</strong>
    </div>
     <?php wpp_get_mostpopular("range=all&order_by=comments"); ?>
    </div>
     
    <div class="col3">
    <div class="col-header">          
    <strong>Recent</strong>
    </div>
     <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 5, 'format' => 'custom', 'before' => '', 'after' => '<br />' ) ); ?>
    </div>
    			
    		</div><!-- .page-content -->
    	</div><!-- .error-404 -->
    
    <?php
    get_footer();
    
    

    이 404 템플릿을 Twenty Twenty-One의 기본 템플릿과 비교하십시오.

    검색 양식 바로 뒤에 인기 있는 게시물, 댓글이 가장 많이 달린 게시물 및 최근 게시물을 표시하는 맞춤 코드가 추가되었음을 알 수 있습니다.

    그런 다음 WordPress 테마 스타일시트에 사용자 정의 CSS를 추가하여 열로 나눕니다.

    자세한 내용은 다음 가이드를 참조하세요. WordPress 사이트에 사용자 정의 CSS를 쉽게 추가하는 방법.

    
    .col1, .col2, .col3 { 
    width:30%;
    float:left;
    padding:0px 10px 10px 10px;
    margin:0px;
    }
    .col3:after{
    clear:both;
    }
    .col-header { 
    background:#28303D;
    color:#D1E3DD;
    margin:0px;
    padding:1px;
    text-align:center;
    }
    

    위의 사용자 정의 404 페이지 코드를 추가한 후의 최종 결과입니다.

    사용자 정의 404 페이지 예

    이 기사가 WordPress에서 404 페이지 템플릿을 개선하는 데 도움이 되었기를 바랍니다. 당신은 또한보고 싶을 수도 있습니다 최고의 WordPress 404 오류 페이지 디자인 예제 우리의 전문가가 선택한 최고의 웹 푸시 알림 소프트웨어 웹사이트 트래픽을 늘리기 위해

    이 기사가 마음에 들면 구독하십시오. 유튜브 채널 WordPress 비디오 자습서용. 당신은 또한 우리를 찾을 수 있습니다 트위터페이스북.

    Source link

    신고하기
'WordPress에서 404 페이지 템플릿을 개선하는 방법(2가지 방법)'에 답변달기
글쓴이 정보:




21 − = 18