Colocar uma caixa de informações do autor no final de cada artigo
1. Informações do autor em cada artigo
Como tenho visto por aí e obviamente aderi a caixa com informações sobre o autor no final de cada post, segue o artigo de como colocar uma estilizada no seu WordPress.
Escrevi um artigo de uma maneira simples e de fácil entendimento. Então vamos lá!
2. Como fazer a caixa de informações do autor
Acesse seu painel de administração do WordPress, clique em “usuários”, depois em “editar”, irá aparecer os nomes dos utilizadores do blog, edite da forma que achar melhor, tem um campo “sobre você” que você irá colocar informações biográficas, ou seja, informações do seu perfil.
Depois clique em “aparência” no seu menu do lado esquerdo, depois em “editor”, lá estará uma relação todas os arquivos e informações do seu blog.
Clique no ficheiro “single.php” e procure a linha que possue o seguinte código abaixo:
<?php the_content(); ?>
Após encontrar a linha do código acima, adicione logo abaixo o código seguinte:
<div class="postauthor">
<?php echo get_avatar( get_the_author_id() , 95 ); ?>
<h3>Autor: <a href="<?php the_author_url(); ?>">
<?php the_author_firstname(); ?>
<?php the_author_lastname(); ?></a></h3>
<?php the_author_description(); ?>
<p></p>
<a href="<?php bloginfo('url'); ?>/?author=<?php the_author_ID(); ?>">
<?php the_author_firstname(); ?> <?php the_author_lastname(); ?> escreveu
<?php the_author_posts(); ?> artigos para o Webtudo.net.</a>
</div>
Salve o arquivo e acrescente no arquivo “style.css”, onde você achar melhor, fica a seu critério, o código abaixo que será o que vai deixar sua caixa do autor estilizada:
.author_name {font-weight:bold;font-style:normal;font-size:14px;float:left;}
.author_name a {color:#ccc;}
.comment_text {clear:both;margin-top:10px;}
.comment-reply-link{text-align:center;display:block;}
.postauthor {height: 95px; padding: 14px;margin: 10px 0;border: 2px;}
.postauthor h3 { font-weight: bold;margin: 0 0 10px 0;}
.postauthor img {float: left;margin: 0 15px 8px 0;}
Salve o arquivo “style.css” e veja como ficou. O arquivo “style.css” você pode alterar da forma que preferir, cores, fontes, tamanho de fontes, espaçamento, largura, altura dentre outras.
Pronto, sua caixa do autor estilizada está pronta.
Espero ter ajudado!
Deixar comentário