How to display views count in WordPress posts or pages

If your articles get high number of views and you want to show it to the public, continue reading. We all know WordPress is a versatile content management system (CMS) known for its flexibility and customization options. While WP offers a wealth of features and functionalities, it doesn’t natively display view counts for your posts or pages. However, you can easily implement this feature without the need for plugins by adding custom code to your theme’s functions.php file. In this comprehensive guide, we will walk you through the process of displaying view counts on both WordPress posts and pages separately.

Why Display View Counts?

Before diving into the technical details, it’s essential to understand why displaying view counts can be beneficial for your WordPress website:

1. Social Proof: High view counts can serve as social proof, indicating the popularity of your content and encouraging more engagement.
2. Content Evaluation: View counts provide insights into which posts and pages resonate most with your audience, helping you refine your content strategy.
3. User Engagement: By showcasing view counts, you can enhance user engagement and promote content that generates the most interest.

Now, let’s explore how to implement view counts for both WordPress posts and pages.

Implementing View Counting for WordPress Posts and Pages:

Editing functions.php of your child theme

1. If you haven’t already created a child theme for your WordPress site, it’s crucial to do so.
2. In your child theme’s directory, locate the functions.php file (create it if it doesn’t exist).
3. Add the following code snippets to your functions.php file to implement post view counts:
4. Save the functions.php file.

Code snippets for view counting in WordPress

Now that you have a child theme set up, you can add the necessary code to display view counts for posts.

// Function to get page views
function get_page_views($page_id) {
    $count_key = 'page_views_count';
    $count = get_post_meta($page_id, $count_key, true);
    if ($count == '') {
        return '0';
    }
    return $count;
}

// Shortcode to display page views
function page_views_shortcode($atts) {
    $page_id = get_the_ID();
    $views = get_page_views($page_id);
    return '<p class="page-views">Views: ' . $views . '</p>'; 
} 
add_shortcode('page_views', 'page_views_shortcode'); 

function update_product_view_count() { 
if (is_single() || is_page()) { 
global $post; 

$view_count = get_post_meta($post->ID, 'page_views_count', true); 

$view_count = $view_count ? intval($view_count) : 0; 

// Add a random increase of 0 to 2 views $view_count += 1; 
// Update the actual meta value 

update_post_meta($post->ID, 'page_views_count', $view_count); 
} 
} 
add_action('template_redirect', 'update_product_view_count');

This code defines three functions:

• get_page_views: Retrieves the post/page views count.
• page_views_shortcode: Basically creates the shortcode we are going to use inside our pages for the frond end.
• update_product_view_count: Updates post/page views each time the template of the page/post is loaded.

Displaying View Counts on the front end

Add your shortcode to your preferred Post or Page

In the code above, we’ve created a shortcode called [page_views]. When you use this shortcode within your page content, it will display the page’s view count. This means that you when editing a page or post in WordPress, you can insert the [page_views] shortcode anywhere within the content. This is done in the visual editor or the text editor of the WordPress post/page editor. Wherever you place the shortcode, it will be replaced with the view count for that specific page when the page is viewed on the front end of your website. Here’s how to use it in a WordPress page:

1. Edit the page where you want to display the view count.
2. In the page editor, place [page_views] wherever you want the view count to appear within your content.
3. Update or publish the page.

When you view the published page, the [page_views] shortcode will be replaced with the actual view count for that page.

Using shortcodes provides greater flexibility and control over where you display the view count within your page content, making it a convenient option for customizing the presentation of view counts on your WordPress site.

Style the Post View Count (Optional)

You can style the post view count by adding CSS to your child theme’s style.css file. For example:

/* Style the post views count */
.post-views {
    font-size: 14px;
    color: #888;
}

Verify and Test

With the code in place, the post view count will automatically be displayed on single post pages. To test the functionality, navigate to a single post page and verify that the view count is visible and incrementing as expected.

Beware of cache

Cache Challenges for View Counts

When implementing custom functionality like view counts on your WordPress site, cache plugins can sometimes interfere with accurate tracking and display. Cache plugins store entire pages, including the view count display, as static HTML files. This means that view counts might not update dynamically unless you manually intervene. When visitors load cached pages, the view counts displayed on those pages remain static until the cache is cleared or refreshed. This can lead to inaccurate counts, especially for frequently visited pages.

Clearing Cache and Hard Refresh

To ensure view counting works, you may need to clear cache or perform a hard refresh. If you’re using a cache plugin like Super Cache, W3 Total Cache, LSCache or WP Super Cache, ensure that you purge all caches. To do a hard refresh on Windows press Ctrl + F5 in most web browsers and on macOS press Cmd + Shift + R or Cmd + Shift + F5. Hard refreshing reloads the page without using cached data, ensuring that any updated view counts are displayed.

Manually Updating Page View Counts

To manually update page view counts for posts or pages in WordPress, you can use custom fields. Here’s how you can do it:

1. Edit the Post/Page: Go to the post or page you want to update.
2. Custom Field: In the WordPress editor, locate the “Custom Fields” section. If you don’t see it, you can enable it by clicking “Screen Options” at the top of the editor and checking the “Custom Fields” option.
3. Add a Custom Field: In the “Custom Fields” section, add a new custom field. Name it page_views_count like we named it in previous steps. Then, assign the desired view count number.
4. Save or Update: Save or update the post or page. The custom field value you’ve set will be displayed as the view count for that specific post or page.

Keep in mind that manually updating view counts can be time-consuming for multiple posts or pages. It’s best suited for cases where precise control over view counts is necessary.

Display post views to your visitors in WordPress!

With these steps, you can easily display view counts for both WordPress posts and pages without the need for plugins. This customization can enhance your website’s user engagement and provide valuable insights into your content’s popularity.