Veja um demo clicando no botão abaixo ou em Result no Box de códigos.
- Copie o código CSS do Box de códigos Vá ao painel do Blogger->modelo->editar HTML->use Ctrl+F e localize]]></b:skin>
- Acima desta tag cole o código CSS
- Ir para o painel do blogger->layout Clique em Adicionar um Gadget.
- Na janela Adicionar um gadget->HTML/JavaScript.
- Copie o código JS abaixo e cole-o dentro da caixa de conteúdo.
- Salvar o gadget. Arraste o gadget e reposicione-o onde você quer mostrá-lo.
- Clique no botão Salve (canto superior direito).
- No código JS consta orientações para configurar a galeria
<link href='http://fonts.googleapis.com/css?family=Raleway:400,700|Merriweather' rel='stylesheet' type='text/css'>
<div id="all">
<div class="view view-second">
<img src="https://lh4.googleusercontent.com/-x27hrzMHyqs/VEjsKaYsvXI/AAAAAAAAHrs/4x-6JgoOzJU/w300-h200-no/Olhar%2Bhumano.jpg" />
<div class="mask">
<h2>Olhar humano</h2>
<p>O olho humano é o órgão responsável pela visão no ser humano.
</p>
<a href="URL DO POST" class="info">Leia mais</a>
</div>
</div>
<div class="view view-second">
<img src="https://lh3.googleusercontent.com/-ay4P7JXZv7A/VEjqUFcM5iI/AAAAAAAAHqc/xyRbOQXD3uc/w300-h200-no/Cuidar%2Bda%2Bnatureza.jpg" />
<div class="mask"></div>
<div class="content">
<h2>Cuidar da natureza</h2>
<p>A natureza é o único livro que oferece um conteúdo valioso em todas as suas folhas.</p>
<a href="URL DO POST" class="info">Leia mais</a>
</div>
</div>
<div class="view view-tenth">
<img src="https://lh6.googleusercontent.com/-LkAAXglhUgk/VEjpadmeVqI/AAAAAAAAHqI/rFLIGP0Uvg0/w300-h200-no/Azores.jpg" />
<div class="mask">
<h2>Açores</h2>
<p>Os Açores, oficialmente designados por Região Autónoma dos Açores, são um arquipélago transcontinental e um território autónomo da República Portuguesa...</p>
<a href="URL DO POST" class="info">Leia mais</a>
</div>
</div>
</div>
See the Pen Imagens com efeito resumo e link leia mais by Mairink (@Oemes) on CodePen.
MUITO LEGAL , DEU CERTO NO MEU BLOG AMEIIIIIIIIIIII
ResponderExcluirLegal, obrigado por sua visita!
ResponderExcluir