Suporte » Ajustando o WordPress » Customização da página de postagem

  • Olá pessoal.

    Estou com um problema meio que bobo mas que não estou conseguindo resolver. Eu tenho uma página de postagens que mostra o título da postagem, e quero que quando a pessoa clicar no título abra uma div com a postagem em si – js tranquilo.

    O meu problema é que quando o título é clicado para aparecer a div com a postagem é mostrado todas as notícias. Acredito que o meu problema esteja no loop, mas não consegui resolver.

    A seguir, o meu código. PS: a div post-single é a que vai aparecer quando clicar no título.

    <!-- laço -->
    			<?php query_posts('posts_per_page=2&cat=36');?>
    			<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    
    				<figure class="effect-goliath">
    					<img src="<?php echo wp_get_attachment_url(get_post_thumbnail_id()); ?>" alt="<?php the_title(); ?>"/>
    					<figcaption>
    						<h2><?php the_title(); ?></h2>
    						<p><?php wp_limit_post(39,'...',true);?>...</p>
    						<!-- <a href="<?php the_permalink() ?>">Veja mais</a> -->
    					</figcaption>
    				</figure>
    
    				<div class="post-single">
    					<span class="close">Fechar</span>
    					<h2><?php the_title(); ?></h2>
    					<p><?php the_content(); ?></p>
    					<span class="close">Fechar</span>
    				</div>
    
    			<?php endwhile?>
    			<?php else: ?>
    				<h2>Nada Encontrado</h2>
    				<p>Erro 404</p>
    				<p>Lamentamos mas não foram encontrados artigos.</p>
    			<?php endif; ?>
    			<?php wp_reset_query(); ?>
    			<!-- fim laço -->
Visualizando 3 respostas - 1 até 3 (de um total de 3)
  • Moderador Leo Baiano

    (@leobaiano)

    No loop você definiu para mostrar 2 posts (posts_per_page=2), provavelmente estão aparecendo 2 divs .post-single e quando você clica no titulo seu js está abrindo as duas.

    Porque você não inclui o ID do post em uma tag tipo data-id, retira a div post-single de dentro do loop e deixa ele vazio, só com HTML, e inclui os dados (titulo, conteúdo) na hora do click no titulo? Faz isso com JS e ajax.

    Se tiver dúvidas sobre como trabalhar com AJAX no WordPress da uma olhada na documentação: http://codex.wordpress.org/AJAX_in_Plugins

    Obrigado pelo feedback Leo.

    Como eu guardaria o título do devido post para ser mostrado no momento do click? Como ele não pegaria o dos outros posts também?

    Moderador Leo Baiano

    (@leobaiano)

    Como eu disse, você vai incluir o ID do post na tag , por exemplo:

    <a href="javascript:;" title="<?php echo the_title(); ?>" data-id="<?php echo $post->ID; ?>" class="post"><?php the_title(); ?></a>

    Ai no javascript você precisaria fazer algo tipo assim:

    $(".post").on("click", function(){
    var post_id = $(this).attr("data-id"); // pega o ID do post que foi clicado
    $.get( admin_url, {
        action: 'exibir_post',
        id: post_id
    },
    function(data){
    // Aqui é onde você vai receber os dados do post, inserir na div post-single e exibir ela
    },"json"
    );
    });

    Lembrando que onde tem admin_url você deve colocar a URL do ajax do WP, veja isso no link que te passei. Outra coisa, no functions.php você precisa criar a função que vai receber o GET do javascript, consultar os dados do post através do ID enviado pelo js e retornar as informações do post em json.

    Mãos a obra agora!

Visualizando 3 respostas - 1 até 3 (de um total de 3)
  • O tópico ‘Customização da página de postagem’ está fechado para novas respostas.