Como exibir postagens populares por visualizações no WordPress (2 maneiras)

Se você já rolou a página até o final de um de nossos artigos, provavelmente notou nosso widget “Popular no WPBeginner agora mesmo!”. Esse recurso tem sido um sucesso entre nossos leitores, ajudando-os a descobrir nosso conteúdo mais valioso e incentivando-os a explorar mais nosso site.

Ao destacar os posts mais populares do seu blog WordPress, você não está apenas ajudando os leitores a encontrar seu melhor conteúdo, mas também está aumentando as métricas de engajamento do seu site. É uma situação em que todos saem ganhando: os visitantes recebem um ótimo conteúdo e você os mantém no site por mais tempo.

Neste artigo, mostraremos como exibir facilmente suas postagens mais populares com base em suas visualizações no WordPress.

Por que exibir postagens populares por visualizações no WordPress?

Quando os usuários veem as publicações mais populares do seu blog WordPress, eles podem descobrir qual conteúdo os outros leitores mais gostam. Dessa forma, eles podem conferir esses artigos e participar da conversa.

Além disso, a exibição de seu conteúdo mais popular no WordPress pode aumentar sua prova social. É como dizer aos novos usuários: “Ei, outras pessoas acharam essas postagens muito úteis, e você também pode achar!”

Por fim, mostrar as postagens de tendências do seu blog pode fazer com que as pessoas permaneçam mais tempo em seu site, aumentando as visualizações de página e reduzindo a taxa de rejeição.

Quanto mais o envolvimento do usuário aumenta, mais o Google acredita que seu conteúdo é bom e importante. Por sua vez, o SEO do WordPress melhora e seu site pode ter uma classificação mais alta.

Infelizmente, o WordPress não tem um recurso ou bloco incorporado para exibir suas postagens mais populares por exibições de página. Neste guia, mostraremos como fazer exatamente isso com um plugin e com código.

Basta clicar em um dos links rápidos abaixo para ir direto ao seu método preferido:

Método 1: Exibir postagens populares do WordPress por visualizações com o MonsterInsights (recomendado)

A maneira mais fácil de exibir posts populares por visualizações no WordPress é com um plug-in. Na verdade, há muitos plug-ins de publicações populares disponíveis no WordPress, mas, em nossa opinião, a melhor opção é o MonsterInsights.

Usado por mais de 3 milhões de sites em todo o mundo, o MonsterInsights é o melhor plug-in do Google Analytics para WordPress. Embora sua principal funcionalidade seja a análise, ele também tem um recurso fácil de usar para mostrar suas postagens mais populares.

Em primeiro lugar, você precisará instalar o plug-in MonsterInsights e conectá-lo à sua conta do Google Analytics. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar o Google Analytics no WordPress para iniciantes.

Escolha um tema para owidget de postagens populares

Depois de ativar e configurar o plug-in, vá para Insights ” Popular Posts no painel do WordPress. Em seguida, clique no item de menu “Popular Posts Widget”.

Rolando para baixo, você precisará selecionar um tema para exibir o widget de postagens populares. Há várias opções.

Alguns incluem uma imagem em destaque para a postagem, enquanto outros têm uma aparência mais minimalista.

Se quiser ver a aparência do tema antes de fazer sua escolha, basta descer na página até a seção Theme Preview (Visualização do tema).

Você também pode visualizar o tema em um formato Wide (amplo) ou Narrow (estreito). Com o formato Wide (amplo), você verá suas publicações listadas sob o conteúdo da página ou da publicação, enquanto o formato Narrow (estreito) exibe as publicações no lado direito, como uma barra lateral.

Em seguida, role a tela para baixo até a seção “Customize Design”. Aqui, você pode modificar as cores do tema, o tamanho da fonte, o layout e a contagem de postagens a serem exibidas.

As opções de personalização aqui podem variar dependendo do tema que você usar. Portanto, não deixe de explorar os diferentes temas para ver qual é o mais adequado para você.

Configurar o comportamento do widget Popular Posts

Depois de configurar o design do tema, você deve ir para a seção Behavior (Comportamento). É aqui que você controlará como o widget de postagens populares aparecerá em seu site do WordPress.

Nas configurações de Estilo do widget, você pode optar por usar o design que criou acima ou optar por não estilizar o widget. Com a segunda opção, o widget seguirá o CSS do tema de seu site WordPress.

Em seguida, você pode escolher como o widget deve escolher suas postagens mais populares. Para este tutorial, escolha “Curated”, mas você também pode exibir as postagens mais populares com base no número de comentários.

O que você precisa fazer em seguida é ativar a opção “Adicionar os 5 principais posts do Google Analytics” abaixo. Mas antes de fazer isso, você precisará do MonsterInsights Dimensions Add-On e adicionar o tipo de post como uma nova dimensão personalizada.

Isso permitirá que o MonsterInsights escolha as postagens mais populares com base nos dados do Google Analytics.

Para fazer isso, você precisa fazer o download do MonsterInsights Dimensions Add-on e instalá-lo como um plug-in no WordPress. Para obter instruções passo a passo, consulte nosso guia sobre como instalar um plug-in do WordPress.

Em seguida, vá para Insights “ Configurações e mude para a guia “Conversões”. Depois disso, clique em “Add New Custom Dimension” (Adicionar nova dimensão personalizada).

Depois de fazer isso, selecione “Post type” (Tipo de postagem) no menu suspenso.

Isso permitirá que o MonsterInsights rastreie o desempenho de suas postagens de blog e outros tipos de postagens personalizadas.

Agora, basta retornar a Insights ” Popular Posts e ir para ‘Popular Posts Widget’.

Basta ativar o botão de alternância “Add Top 5 Posts from Google Analytics”. Em seguida, clique em “Test Automated Posts” para ver se a configuração foi bem-sucedida.

Se sim, você verá uma mensagem pop-up de sucesso.

Ele deve dizer: “Os dados do Popular Posts podem ser obtidos corretamente. Observação: dependendo de quando você definiu as configurações de dimensões personalizadas, pode levar até sete dias para que os dados relevantes de Popular Posts sejam carregados pelo Google Analytics”.

Passando para as próximas etapas, agora você pode adicionar um título que aparecerá acima do widget. Ele pode ser algo como “Confira nossas publicações mais populares” ou algo semelhante.

Abaixo disso, você pode escolher se o widget deve ser exibido em todos os tipos de post, ser excluído de posts específicos e/ou aparecer somente em determinadas categorias de post.

Essas configurações são úteis se você tiver criado tipos de post personalizados que não sejam posts de blog e achar que o widget de posts populares parecerá irrelevante.

Uma das últimas etapas é incorporar o widget de postagens populares. Há várias opções: colocá-lo automaticamente, usando um bloco do Gutenberg, adicionando-o como um widget da barra lateral ou usando um shortcode.

Vamos examinar cada opção uma a uma.

Incorporar o widget de postagens populares automaticamente

O posicionamento automático é recomendado se você quiser que o widget seja exibido em todas as postagens que correspondam às configurações de comportamento que você definiu anteriormente.

Para isso, basta ativar o botão Automatic Placement (Colocação automática).

A desvantagem dessa opção é que você não pode ajustar o design do widget com base no que fica melhor no post ou na página. Se precisar desse tipo de funcionalidade, você pode tentar o próximo método.

Incorporar o bloco Popular Posts em uma página ou postagem

Se quiser ter mais controle sobre a aparência do widget em uma página ou publicação, esse método é para você.

Primeiro, acesse o editor de blocos do post ou da página onde você deseja que o widget fique. Depois disso, clique no botão “+” adicionar bloco em qualquer lugar do editor e procure o bloco Popular Posts.

No painel de configurações do Block, você verá que há opções para alterar o tema, o tamanho da fonte, as cores, o título, o layout e a contagem de posts do widget.

Essas configurações são semelhantes às que vimos no plug-in MonsterInsights.

A única diferença é que você não pode alterar quais publicações são escolhidas no widget.

Dito isso, nas Behavior Settings (Configurações de comportamento), é possível mostrar somente publicações de determinadas categorias. Dessa forma, você pode tornar as opções de postagens populares mais adaptadas às suas necessidades.

Quando você estiver satisfeito com as configurações do bloco, basta clicar no botão “Update” (Atualizar) no editor de posts e páginas.

Veja a seguir a aparência do bloco Popular Posts em nosso site de teste:

Incorporar o widget Popular Posts em uma barra lateral

Se estiver usando um tema do WordPress que não seja de bloco e que tenha uma área da barra lateral pronta para widget, você poderá adicionar o widget Popular Posts a ela. Foi isso que fizemos em nosso artigo sobre como adicionar postagens em destaque na barra lateral do WordPress.

Tudo o que você precisa fazer é ir para Appearance ” Widgets. Em seguida, clique no botão “+” adicionar widget na área da barra lateral e procure o widget Popular Posts – MonsterInsights.

Como no método anterior, o widget inclui configurações semelhantes para personalizar a aparência do seu tema.

A diferença é que a interface é um pouco mais complicada de usar. À medida que você altera as configurações, não é possível ver a aparência real do widget. Você terá que clicar em um widget diferente ou em outra área para visualizá-lo.

Se você estiver satisfeito com a aparência do widget, basta clicar em “Update” (Atualizar) no canto superior direito.

Não deixe de acessar seu site para verificar se a barra lateral está correta.

Veja como é o nosso:

Se você quiser fazer com que o widget Popular Posts apareça somente em páginas específicas, leia nosso guia sobre como mostrar ou ocultar widgets em determinadas páginas do WordPress.

Incorporar o widget Popular Posts com um código curto

A última opção é usar um shortcode. Esse método é recomendado se as opções acima não funcionarem para seu caso de uso específico.

Na guia Popular Posts Widget, role até a seção “Embed Options” (Opções de incorporação). Em seguida, escolha “Display using a Shortcode” (Exibir usando um código curto) e clique no botão “Copy Shortcode” (Copiar código curto).

Depois disso, basta colocar o shortcode onde você quiser. Para obter mais informações, consulte nosso guia sobre como adicionar códigos de acesso no WordPress.

Método 2: Exibir postagens populares do WordPress por visualizações com código (mais avançado)

O método MonsterInsights é a maneira mais fácil de exibir seu conteúdo mais popular e melhor por visualizações no WordPress. Mas se você se sentir confortável com a codificação, também poderá usar o código para mostrar suas postagens mais populares no WordPress.

Para esse método, recomendamos o uso de um plug-in de snippets de código, como o WPCode, que é o que usaremos neste guia.

O WPCode torna segura a inserção de código personalizado sem interagir diretamente com seus arquivos do WordPress. Além disso, como esse método requer o uso de vários snippets de código, o plug-in facilitará muito o gerenciamento e o rastreamento de todos eles.

Primeiro, você precisa instalar o WPCode no WordPress. Há uma versão gratuita do WPCode disponível, mas usaremos a versão Pro, pois ela vem com os recursos necessários para inserir o código nos locais corretos.

Para obter um guia de instalação passo a passo, leia nosso artigo sobre como instalar um plug-in do WordPress.

Adicionar a função de contador de visualizações de postagens do WordPress

Após a ativação do plug-in, você precisa ir para Code Snippets ” + Add Snippet no painel. Em seguida, passe o mouse sobre “Add Your Custom Code (New Snippet)” e clique em “+ Add Custom Snippet”.

Agora, você está no editor de snippet de código do WPCode. Antes de inserir qualquer código, vá em frente e adicione um título para o snippet.

Para esse primeiro código, você pode nomeá-lo como “WordPress Post Views Counter Function”. Isso ocorre porque o objetivo desse primeiro código é criar uma função para contar as visualizações de posts no WordPress.

Em seguida, altere o Tipo de código para “PHP Snippet”. Observe que todos os trechos de código que você terá de adicionar a partir deste artigo estão em PHP.

Depois disso, você pode copiar e colar o seguinte código abaixo:

function wpb_set_post_views($postID) {
    $count_key = 'wpb_post_views_count';
    $count = get_post_meta($postID, $count_key, true);
    if($count==''){
        $count = 0;
        delete_post_meta($postID, $count_key);
        add_post_meta($postID, $count_key, '0');
    }else{
        $count++;
        update_post_meta($postID, $count_key, $count);
    }
}
//Get rid of prefetching to keep the count accurate
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

Agora, role para baixo até a seção “Insertion” (Inserção) e selecione “Auto Insert” (Inserção automática) para o método de inserção e “Run Everywhere” (Executar em todos os lugares) para o local. Isso funciona da mesma forma que inserir o código no arquivo functions.php do seu tema.

Depois disso, navegue até o lado superior direito da página e torne o código ativo.

Em seguida, clique em “Save Snippet”.

Nessa etapa, você precisa adicionar outro novo snippet de código personalizado. Você pode chamá-lo de “Track Post Views Function Call”.

Esse código chamará a função acima e a ativará em suas páginas de postagem única.

Depois de fazer isso, copie e cole o seguinte snippet:

wpb_set_post_views(get_the_ID());

O que é diferente nesse snippet de código é que você escolherá o local “Insert After Post” (Inserir após a postagem) porque ele deve ser executado nas páginas de postagem única.

Quando terminar, basta tornar o código ativo e salvá-lo.

Inserir o gancho de rastreamento de visualizações de posts do WordPress

Agora, você precisa adicionar um novo trecho de código que verifica se a página atual é uma única postagem. Em caso afirmativo, ele chamará a função de contador de visualizações de posts do WordPress para rastrear e atualizar a contagem de visualizações do post.

Dessa forma, toda vez que um usuário visitar a postagem, sua contagem de visualizações será atualizada.

Vamos chamar esse snippet de ‘WordPress Post Views Tracking Hook’. Em seguida, insira as seguintes linhas de código:

function wpb_track_post_views ($post_id) {
    if ( !is_single() ) return;
    if ( empty ( $post_id) ) {
        global $post;
        $post_id = $post->ID;    
    }
    wpb_set_post_views($post_id);
}
add_action( 'wp_head', 'wpb_track_post_views');

Você pode escolher o método de inserção como “Auto Insert” e o local como “Frontend Only”.

Da mesma forma que nas etapas anteriores, basta ativar o código e salvar o snippet.

Adicionar funções para recuperar a contagem de visualizações de posts e exibir os posts mais populares com contagens de visualizações

Estamos agora nas etapas finais deste guia. Você precisa adicionar um trecho de código que recupere e formate o número de visualizações de uma determinada postagem do WordPress. Isso será útil mais tarde ao exibir a lista das postagens mais visualizadas.

Você pode nomear esse código como “Retrieve Post Views Count Function” e definir o local como “Run Everywhere”.

Aqui está o trecho de código:

function wpb_get_post_views($postID){
    $count_key = 'wpb_post_views_count';
    $count = get_post_meta($postID, $count_key, true);
    if($count==''){
        delete_post_meta($postID, $count_key);
        add_post_meta($postID, $count_key, '0');
        return "0 View";
    }
    return $count.' Views';
}

Novamente, certifique-se de tornar o código ativo no WPCode e salvá-lo depois.

Depois de fazer isso, crie um novo snippet de código novamente e nomeie-o como “Display Most Popular Posts with View Counts”. Esse é o código que mostrará suas postagens mais populares na parte inferior das postagens do blog.

Na caixa Code Preview, insira o seguinte trecho de código:

// Customize the query parameters as needed
$popularpost = new WP_Query( array(
    'posts_per_page' => 3,         // Feel free to adjust the number of posts to display
    'meta_key' => 'wpb_post_views_count',
    'orderby' => 'meta_value_num',
    'order' => 'DESC'
));
?>

<div class="popular-posts">
    <h2>See Our Most Popular Posts</h2> <!-- Feel free to customize the title -->
    <ul>

    <?php while ( $popularpost->have_posts() ) : $popularpost->the_post(); ?>
        <li>
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            - <?php echo wpb_get_post_views(get_the_ID()); ?>
        </li>
    <?php endwhile; ?>

    </ul>
</div>

<?php wp_reset_postdata(); 

Conforme observado no código, fique à vontade para ajustar o número de publicações a serem exibidas e personalizar o título dessa seção.

Na seção WPCode Insertion (Inserção de código WPC), certifique-se de selecionar “Insert After Post” (Inserir após a postagem) para o local. Em seguida, basta tornar o código ativo e salvar o snippet.

Tudo o que resta a fazer agora é visitar uma das postagens do seu blog e ver se o código funciona. Veja como são as publicações mais populares por seção de visualizações em nosso blog de teste do WordPress:

Tutorial em vídeo

Se você preferir instruções visuais, assista à versão em vídeo deste tutorial abaixo:

Esperamos que este tutorial do WordPress tenha ajudado você a aprender como exibir posts populares por visualizações. Talvez você também queira conferir nossa seleção especializada dos melhores plug-ins de posts relacionados para WordPress e nosso artigo sobre o que torna uma página de destino de alta conversão.

Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.