Fornecer um tempo estimado de leitura para os seus artigos no WordPress pode melhorar a experiência do usuário e aumentar o engajamento do público. No Elementor Pro, você pode exibir essa informação sem precisar instalar plugins adicionais.
Neste artigo, vou te mostrar como fazer isso de maneira simples utilizando uma função PHP personalizada e o recurso de tags dinâmicas do Elementor.
Função de tempo de leitura
A função personalizada estimate_reading_time()
calcula o tempo estimado de leitura de uma postagem do WordPress. Ou seja, essa função conta o número de palavras no conteúdo e divide por uma taxa média de leitura (em palavras por minuto).
Posteriormente, criamos uma tag dinâmica personalizada no Elementor para exibir esse tempo estimado automaticamente.
Código PHP para criar a função de tempo de leitura
Adicione o seguinte código ao arquivo functions.php do tema no seu site para ativar a funcionalidade:
- include_once( ABSPATH . 'wp-admin/includes/plugin.php' );
- if ( is_plugin_active( 'elementor-pro/elementor-pro.php' ) ) {
- add_action('elementor/dynamic_tags/register_tags', function( $dynamic_tags ) {
- include_once 'path_to_your_reading_time_tag_class.php';
- $dynamic_tags->register_tag( 'Reading_Time_Tag' );
- });
- class Reading_Time_Tag extends \Elementor\Core\DynamicTags\Tag {
- public function get_name() {
- return 'reading-time';
- }
- public function get_title() {
- return __('Reading Time', 'text-domain');
- }
- public function get_group() {
- return 'post';
- }
- public function get_categories() {
- return [ \Elementor\Modules\DynamicTags\Module::TEXT_CATEGORY ];
- }
- protected function register_controls() {
- }
- public function render() {
- $post_id = get_the_ID();
- $content = get_post_field('post_content', $post_id);
- echo estimate_reading_time($content);
- }
- }
- }
- function estimate_reading_time($content) {
- $word_count = str_word_count(strip_tags($content));
- $words_per_minute = 200; // Average reading speed (words per minute)
- $reading_time = ceil($word_count / $words_per_minute);
- return $reading_time . ' minute' . ($reading_time === 1 ? '' : 's') . ' read';
- }
Como adicionar o código com o plugin Code Snippets
Por outro lado, o plugin Code Snippets permite que você adicione código PHP ao seu WordPress sem modificar diretamente os arquivos do tema. Por isso, recomendo usá-lo para garantir uma implementação segura e compatível com futuras atualizações.
Passos para Adicionar a Função ao Code Snippets
- Instale e Ative o Code Snippets
- No painel do WordPress, vá até
Plugins > Adicionar Novo
. - Busque por Code Snippets, instale e ative o plugin.
- No painel do WordPress, vá até
- Crie um Novo Snippet
- Vá para
Snippets > Adicionar Novo
. - Dê um nome ao snippet (por exemplo, Tempo de Leitura Elementor).
- Vá para
- Adicione o Código
- Copie e cole o código PHP acima na área de edição do snippet.
- Certifique-se de que o snippet está configurado para ser executado em todos os lugares.
- Ative o Snippet
- Clique em
Salvar alterações e ativar
.
- Clique em
Agora, o código estará ativo no seu site.
Como usar a Tag Dinâmica no Elementor
Após ativar o snippet, você pode exibir o tempo de leitura diretamente no Elementor usando as tags dinâmicas:
- Edite uma postagem ou página com o Elementor.
- Selecione o widget de Texto onde deseja exibir o tempo de leitura.
- Clique no ícone
Dinâmico
dentro do campo de texto. - Escolha a tag personalizada chamada Tempo de Leitura.
- Agora, o Elementor mostrará automaticamente o tempo estimado de leitura da postagem.
Conclusão
Em resumo, ao integrar essa função personalizada com o Code Snippets, você pode adicionar um tempo estimado de leitura às suas postagens no Elementor sem precisar de plugins extras. Certamente, isso melhora a experiência do usuário e mantém seu site mais leve e otimizado.
Mas lembre-se sempre de testar os snippets em um ambiente de desenvolvimento antes de aplicá-los no site ativo para evitar problemas inesperados. Certamente, seus leitores terão uma ideia clara de quanto tempo levará para consumir seu conteúdo!