Ir para o conteúdo
ou

Software livre Brasil

 Voltar a Blog de Thia...
Tela cheia

Criando um tema para WordPress – parte 2

24 de Fevereiro de 2013, 0:00 , por Software Livre Brasil - 22 comentários | Ninguém está seguindo este artigo ainda.
Visualizado 400 vezes
<p>Dando sequencia ao post anterior <a href="http://www.botecodigital.info/wordpress-2/criando-um-tem…dpress-parte-1/ ">Criando um tema para WordPress &#8211; parte 1</a> vamos agora criar o arquivo <strong>single.php</strong> para exibir o post inteiro.</p> <pre class="brush: php; title: ; notranslate"> &lt;?php get_header(); ?&gt; &lt;div id="conteudo" class="post"&gt; &lt;?php if( have_posts() ): ?&gt; &lt;?php the_post();?&gt; &lt;h2&gt;&lt;?php echo the_title(); ?&gt;&lt;/h2&gt; &lt;p style="text-align:right"&gt;&lt;?php the_time('d/m/Y'); ?&gt; - &lt;?php the_author() ?&gt; &lt;/p&gt; &lt;?php the_content();?&gt; &lt;div class="categorias"&gt;Categorias: &lt;?php the_category(' , ');?&gt;&lt;/div&gt; &lt;div class="tags"&gt;Tags: &lt;?php the_tags('' , ' , ');?&gt;&lt;/div&gt; &lt;?php comments_template(); ?&gt; &lt;?php else: ?&gt; &lt;p&gt;Post não encontrado&lt;/p&gt; &lt;?php endif; ?&gt; &lt;/div&gt; &lt;?php get_sidebar();?&gt; &lt;?php get_footer(); ?&gt; </pre> <p>Vimos as funções <em> get_header()</em>, <em>get_sidebar()</em> e <em>get_footer()</em>, que inserem as partes do layout que irão se repetir em outras partes do site.</p> <p>Na linha 4 utilizamos um <em>if</em> em vez de um <em>while</em>, como estamos visualizamos um post único, a lista de post que o <strong>WordPress</strong> gera só terá um único post, então só precisamos saber se existe algum post.</p> <p>Dentro do <em>if</em> chamamos a função <a href="http://www.botecodigital.info/#">the_post()</a> para carregar os dados do post que serão mostradas através das funções <em>the_title()</em>, <em>the_time()</em>, <em>the_author()</em>, <em>the_content()</em>, que vimos no post anterior.</p> <p>Na linha 11 temos uma função nova a <a href="http://codex.wordpress.org/Function_Reference/the_category">the_category(&#8216; , &#8216;)</a> que retorna os links da categorias as quais o post pertence. O parâmetro que passamos para esta função será utilizado para separa os links das categorias caso haja mais de uma.</p> <p>Na linha 12 temos outra função nova <a href="http://codex.wordpress.org/Function_Reference/the_tags" target="_blank">the_tags(&#8221; , &#8216; , &#8216;)</a> que retorna os links das tags que marcam o post.</p> <p>Na linha 14 chamamos a função <a href="http://codex.wordpress.org/Function_Reference/comments_template">comments_template()</a> que carrega o arquivo de template dos comentários com o nome de <em>comments.php</em>, se não tivermos no nosso tema um o <strong>WordPress</strong> nos fornece um padrão que irá conter a lista de comentários do post e um formulário para fazer um novo comentário.</p> <p>Vamos criar nosso próprio <strong>comments.php</strong> para ver como é!</p> <pre class="brush: php; title: ; notranslate"> &lt;div id="comentarios"&gt; &lt;?php if ( have_comments() ) : ?&gt; &lt;h5&gt;Atualmente existe &lt;?php comments_number('Nenhum Comentário', '1 Comentário', '% comentários' );?&gt;&lt;/h5&gt; &lt;ol id="comments"&gt; &lt;?php $comments = get_comments(array( 'post_id'=&gt;get_the_ID() , 'status'=&gt;'approve' ) ); ?&gt; &lt;?php foreach ($comments as $comment) : ?&gt; &lt;li class="comment-&lt;?php the_ID(); ?&gt;"&gt; &lt;div class="comment-author"&gt; &lt;?php echo get_avatar( get_comment_author_email(), '50' ) ?&gt; &lt;?php comment_author_link() ?&gt; &lt;span class="comment-date"&gt;&lt;?php comment_date() ?&gt;&lt;/span&gt;: &lt;/div&gt; &lt;div class="comment-text"&gt; &lt;?php comment_text(); ?&gt; &lt;/div&gt; &lt;/li&gt; &lt;?php endforeach; ?&gt; &lt;/ol&gt; &lt;?php endif; ?&gt; &lt;form action="&lt;?php echo get_option('siteurl'); ?&gt;/wp-comments-post.php" method="post" id="commentform"&gt; &lt;input name="author" id="author" value="&lt;?php echo $comment_author; ?&gt;" size="22" tabindex="1" /&gt; &lt;label for="author"&gt;&lt;small&gt;Nome (requerido)&lt;/small&gt;&lt;/label&gt;&lt;br/&gt;&lt;br/&gt; &lt;input name="email" id="email" value="&lt;?php echo $comment_author_email; ?&gt;" size="22" tabindex="2" /&gt; &lt;label for="email"&gt;&lt;small&gt;E-mail (não sera publicado) (requerido)&lt;/small&gt;&lt;/label&gt;&lt;br/&gt;&lt;br/&gt; &lt;input name="url" id="url" value="&lt;?php echo $comment_author_url; ?&gt;" size="22" tabindex="3" /&gt; &lt;label for="url"&gt;&lt;small&gt;Website&lt;/small&gt;&lt;/label&gt; &lt;br /&gt;&lt;br /&gt; &lt;p&gt;&lt;textarea name="comment" id="comment" cols="50" rows="10" tabindex="4"&gt;&lt;/textarea&gt;&lt;br /&gt;&lt;/p&gt; &lt;div style="text-align:center"&gt; &lt;input name="submit" type="submit" id="submit" tabindex="5" value="Enviar comentário" /&gt; &lt;?php comment_id_fields(); ?&gt; &lt;?php do_action('comment_form', $post-&gt;ID); ?&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt; </pre> <p>Na linha 2 testamos que se existe algum comentário nesse post. Na linha 4 chamamos a função <a href="https://codex.wordpress.org/Function_Reference/comments_number" target="_blank">comments_number()</a> que mostra o total de comentários que o post tem, o primeiro parâmetro será mostrado se não houver comentários, o segundo se tiver um e o terceiro se tiver mais, sendo o &#8220;%&#8221; substituído pelo número de comentários.</p> <p>Na linha 7 chamamos a função <a href="http://codex.wordpress.org/Function_Reference/get_comments" target="_blank">get_comments()</a> para obter os comentários, como parâmetro passamos um array com os critérios dos comentários que queremos listar, o primeiro é <em>post_id</em> para pegarmos somente os comentários deste post e para pegar o <em>id</em> deste post obtemos chamando a função <em>get_the_ID()</em> e o segundo é que o <em>status</em> seja <em>approve</em> para somente listar comentários aprovados pela moderação. Esta função irá retornar um array de objetos de comentários.</p> <p>Na linha 8 utilizamos um <em>foreach</em> para percorrer o array de comentários <em>$comments</em> e para cada comentário será colocado na variável <em>$comment</em>, se alterar o nome desta variável as funções para mostrar os dados do comentário não irão funcionar, e será necessário chamar pelo nome do atributo, no estilo <em>$comment-&gt;comment_ID</em>.</p> <p>Na linha 12 chamamos a função <em>get_avatar( )</em> para pegar a imagem de avatar do comentador, cadastrada no <a href="https://br.gravatar.com/" target="_blank">Gravatar</a> e recebe como primeiro parâmetro o e-mail do comentador, que obtemos chamando a função <em>get_comment_author_email()</em> e como segundo parâmetro o tamanho da imagem inserida.</p> <p>Na linha 13 chamamos a função <a href="http://codex.wordpress.org/Function_Reference/comment_author_link" target="_blank">comment_author_link()</a> que vai exibir o nome do comentador marcado como link se ele forneceu seu website. Na linha 14 <a href="http://codex.wordpress.org/Function_Reference/comment_date" target="_blank">comment_date()</a> que mostra a data que o comentário foi enviado. Na linha 18 chamamos a função <a href="http://codex.wordpress.org/Function_Reference/comment_text" target="_blank">comment_text()</a> que mostra a mensagem do comentário.</p> <p>Na linha 27 começamos a criar o formulário para envio de um novo comentário, onde utilizamos a função <em>get_option(&#8216;siteurl&#8217;)</em> para pegar a url que está hospedado o blog, para formar a url do action que as informações do formulário devem ser envidas para o script <em>wp-comments-post.php</em> pelo método POST.</p> <p>Dentro do fomulário contém os <em>inputs</em> tendo os seguintes <em>names</em>: <em>author</em>, <em>email</em>, <em>url</em> e <em>comment</em>. </p> <p>Na linha 43 chamamos a função <a href="http://codex.wordpress.org/Function_Reference/comment_id_fields" target="_blank">comment_id_fields</a> que gera dois campos ocultos, necessário para identificar os comentários.</p> <p>Na linha 44 chamamos a função <em>do_action(&#8216;comment_form&#8217;, $post->ID)</em> para chamar ações criadas por plugin.</p> <p>A principio com isso já temos um tema mínimo, existem muitos outros recursos que o <strong>WordPress</strong> disponibiliza e o <a href="http://codex.wordpress.org/" target="_blank">melhor lugar é sempre a documentação</a>, espero que este post seja de ajuda para uma introdução.</p> <p>Se deseja baixar o tema criado no post segue o <a href="http://www.botecodigital.info/exemplos/wordpress/tema_wordpress_exemplo.zip">link</a>.</p> <div class="crp_related"><h4>Posts Relacionados:</h4><ul><li><a href="http://www.botecodigital.info/wordpress-2/criando-um-tema-para-wordpress-parte-1/" class="crp_title">Criando um tema para WordPress &#8211; parte 1</a></li><li><a href="http://www.botecodigital.info/php/criando-um-captcha-em-php/" class="crp_title">Criando um CAPTCHA em PHP</a></li><li><a href="http://www.botecodigital.info/linux/wordpress-no-android/" class="crp_title">WordPress no Android</a></li><li><a href="http://www.botecodigital.info/php/cakephp-%e2%80%93-validando-um-formlario-com-model-sem-controller/" class="crp_title">CakePHP – Validando um formlário com Model sem Controller</a></li><li><a href="http://www.botecodigital.info/jquery/validando-formularios-com-jquery-plugin-validation/" class="crp_title">Validando formulários com JQuery-Plugin-Validation</a></li></ul></div>
Fonte: http://www.botecodigital.info/wordpress-2/criando-um-tema-para-wordpress-parte-2/

0sem comentários ainda

Enviar um comentário

Os campos são obrigatórios.

Se você é um usuário registrado, pode se identificar e ser reconhecido automaticamente.