개발천재

워드프레스에서 원하는 포스트를 상단에 고정하는 방법 본문

워드프레스

워드프레스에서 원하는 포스트를 상단에 고정하는 방법

세리블리 2024. 9. 4. 15:14
반응형

워드프레스 사이트를 운영하다 보면 특정 포스트를 상단에 고정시켜야 할 때가 있다. 공지사항과 같은 중요한 정보를 전달하거나, 사이트 방문자가 제일 먼저 그 포스트를 보게 하기 위해서 포스트를 제일 먼저 고정시켜야 한다.
이처럼 포스트를 상단에 고정하는 것은 중요한 정보 전달과 방문자에게 유용한 정보를 제공하기 위한 전략적인 기능이라고 할 수 있다.

워드프레스에서는 간단한 설정으로 특정 포스트를 상단에 고정시킬 수 있지만, 테마를 커스텀하여 고정시키는 방법도 있다.
 
 

워드프레스 관리자 페이지에서 설정하는 방법

워드프레스 관리자 페이지에서 특정 포스트를 상단에 고정하는 방법은 다음과 같다.

 

먼저 관리자 대시보드에 로그인 한 다음 포스트 목록으로 이동한다. 

포스트 목록에서 고정하려는 포스트의 제목에 마우스를 올리면 (편집/빠른편집/휴지통/보기) 버튼이 나오는데 여기에서 "편집" 또는 "빠른 편집"을 클릭한다.



편집을 클릭한 경우상단 포스트 편집 화면의 오른쪽 사이드바에 있는 "문서" 탭을 보게 되면 "붙박이"라고 되어 있는데 여기를 체크한 후 업데이트 한다.

 

빠른 편집을 사용하는 경우, "이 글을 고정으로 만들기"에 체크하고 업데이트를 클릭한다.

 

카테고리 페이지를 확인하면 체크했던 해당 포스트가 웹사이트의 첫 페이지에 상단 고정으로 표시되는 것을 볼 수 있을 것이다. 꼭 한개가 아니라 여러 개의 포스트를 상단에 고정할 수도 있으며, 이 경우 설정된 순서대로 고정한 포스트들이 표시된다.

 

테마 파일을 수정해야할 경우

자체적으로 테마를 개발해서 사용하거나, 차일드 테마를 이용하여 커스텀해서 쓸 수 있는 경우는 아래의 코드를 추가하여 포스트를 상단에 노출시킬 수 있다.

 

먼저, 상단 고정 포스트를 Loop 전에 출력해야 한다. category.php 파일에 아래의 코드를 추가한다.

<?php
// 상단 고정 포스트 쿼리 설정
$sticky = get_option('sticky_posts');
$args = array(
    'posts_per_page' => -1, // 모든 고정 포스트를 가져옴
    'post__in'  => $sticky, // 고정 포스트만 포함
    'ignore_sticky_posts' => 1, // 중복 방지
    'category_name' => single_cat_title('', false) // 현재 카테고리의 고정 포스트만 표시
);

// 고정 포스트 쿼리
$sticky_query = new WP_Query($args);

// 고정 포스트 출력
if ($sticky_query->have_posts()) :
    while ($sticky_query->have_posts()) : $sticky_query->the_post();
        // 여기에서 고정 포스트의 HTML 구조를 넣으세요
        get_template_part('template-parts/content', get_post_format());
    endwhile;
    wp_reset_postdata(); // 기본 쿼리로 돌아감
endif;
?>​

 

기본 Loop 설정하기

위 코드는 카테고리 페이지에 상단 고정 포스트를 먼저 출력하고, 이후에 나머지 일반 포스트들이 출력되도록 하는 코드이다. category.php 파일에 이미 존재하는 기본 Loop는 그대로 둔다.

기본 Loop는 보통 아래와 같은 형태로 되어 있다.

<?php if ( have_posts() ) : ?>
    <?php while ( have_posts() ) : the_post(); ?>
        <?php
        // 여기에서 기본 포스트의 HTML 구조를 넣으세요
        get_template_part('template-parts/content', get_post_format());
        ?>
    <?php endwhile; ?>
<?php endif; ?>

 

반응형