워드프레스로 블로그를 운영하다 보면 포스팅한 글의 조회수를 표시하고 싶은 경우가 있습니다. 제 워드프레스에는 인디펜던트 애널리틱스 플러그인이 설치되어 있는데요. 이 글에서는 이 플러그인을 활용하여 워드프레스 Onepress 테마에서 관리자만 볼 수 있는 글 조회수 표시 방법에 대해 알아보겠습니다.
워드프레스 Onepress 테마에서 관리자만 볼 수 있는 글 조회수 표시 방법
저의 블로그는 워드프레스 관리자로 로그인했을 때만 아래와 같이 조회수가 표시되고, 일반 사용자로 방문하면 표시가 되지 않도록 설정되어 있습니다. 이는 인디펜던트 애널리틱스 플러그인을 사용해 구현한 것인데요. 이 글에서 이 기능을 적용하는 방법에 대해 자세히 알아보겠습니다.
1. 인디펜던트 애널리틱스 설치 및 설정
이 글에서 적용한 방법은 인디펜던트 애널리틱스 플러그인을 활용하여 구현하였기 때문에, 먼저 해당 플러그인을 설치해야 합니다. 아래 링크를 참고하여 설치하시기 바랍니다.
워드프레스 통계 플러그인 중 최고인 인디펜던트 애널리틱스 (Independent Analytics)
설치가 완료되었다면, ‘설정’으로 이동하여 아래와 같이 설정한 후 ‘Save Settings’를 클릭하면 설정이 변경됩니다. 아래 설정에서 ‘Enable the view counter’를 체크하면 포스팅된 단일 글이나 페이지에 ‘Views: ‘가 표시되고 홈 화면에는 표시되지 않습니다.
2. Onepress 테마의 content.php 코드 수정
① 변경 전
워드프레스 관리자 화면에서 ‘외모’ → ‘테마 파일 편집기’를 순서대로 클릭한 후, 오른쪽 사이드바에서 ‘template-parts’ → ‘content.php’를 클릭하여 엽니다.
‘content.php’ 파일에서 아래 부분을 찾습니다.
<div class="list-article-meta">
<?php the_category(' / '); ?>
</div>
<header class="entry-header">
<?php the_title(sprintf('<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url(get_permalink())), '</a></h2>'); ?>
</header>
<div class="entry-excerpt">
<?php
the_excerpt();
?>
<?php
wp_link_pages(
array(
'before' => '<div class="page-links">' . esc_html__('Pages:', 'onepress'),
'after' => '</div>',
)
);
?>
</div>② 변경 후
위의 코드를 아래와 같이 수정합니다.
- 코드에서 $Categories는 제 블로그에서 사용하는 카테고리명을 정의한 것이기 때문에 여러분이 사용하고 있는 카테고리명으로 수정해야 합니다. 정의된 카테고리가 없을 경우 색상은 ‘rgba(51, 51, 51, 0.3)’으로 적용됩니다.
- View 아이콘은 사람의 눈 모양을 svg 포맷으로 만들어 적용하였습니다. 마음에 들지 않으실 경우 원하는 아이콘 이미지로 변경하시면 됩니다.
do_shortcode는 인디펜던트 애널리틱스 플러그인에서 제공하는 숏코드를 실행하는 코드입니다.
<?php
$categories = [
'it-skill' => ['name' => 'IT Skill', 'color' => 'rgba(9, 89, 162, 0.35)'],
'essential-knowledge' => ['name' => 'Essential Knowledge', 'color' => 'rgba(72, 160, 33, 0.35)'],
'passive-income' => ['name' => 'Passive Income', 'color' => 'rgba(204, 0, 0, 0.35)']
];
$post_categories = get_the_category();
if (empty($post_categories)) return;
$output = '<div class="list-article-meta">';
$show_view_counter = is_user_logged_in();
foreach ($post_categories as $category) {
$category_slug = $category->slug;
$bg_color = $categories[$category_slug]['color'] ?? 'rgba(51, 51, 51, 0.3)';
$category_link = sprintf(
'<a href="%s" style="background-color: %s; color: black; padding: 3px 10px; border-radius: 8px; margin-right: 5px; text-decoration: none;">',
esc_url(get_category_link($category->term_id)),
esc_attr($bg_color)
);
if ($show_view_counter) {
$view_counter = do_shortcode('[iawp_view_counter icon="0"]');
preg_match('/>([^<]+)<\/span>[^<]*<span[^>]*>([^<]+)<\/span>/s', $view_counter, $matches);
$view_counter_text = isset($matches[2]) ? trim($matches[2]) : '';
$svg_icon = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye" style="vertical-align: -4px;"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>';
$category_link .= '<span style="color: black;">' . $svg_icon . ' ' . esc_html($view_counter_text) . ', </span>';
}
$category_link .= '<span style="color: black;">' . esc_html($category->name) . '</span></a>';
$output .= $category_link;
}
$output .= '</div>';
echo $output;
?>
‘content.php’ 파일을 수정한 후 ‘파일 업데이트’를 클릭하여 저장하면 반영됩니다.
위의 작업을 하실 때 가능하면 ‘자식 테마’에서 하시는 것이 좋습니다. Onepress 테마에서 자식 테마를 만들고 적용하는 방법은 아래 링크를 참조하시면 됩니다.
워드프레스 Onepress 테마에서 자식 테마 적용 방법
3. 적용 결과 확인하기
지금까지 워드프레스 Onepress 테마에서 블로그 홈에 조회수를 표시하기 위한 방법을 소개해 드렸습니다. 아래는 적용 결과입니다.
첫 번째 화면은 관리자로 로그인한 후 블로그 홈페이지에 방문했을 때 조회수가 보이는 화면이고, 두 번째 화면은 일반 사용자가 방문했을 때 조회수가 보이지 않는 화면입니다.
- 관리자로 로그인한 후 방문했을 경우
- 일반 사용자가 방문했을 경우
오늘은 워드프레스 Onepress 테마에서 관리자만 볼 수 있는 글 조회수 표시 방법에 대해 상세히 알아보았습니다. 이 글이 워드프레스 Onepress 테마를 사용하시는 분들에게 조금이라도 도움이 되길 바랍니다.