Como Alterar o Tamanho da Imagem do Gravatar no WordPress

Se você está procurando redimensionar as imagens do Gravatar em seu site WordPress, você veio ao lugar certo. Houve ocasiões em que tivemos que redimensionar tamanhos personalizados de Gravatar em sites WordPress em que estávamos trabalhando, mas o método difere dependendo do tema que você está usando.

Um Gravatar é uma imagem usada para representar um comentarista ou autor de postagem de blog. Os temas do WordPress exibem Gravatars em um tamanho definido, mas você pode preferir torná-los menores ou maiores para melhor se adequar ao design do seu site.

Neste artigo, mostraremos como alterar o tamanho das imagens do Gravatar no WordPress.

Por que Alterar o Tamanho da Imagem do Gravatar no WordPress?

Gravatar é a sigla para Globally Recognized Avatar (Avatar Globalmente Reconhecido). É um serviço web que permite criar um perfil e associar imagens de avatar ao seu endereço de e-mail.

A maioria dos temas do WordPress exibe um Gravatar ao lado do comentário do usuário. Alguns temas também exibem um Gravatar na caixa de biografia do autor.

Mesmo que um usuário não tenha uma conta Gravatar, seu site ainda exibirá um dos Gravatars padrão do WordPress.

Às vezes, você pode querer alterar o tamanho dos Gravatars do seu tema. Por exemplo, você pode querer torná-los maiores para que se destaquem, chamando a atenção do visitante para a seção de comentários do seu site.

Dito isso, vamos dar uma olhada em como você pode alterar o tamanho da sua imagem Gravatar personalizada no seu site WordPress. Simplesmente use os links rápidos abaixo para pular para o método que você deseja usar:

• Método 1: Alterar o Tamanho do Gravatar Usando o Editor de Site Completo (Somente Temas de Blocos)
• Método 2: Alterar o Tamanho do Gravatar Editando comments.php (Todos os Temas)
• Método 3: Alterar o Tamanho do Gravatar Editando style.css (Todos os Temas)
• Method 4: Change Gravatar Size for Author Bios With Code

Método 1: Alterar o Tamanho do Gravatar Usando o Editor de Site Completo (Somente Temas de Blocos)

Se você estiver usando um tema baseado em blocos, como o Twenty Twenty-Five, você pode alterar o tamanho padrão do Gravatar do WordPress usando o editor de site completo.

Este método não funciona com todos os temas, portanto, se você não estiver usando um tema habilitado para blocos, recomendamos usar o método 2 em vez disso.

No painel do WordPress, vá para Aparência » Editor.

Agora você chegará ao editor de site completo e verá várias configurações para editar várias partes do seu site WordPress.

Para alterar o tamanho padrão do avatar para os seus comentários do WordPress, clique no ícone da barra de pesquisa na parte superior do painel esquerdo.

Neste ponto, basta procurar pela parte do modelo de Comentários.

Clique nele assim que o encontrar.

Na próxima página, você verá algumas informações sobre a parte do modelo de Comentários.

Para editar a parte do modelo de Comentários, clique no botão de lápis. Você será então direcionado para a interface de edição.

Agora você pode clicar em qualquer um dos Gravatars na pré-visualização ao vivo.

No menu à direita, você pode selecionar a aba ‘Bloco’ se ela ainda não estiver selecionada.

Agora você pode tornar os Gravatars maiores ou menores arrastando o controle deslizante ‘Tamanho da Imagem’.

Conforme você move o controle deslizante, todos os Gravatars serão atualizados automaticamente, para que você possa experimentar diferentes tamanhos para ver o que fica melhor.

Além disso, sinta-se à vontade para habilitar a configuração ‘Link para o perfil do usuário’. Quando um usuário clicar no Gravatar, ele será direcionado para a página de perfil do comentarista em seu site.

Quando estiver satisfeito com o novo tamanho padrão da imagem do Gravatar, clique no botão ‘Salvar’.

Agora, se você visitar qualquer seção de comentários em seu site WordPress, você verá as alterações ao vivo.

Método 2: Alterar o Tamanho do Gravatar Editando comments.php (Todos os Temas)

Se você não estiver usando um tema WordPress de blocos, então você pode alterar o tamanho da imagem do perfil do Gravatar para comentários do WordPress editando o código do seu tema.

Este método exige que você edite os arquivos do tema, portanto, não é a opção mais amigável para iniciantes. No entanto, este método deve funcionar para a maioria dos temas do WordPress.

Primeiro, você precisará se conectar ao seu site WordPress usando um cliente FTP como o FileZilla, ou você pode usar o gerenciador de arquivos do seu hospedagem WordPress cPanel.

Se esta é a sua primeira vez usando FTP, então você pode ver nosso guia completo sobre como se conectar ao seu site usando FTP.

Uma vez conectado, você precisa ir para /wp-content/themes/ e abrir a pasta do seu tema WordPress atual.

Uma vez aqui, abra o arquivo comments.php e procure por uma função wp_list_comments. Dentro desta função, você encontrará avatar_size, que define o tamanho do Gravatar.

Aqui está um exemplo de como isso pode parecer:

<?php
wp_list_comments(
    array(
        'avatar_size' => 60,
        'style'       => 'ol',
        'short_ping'  => true,
    )
);
?>

Você pode simplesmente alterar avatar_size para o tamanho que deseja usar. No trecho de código acima, isso significaria mudar 60 para outro número.

Gravatars são quadrados, então o WordPress usará o mesmo valor para a largura e altura da imagem. Isso significa que você só precisa digitar um número.

Após fazer essa alteração, certifique-se de salvar e enviar o arquivo de volta para sua conta de hospedagem WordPress. Quando terminar, você pode visitar seu blog WordPress para ver a mudança em ação.

Se a imagem do Gravatar não mudou, isso pode ser devido ao cache. Para saber mais, consulte nosso guia sobre como corrigir o WordPress que não atualiza imediatamente.

Se o Gravatar ainda não mudar, o CSS do seu tema pode estar substituindo as configurações no arquivo comments.php. Nesse caso, você precisa tentar o próximo método.

Método 3: Alterar o Tamanho do Gravatar Editando style.css (Todos os Temas)

Para verificar se o CSS do seu tema está substituindo seu arquivo comment.php, você pode usar a ferramenta Inspecionar do seu navegador. Os passos variam dependendo do navegador que você está usando, mas no Chrome, você pode simplesmente clicar com o botão direito ou Ctrl+clicar no Gravatar e selecionar 'Inspecionar'.

Isso mostrará o código HTML e CSS da página em um novo painel.

Neste código, você precisa focar no painel inferior e procurar pela classe ou classes CSS do avatar do autor do comentário.

Em nosso exemplo, elas eram .comment-author e .avatar, e continham propriedades CSS para os valores de altura e largura do Gravatar. Sabemos disso porque, ao passar o mouse sobre os trechos de código CSS, o Gravatar é destacado na prévia.

Veja como o código se parece em nosso tema. Observe que pode parecer diferente no seu:

.comment-author .avatar {
height: 42px;
position: relative;
top: .25em;
width: 42px;
}

Se o tamanho do Gravatar no código CSS for diferente do que você especificou no arquivo comments.php, isso significa que o arquivo style.css do seu tema está substituindo suas alterações.

Para editar seu arquivo style.css, você precisa usar o WPCode, que é um plugin de trechos de código que facilita a inserção de código personalizado em seu tema. Com isso, você pode editar seu arquivo style.css sem acessá-lo diretamente, reduzindo a chance de cometer erros.

Além disso, você precisará manter a aba onde a ferramenta de inspeção está aberta. Isso é para que você possa copiar e colar o código CSS para o Gravatar do autor do seu comentário no WPCode e editá-lo mais tarde.

Primeiro, instale o WPCode em seu site WordPress. Você pode ler nosso guia sobre como instalar um plugin WordPress para mais informações.

Em seguida, vá para Trechos de Código » + Adicionar Trecho e selecione ‘Adicionar Seu Código Personalizado (Novo Trecho)’. Clique no botão ‘+ Adicionar Trecho Personalizado’.

Uma vez feito isso, digite um nome para seu novo código CSS. Pode ser algo tão simples quanto ‘Alterar Tamanho do Gravatar’.

Quanto ao Tipo de Código, selecione ‘Trecho CSS’.

Agora, copie e cole os trechos de código CSS originais do seu tema para o tamanho do Gravatar na caixa de Visualização de Código.

Quando terminar, você pode alterar os valores de altura e largura dentro do código. Em nosso exemplo, alteramos para 50px. Certifique-se de que os tamanhos de altura e largura sejam os mesmos.

Quando terminar, role para baixo até a seção Inserir.

Certifique-se de que o método ‘Inserir Automaticamente’ esteja selecionado. Quanto à Localização, basta escolher ‘Rodapé do Site Inteiro’ para que seu CSS personalizado possa substituir o código CSS existente.

Depois disso, basta clicar no alternador no canto superior direito para tornar o código ‘Ativo’ e clicar em ‘Salvar Snippet’. Se você visitar seu blog ou site WordPress, verá suas imagens Gravatar atualizadas.

Agora, recomendamos tentar alterar o tamanho do Gravatar no arquivo comments.php antes de usar o método CSS mais fácil.

Primeiro, o CSS às vezes pode fazer com que os Gravatars pareçam borrados, especialmente se você tornar os avatares muito maiores do que a imagem original.

Segundo, alterar o tamanho da imagem em comments.php geralmente ajuda seu site a carregar mais rápido. Isso ocorre porque o navegador ainda precisa baixar a imagem em tamanho real e, em seguida, usar CSS para redimensioná-la para exibição. Isso pode resultar em um desempenho mais lento do site.

Método 4: Alterar o Tamanho do Gravatar para Biografias de Autores com Código

Se você administra um site WordPress de vários autores, uma caixa de autor pode ajudar os leitores a aprender mais sobre o autor do post.

Se você deseja adicionar este recurso ao seu site, confira nosso guia sobre como adicionar uma caixa de informações do autor em posts do WordPress.

Muitas biografias de autores mostram o Gravatar do escritor junto com sua biografia. Para alterar o tamanho padrão do Gravatar em suas caixas de biografia de autor, você precisa encontrar o arquivo do tema que adiciona a biografia.

Simplesmente conecte-se ao seu site usando um cliente FTP como o FileZilla ou o gerenciador de arquivos da sua hospedagem WordPress. Uma vez conectado, vá para /wp-content/themes/ e abra a pasta do seu tema WordPress atual.

Depois disso, você precisa abrir a pasta template-parts.

Agora você precisa encontrar o arquivo que contém o código get_avatar.  Frequentemente, você encontrará este código em um arquivo de parte do modelo chamado author-bio.php, single.php, functions.php, ou similar.

Aqui está um exemplo de como este código pode parecer:

<div class="author-bio <?php echo get_option( 'show_avatars' ) ? 'show-avatars' : ''; ?>">
        <?php echo get_avatar( get_the_author_meta( 'ID' ), '85' ); ?>

No trecho acima, você pode simplesmente alterar o número 85 para o tamanho que deseja usar.

Em outros temas, o código pode parecer assim:

get_avatar( get_the_author_meta( 'user_email' ), 85);

Você pode simplesmente substituir o número pelo valor que deseja usar para tornar o Gravatar maior ou menor.

Após alterar o tamanho, não se esqueça de salvar suas alterações. Você pode então visitar seu site para ver a nova caixa de biografia do autor em ação.

Se os Gravatars não mudaram, você precisará procurar pela classe do avatar no arquivo style.css seguindo o mesmo processo descrito no Método 3. Uma vez que você encontrar esta classe, você pode criar um novo snippet WPCode e digitar os novos valores de altura e largura do Gravatar.

Saiba Mais Maneiras de Melhorar Sua Seção de Comentários

Quer levar seus comentários do WordPress para o próximo nível? Confira estes guias para personalizar sua seção de comentários:

• Como Limitar o Comprimento dos Comentários no WordPress (Tutorial Fácil)
• Como Alterar o Texto de “Responder” nos Comentários do WordPress
• Como Permitir que Seus Usuários Assinem Comentários no WordPress
• Como Paginar Comentários no WordPress (Passo a Passo)
• Como Permitir que Usuários Curtam ou Descurtam Comentários no WordPress
• Como Remover o Campo de URL do Site do Formulário de Comentários do WordPress

Esperamos que este tutorial tenha ajudado você a aprender como alterar o tamanho da imagem do Gravatar no WordPress. Você também pode querer aprender como estilizar o formulário de comentários do WordPress ou conferir nossa lista dos melhores plugins do WordPress para comentários.

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