Últimos posts – lado a lado com imagem

Resolvido

(@royroy)

Olá,
preciso de uma ajudar urgente.
para vocês é fácil, rs, mas aqui tá dificil.

só preciso exibir os 3 últimos posts lado a lado na página inicial (com miniatura)
segue imagem de como deve ficar:
Imagem

estou usando os códigos, na index:

<div style="teste">
            <?php query_posts('showposts=5'); ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>"><?php the_title(); ?><br />

<?php
   if ( has_post_thumbnail() )
      the_post_thumbnail(array(120,120));
   elseif ( has_post_thumbnail() == false && $first_img == true )
      echo '<img src="'.$first_img.'" width="120" height="120" alt="" title="" />';
   else
      echo '<img src="" width="120" height="120" alt="" title="" />';
?></a>
<?php endwhile;?>

        </div>

no css:

.teste {
		width:170px;
		height:170px;
		display:inline-block;
		float:left;
		vertical-align:top;
		position:relative;
}

não consigo colocar lado a lado,
tentei vários plugins widgets, mas todos ficam um embaixo do outro.

vlw pela ajuda

Visualizando 11 respostas - 1 até 11 (de um total de 11)

Criador do tópico royroy
(@royroy)

12 anos atrás

algo parecido com esse thema:
modelo

só que com miniatura.

bogiebr
(@bogiebr)

11 anos, 11 meses atrás

Coloca o <div style=”teste”> depois do query post e fecha o <div> antes do endwhile. Como no modelo abaixo…

<?php query_posts(‘showposts=5’); ?>
<?php while (have_posts()) : the_post(); ?>

<div style=”teste”>

“><?php the_title(); ?>

<?php
if ( has_post_thumbnail() )
the_post_thumbnail(array(120,120));
elseif ( has_post_thumbnail() == false && $first_img == true )
echo ‘<img src=”‘.$first_img.'” width=”120″ height=”120″ alt=”” title=”” />’;
else
echo ‘<img src=”” width=”120″ height=”120″ alt=”” title=”” />’;
?>
</div>
<?php endwhile;?>

Criador do tópico royroy
(@royroy)

11 anos, 11 meses atrás

valeu amigo,
vou testar aqui, abração

jorgecalcado
(@jorgecalcado)

11 anos, 11 meses atrás

Conseguio resolver amigo? Se não conseguir posta aê, acho que deve ser assim que vc precisa: http://festivaldalavoura.com/v1/

Criador do tópico royroy
(@royroy)

11 anos, 11 meses atrás

e’ amigo, era exatamente assim que eu precisava.
e parabéns por esse seu trabalho, muito bom.

eu “resolvi” com um plugin pago.
mas não era isso que eu queria, eu queria mesmo era aprender e não depender de plugin

jorgecalcado
(@jorgecalcado)

11 anos, 11 meses atrás

Amigo RoyRoy obrigado pelo elogio ao meu trabalho se interessar tem o link de outros aqui: http://jorgecalcado.com.br . Vou lhe passar a forma que fiz esse.

Primeiro o codigo:
http://pastebin.com/f0QBGc13

E aqui a formatação:
http://pastebin.com/d1ZcD8Bh

OBS. Da forma que eu fiz, o post deve ter apenas uma imagem inserida e com um link para uma determinada página.
Fiz de uma forma bem rudimentar, esse código é de um primeiro site que fiz em wp, e recentemente apenas remodelei o visual, mas como está atendendo bem ao cliente e é um site de um evento temporário preferi não mexer, mas tem outras formas de fazer, inclusive de forma mais dinãmica, a grande sacada de algo assim é mais o css do que a programação mesmo.

De qualquer forma acho que dá pra vc brincar um pouco e ter uma noção.

Testa e qualquer dúvida posta aê.

Messias Cobacci
(@messias-cobacci)

11 anos, 9 meses atrás

Olá, royroy, estou com o mesmo problema que você, sera que você pode me passar o nome do plugin que esta usando?
E se não for pedir muito o endereço do seu site para eu poder ter uma noção de como ficam os posts com este plugin?

Abraço!

Criador do tópico royroy
(@royroy)

11 anos, 9 meses atrás

Opa,
o plugin chama Special Recent Posts PRO
ele é pago, mas você consegue por ai usando o google.

infelizmente não posso te passar o site pois ainda está em desenvolvimento, mas posso garantir que funciona 100% de uma forma muito fácil via Widget.
estou desenvolvendo um tema, e usando as dicas do amigo Jorge Calçado, mas ainda to apanhando um pouco, então to sempre usando esse plugin.

Messias Cobacci
(@messias-cobacci)

11 anos, 9 meses atrás

Nossa, legal!
Muito Obrigado, e Feliz Natal!

oliiniciante
(@oliiniciante)

11 anos, 8 meses atrás

para começar uma nova coluna com 3 use o código assim: <div style=”clear:both”>

<center>

<div style=”float:left; width:33%”>conteudo ou imagem aqui</div>

<div style=”float:left; width:33%”>conteudo aqui</div>

<div style=”float:left; width:33%”>conteudo aqui</div>

<div style=”clear:both”>

<div style=”float:left; width:33%”>conteudo aqui</div>

<div style=”float:left; width:33%”>conteudo aqui</div>

<div style=”float:left; width:33%”>conteudo aqui</div>

</div>

oliiniciante
(@oliiniciante)

11 anos, 8 meses atrás

em >conteudo aqui< vai o endereço da imagem…