Template “Lembranças” – Blogger Templates

Ainda na “onda” dos slide shows charmosos, criei este template pensando em quem gostaria de registrar e compartilhar imagens e fotos de momentos inesquecíveis. Claro que o título “Lembranças” e o tema sugerido é só uma idéia porque, com criatividade, você poderá usar esse modelo para o que quiser. Veja  que graça o template instalado.

 

 DEMO

DOWNLOAD DO TEMPLATE

DOWNLOAD DA PASTA ZIPADA COM IMAGENS (RECOMENDO)

Descrição do modelo:

1. Menu com ícones para redes sociais no topo
2. Slide show deslizante com imagens auto-ajustáveis e link de direcionamento
3. Resumo automático de postagens
4. Caixa de pesquisa personalizada
5. Botão “Voltar ao Topo” que acompanha toda a página
6. Área de comentários personalizada
7. Ícones nos marcadores do rodapé das postagens
8. Ícone (bullets) nos marcadores da sidebar
9. Fonte do cabeçalho, “Philosopher” do Google Directory

Área de comentários

Como editar o menu do topo do template:

Faça o login e escolha a opção Design, depois “Editar HTML”

Procure pelo seguinte trecho

<ul class='left'>
<li><a href='#'>Home</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Fotos</a></li>
<li><a href='#'>Vídeos</a></li>
<li><a href='#'>Roteiros</a></li>
<li><a href='#'>Editar link</a></li>
<li><a href='#'>Editar link</a></li>
</ul>

Escreva nos espaços com o sinal “#” a URL da página para onde quer direcionar o link. Edite a área em negrito escrevendo o nome que queira dar aos seus links.

Como editar o slide show

Procure pelo trecho abaixo:

<!-- Slide-1 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggdnR_5HAvwINuDX8smuWfp-YEj00aRIzkUfqG5x8CUH8mtizwWHlwxexekjwQ5zTsirFKCy5O3SuwTSBaDfgZkwqco9eZm4iuz2ER9b0Zi_eNeDs2cRRSJGcI9bc4BwrYRWSNzVa1Iv1V/s1600/viagens-baratas.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO </p>
</div>
</div>
</li>
<!-- Slide-1 Code End -->

<!-- Slide-2 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN1ppE_x8F9AnTohDt6Xg05sHhxv31-sUx6CcDDsX3zcwJEClcAMQClYcjuoc1crI8q3GbD4w9EZsPeThCbLRD28W9l_tuz4idGDy6Wexegb5QHysjhF7esFfgMgjAKuEj_C8ZLcq4t5b2/s1600/lua-de-mel-480x309.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>
<!-- Slide-2 Code End -->

<!-- Slide-3 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAOaT0wqXfUUdKjhYKwoRG3Wsy8rUo8ivIJh6zgeh3Rk5hSGN1FQPlojIoTcb77KVVlu-QZ3Vm3Ie-0ndcsefqoXZ4z_HR07kkv08SWCiq4i7ds94U3EqojNWRZ49mtKg1LUUW5PyrTpEG/s1600/lua-de-mel.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>
<!-- Slide-3 Code End -->

<!-- Slide-4 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3lO0dpPvtxHkeKDWdtNYkjEG3tGMCHLoZzD6SUPcPCwTf3UTky58z0x9yM0K66aSX5i-QNSF6SUcPmbXO5ONCpkk7V7tkKwSXoffjcweiZd1P6ow9bOcvBxE5rRtD-z3qBc59swI1GvB6/s1600/viagens-tailandia.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>
<!-- Slide-4 Code End -->

<!-- Slide-5 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZhc90ceF7RzjXvQr2OXCj-TkCpxfg1H8wDPtOgCSCJiw32JecqiR9C975U73-jCIDJ6uC9e3b4bfieDWP7QtlMn5Dn3vEIXOFkJ7W9OprrkeG56O20aVGPBSFTSHytVEqobg53WHWkSO2/s1600/familia.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>
<!-- Slide-5 Code End -->

<!-- Slide-6 Code Start -->
<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZN0qYkW70p700YOFJcaSM8n5ExWAbNc06BawvkRDArh70EzhekuPSz51SQsZuco3riSUhTKIPxJBbdjGTvdaMJ3FHy8fgY0-ZyvEMuQsDlVdOGzIURQC6WuYrG71S4KhDqt1IWbEIxG3s/s1600/104729.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>
<!-- Slide-6 Code End -->

 

Edite colocando o endereço de direcionamento do link, na área grifada em verde.

O que está grifado em vermelho, é o endereço da imagem que deseja exibir. Apenas certifique-se de que elas não tenham menos de 400px de largura.

Em negrito, a descrição, texto ou título da imagem

Caixa de pesquisa

Para instalar a caixa de busca, vá em sua oção “Design” e clic em “Adicionar um Gadget”. Escolha um elemento “HTML/JavaScript” e cole dentro dele o seguinte código:

<form action='/search' class='right' id='searchthis' method='get'>

<input class="input-text" id="searchBox" name="q" onblur="if(this.value==&quot;&quot;)this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value=&quot;&quot;;" type="text" value="Pesquisar..." vinput="" />
<input class="searchbutton" id="submit-button" type="submit" value=" ►" /></form>

Prontinho!

Espero que gostem. Qualquer problema na instalação, grita que eu acudo.

Beijo da Mama ♥