Free Templates MamaNunes

Template “Lembranças” – Blogger Templates

noreply@blogger.com (MamaNunes) — Wed, 27 Oct 2010 19:24:00 +0000

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:

Menu com ícones para redes sociais no topo
Slide show deslizante com imagens auto-ajustáveis e link de direcionamento
Resumo automático de postagens
Caixa de pesquisa personalizada
Botão “Voltar ao Topo” que acompanha toda a página
Área de comentários personalizada
Ícones nos marcadores do rodapé das postagens
Ícone (bullets) nos marcadores da sidebar
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:

<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhliU923iRv4jCoE7_xJbzHSAVaRIa0VByxLNqMTH3LMKD_JpG4SoXNuO8lzhdwmWa-u7-0zRuoLk7eA0m1Aiw-UkIphR55UrwLOx1jQSLzOTwFLqzQkdkX1xmYwxI-UXiAnEDxSR0pZ4W/s1600/viagens-baratas.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO </p>
</div>
</div>
</li>



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



<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijxZjkoE5F16MKnllNJvCEzk975Vs0grM6ZXJ8rJGZ3anxap1JIuA5xT3s_68JjDDz-7r_zMibtrbS8nviRSnVfU6Aboy6Syls6Ip2__tTAHcmnrf2gzGZck25WGBEL_c3IsKAAvW8YMhL/s1600/lua-de-mel.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>



<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf2fQpjJ6I6Y9lYchk_IhjuXbl0h1WCXmWzKv6j49Z3DQYM7LStAn8MR_ls6SqM6_FlVUL20A6g52QdfluUjh4wIOy6R-uQuK_0kLu6LTCEBordTlpEOrRprt-RrJUyDAw__F06a65M8HF/s1600/viagens-tailandia.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>



<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDJR7Q-tNiekwg6CX-dgXcv6oNwm9XSC6jNMyoq-8Bi17CL9GYRSpX0-ppd7MiUEjT9ymubeKshoB27k3bOH7RN1gNfqYNp3OmYrlT5HxQ9lbfGqoXMbeC1YYXqw8faCmRQrjE7VBQroNI/s1600/familia.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>



<li>
<div class='mytext'>
<a href='ENDEREÇO-DO-LINK'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrAnEmvC96oPKR1yyeyAZSxtgNvTYxpUsaB6N4B1K83K_ef9L5AgQ8Z91KonZ8HYWbhZ6RISfJ9UXyGZd3lG02tp1PSyRfvcoo-HbM3Sc20OBAdrtU0Q6GXfY7aY3eggtHINzcMysKPBY9/s1600/104729.jpg'/>
</a>
<div class='inpost'>
<p>NOME DA FOTO OU TEXTO</p>
</div>
</div>
</li>

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=="")this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value="";" 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 ♥

Template “Animal” – Blogger Templates

noreply@blogger.com (MamaNunes) — Tue, 26 Oct 2010 14:17:00 +0000

A beleza desse template está principalmente no modelo de slide show em formato acordeom, que desliza ao passar o mouse e revela o título e texto em efeito opacity. O nome, Animal, foi somente uma inspiração mas o modelo poderá ser usado para qualquer tema que inclua imagens, fotos, exposição de arte, etc. Os detalhes foram cuidadosamente caprichados como você poderá conferir no template instalado.

►Detalhes do modelo:

Menu com ícones para redes sociais no topo da página
Slideshow em estilo “Acordeom”
Resumo de postagens automático com imagens
* Posts relacionados com imagens
* Botão “Back to top” deslizante com JQuery
Área de comentários personalizada
Marcadores com bullets

DEMO

LINK PARA DOWNLOAD DO DOCUMENTO XML

LINK PARA DOWNLOAD DE PASTA ZIPADA COM IMAGENS (RECOMENDO)

*Posts relacionados com imagens:

Configurado para exibir 6 posts.

*Botão “Back to top”

Esse botão criado com script JQuery, acompanha a página inteira e quando clicado, volta ao topo com movimento suave.

INSTRUÇÕES PARA INSTALAÇÃO

Como editar o menu do topo do template

Faça login e clic na opção “Design”, depois clique em “Editar HTML”

Procure pelo seguinte trecho:

<ul class='left'>
<li><a href='http://demo-animal.blogspot.com'>Home</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Serviços</a></li>
<li><a href='#'>Contato</a></li>
<li><a href='#'>Edit Link</a></li>
</ul>


<ul class='right'>
<li><a href='SEU-ENDEREÇO-FEED'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtAHXwfP6VhoGR8HMd7Nh8D0TV6gD19ybrv9SscH7zmm8dknaud_s5op0hbv7J3dBrDTs11ZDS9NjzmdB0tkTIL3XeJhiupFCX-Mr7o8sY4NDuteD3u7KPYLAlSVOReBnDY0skVsZph9I/s1600/feed.png'/>
</a></li>
<li><a href='SEU-ENDEREÇO-TWITTER'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiam9M3NOHsJz5A651ZywPdygzaFpF48ijBXH_x_teSn4tu1j0NXgOS7hBbN5k8B84QtzSwTgLS2RSUxoTHlr_Lws3ZXs_ZrQVl0jEKFXuqdELDJvVbZ-C0hTrc3XfC6MBFtUnXwwocoX8/s1600/twitter.png'/>
</a></li>
<li><a href='SEU-ENDEREÇO-FACEBOOK'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0Jc_7CU43Tenp2L3e9ftbtuhsrqwNlxhq0edwPaLYoNMmORXws7pYwvOs_qBC17N3XNJjXj7HhxUkNu3gG-9K18ejtI-VKFW9CjRAlEhZykusJvMXzmQV7yn2iIYcfC3YefXlM_haVSA/s1600/facebook.png'/>
</a></li>
<li><a href='mailto:SEU-EMAIL'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKCZ8cnR9j9GUp_Fbqw8Ywb3W3x_DtQobnjW11LbqLrbr6-migriKRHA_7npdO00gZbClFwXQbCHuz4lEATvs4WXNArD2bpS_eECP4DwRxsf8Ma4JbnDA_NMTD9DLx7blwxyqS4HoI5Gs/s1600/email.png'/>
</a></li>
</ul>
</div>
<div id='clear-both'> </div>

Edite os links, por exemplo:

Onde há o sinal # escreva o endereço para onde deseja direcionar o link.

Como instalar e configurar o Slide Show:

Código HTML do slide

<div id='slidearea'>

<ul class='kwicks'>
<li class='kwik'>

        <a href='URL-LINK-IMAGEM’>
                <img alt="" class="slidimg" src="ENDEREÇO-DA-SUA-IMAGEM" style="width: 750px; height: 250px;" />
        </a>

<div class='kwikmet rounded'>
        <h2><a href='URL-LINK-TEXTO' rel='bookmark' title='texto'>Título da Imagem ou Post</a></h2>

        <p>Texto, nome da foto ou resumo do post desejado.</p>

</div>
</li>
    <li class='kwik'>

     <a href='URL-LINK-IMAGEM’>
                <img alt="" class="slidimg" src="ENDEREÇO-DA-SUA-IMAGEM " style="width: 750px; height: 250px;" />

        </a>
<div class='kwikmet rounded'>
        <h2><a href='URL-LINK-TEXTO' rel='bookmark' title='texto'>Titulo da imagem ou post</a></h2>
        <p>Texto, nome da foto ou resumo do post desejado.</p>

</div>
</li>
    <li class='kwik'>

      <a href='URL-LINK-IMAGEM’>

                <img alt="" class="slidimg" src="ENDEREÇO-DA-SUA-IMAGEM " style="width: 750px; height: 250px;" />
        </a>
<div class='kwikmet rounded'>
        <h2><a href='URL-LINK-TEXTO' rel='bookmark' title='texto'>Test with enclosures</a></h2>
        <p>Texto, nome da foto ou resumo do post desejado.</p>

</div>
</li>
    <li class='kwik'>

          <a href='URL-LINK-IMAGEM’>
                <img alt="" class="slidimg" src="ENDEREÇO-DA-SUA-IMAGEM " style="width: 750px; height: 250px;" />
        </a>
<div class='kwikmet rounded'>
        <h2><a href='URL-LINK-TEXTO' rel='bookmark' title='texto'>Título da imagem ou post</a></h2>
       <p>Texto, nome da foto ou resumo do post desejado.</p>

</div>

</li>
    <li class='kwik'>

     <a href='URL-LINK-IMAGEM’>
                <img alt="" class="slidimg" src="ENDEREÇO-DA-SUA-IMAGEM " style="width: 750px; height: 250px;" />
        </a>
<div class='kwikmet rounded'>
        <h2><a href='URL-LINK-TEXTO' rel='bookmark' title='texto'>Título da imagem ou post</a></h2>
        <p>Texto, nome da foto ou resumo do post desejado.</p>

</div>
</li>
    </ul>

<div class='clear'/>
</div></div>

Copie o código acima, cole em um bloco de notas para fazer as alterações necessárias.

As imagens do slide deverão ter 750px de largura (widht) por 250px de altura (eight).

Depois que tiver configurados todos os links e imagens, vá em sua página “Design” clique em ”Adicionar um gadget”

Copie todo o código já editado e cole dentro de um elemento HTML/JAVASCRIPT e SALVE.

É isso crianças! Espero que gostem.

Beijo da Mama ♥

Retro Vintage – Free Blogger Template

noreply@blogger.com (MamaNunes) — Mon, 16 Aug 2010 12:54:00 +0000

Um template charmoso para blogueiras ousadas!
Jô Angel me dizia outro dia que ama vintage e me inspirou a criar um template com o tema. Pesquisei e encontrei pinups maravilhosas de Gil Elvgren e não resisti a tentação. Estou pensando em fazer uma série. Adorei a brincadeira!
Usei como base um tema Wordpress convertido para Blogger.

Clique na imagem para ver a demonstração online

DEMO
DOWNLOAD XML
DOWNLOAD PASTA ZIPADA (recomendo)

Propriedades:
Duas colunas
Barra de navegação
Gadget para subscrição (Rss/Feeds/Twitter)
Ícones de compartilhamento redes sociais (ativado)
Blockquote personalizado
Botão “Voltar ao topo” com efeito deslizante - JQuery
Melhor visualização nos navegadores: Firefox, Chrome, Ópera e Safari
Instruções para edição do gadget para subscrições

Faça login, clique em “Design” e clique em “Adicionar um Gadget” e escolha a opção “HTML/JavaScript” – cole dentro dele o seguinte código:

<div style="border: 1px solid #ccc;padding:5px;">
    Receber publicações vía email
    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Teu-FeedBurner-Feed'’, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input type="text" name="email" /><input type="hidden" value="Teu-FeedBurner-Feed" name="uri" /><input type="hidden" name="loc" value="es_ES" /><input type="submit" value="Subscrever" /></form>
    <div style="padding-left:10px;">
    <p><a href="http://feeds.feedburner.com/Teu-FeedBurner-Feed " target="_blank" title="Subscribe nuestras entradas"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj5Zjtl79H4aJssKhQHEm7KwV93VOExsQdIC6LM1Fg3ktyJpkNF3q_FEZmgyOZQNuCH_-wmJWgaUmBlQcgsUm2U2jAsPtO176txw4egdeQg1OB13ps6AG1cDM5gQavrJsERx4q_S60rVVX/s400/rss.png" /></a></p>
    <p><a href="http://feeds.feedburner.com/Teu-FeedBurner-Feed " target="_blank" title="Subscrever-se">Increver-se RSS Feed</a></p>
    <p><a href="Url-de-tu-pagina-de-Facebook" target="_blank" title="Facebook"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiefm-zisELakAeLkLEfbfeoqAQTQvDPoOgqb0PAtxsOMB3xbvCXUeeD4iUizoCxwVtHZE4wYWrPS37YJgOa9kXa-covAJWrMyQOqhFkSq7ZF8Ae2oqXIzuN4VI4WfNpaEKDy0g2qjZYdx5/s1600/facebook.png" /></a></p>
    <p><a href="Url-da-tu-pagina-no-Facebook" target="_blank" title="Facebook time">Siga-me no Facebook</a></p>
    <p><a href=http://twitter.com/USERNAME target="_blank" title="Twitter"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1j0tDeKOPve44S_lGajV3m8Yag2rZ-FYQzvji4l6vp0TkK_B5FuavuBQPMRGb8z79x1vI1PBpJ7z7FWt8JHVypIROgfDthk6L52oMT-qtzojX7JAL0kxznUiKVmI1xBejsVqEZrYJdwTT/s1600/twitter.png" /></a></p>
    <p><a href=http://twitter.com/USERNAME target="_blank" title="Twitter time">Siga-me no Twitter</a></p>
    </div></div>

Escreva os seus endereços Feed/Rss e twitter username nos trechos grifados em vermelho.
Editar a barra de navegação

Faça Login ►Design ► “Editar HTML” e encontre o seguinte trecho:

<ulo class.='tabNavigation'>
<li><a href='ENDEREÇO-DO-BLOG’>Home</a></li>
<li><a href='LINK DA PÁGINA SOBRE O BLOG'>Sobre o blog</a></li>
<li><a href='LINK DA PÁGINA DE CONTATO'>Contato</a></li>
</ul>

Escreva os endereços correspondentes no espado grifado em vermelho.
Para instalar o gadget “Postagens Recentes” como está no modelo, siga os passos como nas imagens abaixo.

Créditos:
O gadget de subscrição foi criado por Rosa Torre do ESCAPARATE DE ROSA, onde ela apresenta três modelos diferentes que você poderá escolher e substituir caso queira.
Imagem: Pinup de Gil Elvgren editada por mim em Photofilte Studio
Base/Inspiração ► Blogger templates Templates Block
Caso tenham algum problema com instalação, enviem mensagem pelo formulário de contato.

Beijo da Mama ♥

Template “Anotações Online” – Free Blogger Templates

noreply@blogger.com (MamaNunes) — Thu, 12 Aug 2010 17:10:00 +0000

Design elegante, cores suaves, background com textura de madeira e um bom trabalho de edição de imagem sugerindo papel de carta personalizado. Muito bom para blog pessoal, textos, poesias, etc…
Recomendo o download da pasta zipada que contem todos as imagens utilizadas no layout.
Clic na imagem para demonstração online.

Template Anotações Online – DEMO
Documento XML – DOWNLOAD
Pasta zipada (recomendo) - DOWNLOAD

Propriedades:

Duas colunas
Resumo automático com imagens
Lista de posts relacionados abaixo das postagens
Barra de navegação com informações para os links
Ícones para feed e redes sociais
Ícones exclusivos nos marcadores
Blog pager (navegação) personalizado

INSTRUÇÕES PARA INSTALAÇÃO:
Faça download da pasta zipada (recomendo) e descompacte numa pasta em seu PC . Lá você vai encontrar as imagens e o documento XML, ou faça download somente do XML
Faça login → Clique na aba Design → Clique em Editar HTML → Clique em Selecionar arquivo →Clique em Fazer upload → Salve o template
MENU (Linkbar)
Procure dentro da sua pagina “Editar HTML” o seguinte trecho:

<ul id='blue'>
        <li class='current'><a expr:href='data:blog.homepageUrl' rel='tag'>Home<span>Página inicial</span></a></li>
        <li><a href='ENDEREÇO' title=''>Sobre o blog<span>Texto correspondente</span></a></li>
        <li><a href='ENDEREÇO' title=''>Portfolio<span>Texto correspondente</span></a></li>
        <li><a href='ENDEREÇO' title=''>Link<span>Texto correspondente</span></a></li>
        <li><a href='ENDEREÇO' title=''>Contato<span>Deixe seu recado </span></a></li>
    </ul>

Edite os trechos coloridos: Endereço do link, nome do link e texto que vai aparecer ao clicar.
ÍCONES E LINKS PARA REDES SOCIAIS
Procure dentro da sua pagina “Editar HTML” o seguinte trecho:
Coloque os endereços nos locais indicados.

<div id='redes-sociales'>
<a class='redes-sociales' href='http://SEU-ENDEREÇO-FEED' rel='alternate' target='_blank' title='Suscribirse' type='application/rss+xml'><img alt='rss' border='0' border:0='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO4xBvKxyzO-GBJI9i-1SyVxnkVbvkwSW2Xbz1I9vvduUi2GfzBYq55wSs5Xdn3yLAv9R5fMBjbLiavxI2O7pAp16tjRxTp7OU0kIFLyBv5li_eiP1MDskd3e6YJlZ2Bn-9niQSRB2ouYd/s320/rss.png'/></a>
<a class='redes-sociales' href='http://twitter.com/USERNAME' target='_blank' title='Twitter'> <img alt='en Twitter' border='0' border:0='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7Y9T833s3EDXu7HczH5uhkv9CRNxWC4MGLbhd93irAJNW71hWPxDodD1nI_SuHqJuQvNMHLH3fK-K2dXNijk7w8rhR_LdX9InbyU6PyokCQQUpsrQ_46ZZ3vvE1eLkI-zhNAjebDgXk1J/s320/twitter.png'/></a>
<a class='redes-sociales' href='http://SEU-PERFIL-FACEBOOK' target='_blank' title='Facebook'> <img alt='en Facebook' border='0' border:0='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj9ok3Qcc8UTwah1iD40L-8rhgOpI8jKMkRTiNrRezfKXo9ghLKkQcJ7oFH99ybI4qzb8tK_xw_6c-if1jpnN5pGr2qfX49qyw7gh0A0ehmh16GK5UwXJLOoFzCbNcD0xy5WUNXVFPEzWB/s320/facebook.png'/></a>
<a class='redes-sociales' href='http://PAGINA-YOUTUBE' target='_blank' title='YouTube'> <img alt='YouTube' border='0' border:0='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtaG5heCPTQ1G9cVYek38E0Iv9zgCM9G7uJz2Yp6c2KSq9nuOpCvyfZAogtlpLjo6MV89SKiZNECONFT5gzhGST_Ncs5F-QFWkCMVvZ4Oui3KOfXtuuv2Sk4mhU57zS4jv_e8NZg_IaQV-/s320/youtube.png'/></a>
<a class='redes-sociales' href='FEED-NEWSLETTER-OU-EMAIL'> <img alt='YouTube' border='0' border:0='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisYxtWo1xMXwqklKQCm4BUzy6V3MDiM38ESNe4JII8ECHLuHGEf3p4uqF9itnXxkQxdSkV_yrZZwJ5GPLLP5YqK0iQTXVlE1E9sx2IJWjvTNlpKZdiPOxq_j75lIFCGwqE7OWOkOtuRaLG/s320/email.png'/></a>
</div>

Template Anotações Online – DEMO
Documento XML – DOWNLOAD
Pasta zipada (recomendo) - DOWNLOAD

Qualquer problema, grita que eu acudo.
Beijo da Mama ♥

- “A Abelha” Bzz Template – FREE DOWNLOAD

noreply@blogger.com (MamaNunes) — Mon, 09 Aug 2010 15:40:00 +0000

Um template simples mas caprichado e cheio de charme (modéstia a parte). Simples e funcional. Ideal para blog pessoal ou para um tema sobre saúde, alimentação natural, receitas…
Toda a estrutura recebeu as melhorias do Blogger, por exemplo “Artigos Relacionados” com imagens adaptado ao layout, para exibir até 5 artigos.

Disponibilizei o código XML para baixar direto e também uma pasta zipada com o documento e as imagens para que você hospede em seu próprio blog ou em um site de sua preferencia para sua garantia no caso de haver algum problema.

DEMO ONLINE

DOWNLOAD TEMPLATE

DOWNLOAD PASTA ZIPADA (recomendo)

PROPRIEDADES:

• Duas colunas
• Posts resumidos (automático)
• Numero de comentários, plural e singular
• Ícones para Twitter e Feed (abelhinha)
• Artigos relacionados com imagens (personalizado)
• Links para enviar postagens para redes sociais ( Wiest Blogger)
• Blockquote personalizado
• Cores e fontes pré-definidas no CSS
• Fonte do Cabeçalho – Google Font Diretory

INSTRUÇÕES PARA CONFIGURAÇÃO:

Nome e descrição:
Faça login e clique em “Configurações” e escreva no campo determinado.
Barra de Navegação do Blogger:
Normalmente retiro essa widget mas se você fizer questão de usar a Navebar do Blogger, faça login, clique em “Design” e “Editar HTML”. encontre o trecho abaido e apague-o:

#navbar-iframe {
display:none!important;
}

Editar menu exclusivo do template:
• Faça login, em seguida clique em “Design” e depois “Editar HTML
• Procure pelo trecho abaixo e edite onde está em vermelho

<ul id='menu'>
            <li><a Title='Home' expr:href='data:blog.homepageUrl' title='Home'><img alt='' height='42' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpfYS5jCl0NV6DwBrHK5X4H5ely5ctD4ZPC_R-KSjQ5l1aCK5fEOTehSfSvJHuFO1zHM-Hl9wWWPUCCQwBfNZzUg29w1MWtWJS8y6WtUIoehqh6ZV3SONjwWcfzK5XRIHF8HhE5vo0ZnlP/s400/home.jpg' width='64'/></a></li>
            <li><a href='mailto:SEU EMAIL' title='Contato'><img alt='' height='42' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzUWUXTthcprX17fXOaGvquE9iPOV-A5ObTZQwf_oWBiGi4CWhABUCXMKuFIxhmDxtaFxjmzapk7hGxwoFM4DyQes7ILKJyKtQEirlbcolTbRAFfCCll9euqQqSPZIwkBxezmnECm9gPH1/s400/contato.jpg' width='93'/></a></li>
        <li><a href='SEU PERFIL' title='Quem sou'><img alt='' height='45' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGxBpiaG0Q1qlSJm6OQpuxmd0CKxXD-Zy5Q2rGm_BZGq5b0Qm1LFaYLdlujBqxxS2JCcq3YCgaeXesB5P7xzMCjOvUBoaQhMmeovAW76rTAhOQal8dd3d8A63uFGmn1zWsHWeuHFZcybqQ/s320/quem.jpg' width='102'/> </a></li>
<li>
<a href='http://twitter.com/USERNAME'><img height='100' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_1Y-iTSpndKZ59GuXdUKjNRmY0YvqRce_BKGoseCkUimzJlCMmy_v8E97iCbG7CA6G23mbxqZULAFRMO8tbJ3arsolX6c69hH7jkxIxMxeJzYDIDEt6_XYyW4NKBPCR4vRMpvBc_C7dce/s320/twestival+bird+7.png' title='By: TwitterButtons.com' width='119'/></a><br/>
</li>
</ul>

Se tiver alguma dúvida, não se acanhe, escreva no formulário de contato e eu dou uma força para a instalação.
Espero que gostem!

Beijo da Mama♥

Template Classic Style – Com Galeria de Fotos “Fancy JQuery”

noreply@blogger.com (MamaNunes) — Thu, 01 Apr 2010 22:23:00 +0000

Vi esse modelo para site e descobri que estava à disposição para free download. Não resisti em converte-lo para o Blogger. Ficou maravilhoso (sem modéstia nenhuma) não só pela funcionalidade, mas pela beleza do design minimalista. Cores neutras e espaço suficiente para não ofuscar a beleza das fotos.
A galeria Fancy JQuery apresenta um efeito lindo na ampliação das fotos além de funcionar como um slidshow fantástico. As fotos que aparecem ampliadas, podem ter o tamanho que você quiser. Muito bom!!!
Criei 7 páginas estáticas personalizadas para os links, nas quais não aparecem a galeria, nem a sidebar, dando assim um visual de site mesmo.
Veja o modelo DEMO . Clic nas fotos para ver o efeito.

DEMO

DOWN ML OAD XML

DOWNLOAD PASTA ZIPADA

Disponibilizei dois arquivos para download. O primeiro é o código para instalação direta e o segundo é a pasta zipada que inclui as imagens utilizadas no layout (exceto fotos) mais os scripts e imagens da galeria Fancy. Escolha o que quiser, mas eu aconselho a salvar a pasta zipada, hospedar as imagens eu seu próprio site de preferencia, assim como os scripts…Assim, se der algum problema, você já tem tudo organizado.
Propriedades:
Ícones para redes sociais no topo
Menu de navegação “Dropdown”
Galeria de fotos Fancy JQuery
Espaço para “Boas vindas” Editável na página “Layout”
Widget de Posts Relacionados no footer do post
Páginas Estáticas Personalizadas (7)
Footer editável na página “Layout”

Detalhes para instalação

Editar Menu:

No painel, clic em “layout” e depois em “Editar HTML”

Manter a caixa “Expandir modelos de widgets” DESMARCADA e procurar pelo trecho

<ul class=’dropdowns’><!—menu –>

Mude o endereço do link ( grifado em verde na imagem abaixo) e os nomes (se quiser) “Home”… “Gallery”, etc… (grifados em vermelho).

Detalhe importante:

Os links Retratos, Paisagens, Viagens, Arte e About me são dirigidos para as páginas estáticas.

Os links Cidades e Brasil são dirigidos a uma página de marcadores.

Esqueleto “Layout'’

Editar as fotos da galeria

Clic no elemento indicado na imagem, HTML/JavaScript e na caixa de edição que abrir repare no seguinte código:

<div id="gallery">
<ul>
<li>

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAstcL1KhJXuyEx6x1U2r-S-RkhxZOpzrxOlmVuPnDIEsmOXM_BvO72TegWX1lJYdeCopmeSADIhCdZMU84B4LVpt3mhL1tkLUZGfdMhxht9oakDkAXSlA2FKER47Pis9vf8fYXSqO-w8/s320/v.jpg
" title="pic" class="fancybox" rel="group"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzPXgJ8MmaQtcggZdJknBgXy948i76zHs6GYEMWeW183NdIyVkq7HfdfSv2P3XR5m2DbYkL4vuGOvNC3dGUSMP32caweSWRec3ZSbZO8aVvm7wlAD2d9e6ewkhp1p_jTjck45X-9bU6Ik/s320/tumb2.jpg" alt="demo" /></a>

</li>

Repare que entre as tags <li> e </li> estão os endereços das fotos hospedadas. O Primeiro endereço é da foto grande e o segundo, da foto pequena.
Esse trecho se repete oito vezes porque temos 8 fotos na galeria sendo que para cada quadradinho, usamos duas imagens, a grande e a pequena. Substitua todas as fotos.
Editar a mensagem de “Boas Vindas”

Clic em “Editar” como indicado na imagem e no box que abrir você verá o espaço determinado para o texto apropriado.

<div id="intro">
<p><span>Benvindo ao meu blog.</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris quis risus ligula. Proin rhoncus felis at ipsum consequat eget commodo libero semper. Morbi sed purus arcu.</p>
</div>

Editar as colunas do footer

Clic em “Editar” e no box você verá os códigos e os espaço para editar os textos e links.

<div id="intro">
<p><span>Volte sempre.</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris quis risus ligula. Proin rhoncus felis at ipsum consequat eget commodo libero semper. Morbi sed purus arcu.</p>
</div>
<div id="box_left">
<h3>Sobre o Blog</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="http://demonovoestilo.blogspot.com/p/about-this-blog.html"><img src="images/more.png" class="more" width="68" height="24" alt="mais..." /></a>
</div>
<div id="box_right">
<h3>Trabalhos Recentes</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="http://demonovoestilo.blogspot.com"><img src="images/more.png" class="more" width="68" height="24" alt="mais..." /></a>
</div>
<div id="box_middle">
<h3>Serviços</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="http://demonovoestilo.blogspot.com/p/services.html"><img src="images/more.png" class="more" width="68" height="24" alt="mais..." /></a>
</div>

Repare que as colunas são direcionadas para páginas estáticas e para a principal, quando o leitor clicar em “mais…”. Aí você pode mudar o texto também para “Leia mais..” por exemplo.
Editar Páginas Estáticas:

Para editar as páginas estáticas, você deve clicar na aba “Postagens” e depois “Editar Páginas”
Clicando na opção “Editar” (sobre a miniatura de página) vai abrir a caixa de postagens onde você poderá inserir imagens e textos apropriados. Depois clic em Visualizar e copie o endereço do Browser (navegador do seu computador) . Cole esse endereço nos links relacionados no menu e nas colunas do footer do template.
Ex 1: No menu
Galerias , Retratos, Cidades, Brasil, Viagens, Arte, About me
Ex2: No footer
Serviços, About this blog
Parece um pouco complicado, mas com atenção, paciência e muita vontade, você consegue instalar esse template lindo e ter um blog profissional, com cara de site.
Caso você queira que eu faça as instalações a adequações a sua necessidade, fale comigo pelo Formulário de Contato ou por email e a gente pode combinar. Claro que o serviço será cobrado.

Beijos da Mama

Laranja Rosa – Blogger Template

noreply@blogger.com (MamaNunes) — Mon, 22 Mar 2010 00:46:00 +0000

DEMO ► Veja o template

DOWNLOAD ► Pasta compactada com documento XML e imagens

DOWNLOAD ► Apenas o XML

Eu amo os tons de laranja por isso tive muito prazer em desenvolver esse layout. É um desenho bem feminino que pode ser usado para um blog pessoal. Tem espaço discreto para publicidade (opcional). Sua visualização, com todos os detalhes de bordas e sombras é bem melhor no Firefox.

Propriedades:

Menu de navegação no header (Editável em Elemento de Página)
Destaque para postagem mais recente
Postagens separadas por blocos
Sidebar com uma coluna
Ícones sociais com efeito hover na sidebar
Script para postagens resumidas com thumbnails
Script para artigos relacionados
Três colunas no rodapé
Elementos de página no header e footer

Estrutura do layout

Para mudar os ícones sociais, caso queira troca-los, clic na aba “Editar HTML” e procure pelo trecho abaixo e coloque o endereço da sua imagem no local indicado em vermelho.

#sectionmy .sectionmy2 h2.rss {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/feedSub.png') no-repeat top left;
}

#sectionmy .sectionmy2 h2.email {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/new-mail-sub.png') no-repeat top left;
}

#sectionmy .sectionmy2 h2.twitter {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/_twitter.png') no-repeat top left;
}

#sectionmy .sectionmy2 h2.faceboock {
background:url(http://i9.photobucket.com/albums/a65/mamanunes/_facebook.png) no-repeat top left;
}

Para direcionar o link para sua página, procure em seu HTML o trecho abaixo e faça as alterações.

<h2 class='subscription rss'>
<a href='SEU-URL-RSS-FEED'>Assine este Feed</a></h2>

<h2 class='subscription email'> <a href=' SEU-URL-FEED-EMAIL-SUBSCRIPTION '>Receba novidades via EMAIL</a></h2>

<h2 class='subscription twitter'>
<a href='SEU-URL-TWITTER'>Siga-me no TWITTER</a></h2>

<h2 class='subscription faceboock'>
<a href='SEU-URL-TWITTER'>Siga-me no Faceboock</a></h2>

Se tiver algum problema para instalar, não se acanhe. Escreva pelo formulário de contato ou email e eu terei prazer em ajudar.

Um abraço!

Page Flip Blue – Template com efeito

noreply@blogger.com (MamaNunes) — Sat, 19 Sep 2009 15:41:00 +0000

Esse template tem um efeito interessante com script jQuery e CSS, o “Page Flip” instalado no canto superior direito da página, que dá um charme todo especial ao desenho além de chamar a atenção para a assinatura do Feed Newesletter.

Confira no Blog Demo.

Demo / Download

Propriedades:

Header com Page Flip
Menu de navegação inserido no CSS/HTML
Caixa de busca interna personalizada
Posts resumidos com thumbnails
Blockquote personalizado
Sidebar com 3 colunas
Elementos individuais (widgets)
Script “Scroll to top” (voltar ao topo)

Instalação:

Depois de fazer o download do documento XML para seu computador

Faça login no Blooger
No painel clic em “Layout”
Clic em “Editar HTML”
Faça um back up do blog antigo (se for o caso)
Clic em “Enviar Arquivo”
Clic em “Fazer Upload”
Confirmar e Salvar

Configurações:

Direcionamento - Feed Nwesletter

Em Seu HTML, procure pelo seguinte trecho (use Ctr + F):

<div id='pageflip'>
<a href='SEUENDEREÇOFEED'><img alt='' src='http://i9.photobucket.com/albums/a65/mamanunes/page_flipPeel.png'/></a>

Menu:

Dentro do seu HTML, procure pelo seguinte código (use as teclas Ctr + F)

<ul class='solidblockmenu'>

Abaixo dele, observe o trecho abaixo. edite nos locais indicados: endereço (em verde) e nome do link (em vermelho)

<li> <a href='ENDERECODOSEUBLOG'>Home</a></li>
<li><a class='current' href='ENDEREÇODOLINK'>Contato</a></li>
<li><a href='ENDEREÇODELINK'>Link</a></li>
<li><a href='ENDEREÇODELINK'>Link</a></li>

Se quiser acrescentar mais links, repita o trecho:

<li><a href='ENDEREÇODELINK'>Link</a></li> quantas vezes forem necessárias.

Caixa de busca interna:

Procure pelo código abaixo e escreva o nome do seu blog onde está em vermelho. Ex.: mamatestes1.blogspot.com

<form action='http://SEUBLOG/search' id='searchthis' method='get' style='display: inline;'>

Configurar data de postagem

Em “Configurações” clic na aba “formatação” e em “Formato da data” deixe assim:

Ex.: 18 Setembro 2009

Imagens em PNG para o Page Flip

Você poderá mudar a imagem onde está a mensagem Feed. Procure em seu HTML o seguinte trecho e insira o endereço da sua imagem no campo em vermelho:

#pageflip .msg_block {
width: 70px; height: 70px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(ENDEREÇO DA IMAGEM) no-repeat right top;
}

Abaixo a imagem que está no modelo e ao lado a imagem para customização.

Template Love Cat’s Blue

noreply@blogger.com (MamaNunes) — Fri, 11 Sep 2009 19:46:00 +0000

Template Cute para meninas que gostam de gatos, gatinhos e gatões =)
Propriedades:

Barra de links no topo do template
Gadget fixo HTML/Javascript para textos, ícones, fotos ou vídeos.
Hack “Leia mais…” Script custumizável. Tutorial aqui
Sidebar dividida em 3 colunas
Footer (rodapé) com 3 colunas

Demo / Download

Editar lista de links

Em sua página “Layout” ►“Elementos de página” e no Gadget ► “Lista de Links” clic em “Editar”

Editar mensagem de Boas Vindas, Links Feeds, Twitter e Redes Sociais…

Ícones sociais para download: Six Revision

About Me - Quem é a Mamanunes?

noreply@blogger.com (MamaNunes) — Sun, 02 Aug 2009 17:34:00 +0000

Sou cantora (de carteirinha), trabalhei em produções fonográficas cantando jingles, trilhas e vinhetas. Também cantei com artistas de todo tipo. Passei pela "Jovem Guarda", Bossa Nova, festivais, Rock and Roll (Rita Lee) e Sertanejo (arg odeio). Cantei em festivais, bailes, bares, teatros... cantei demais, viajei e "viajei" demais, corri demais. Hoje sou dona de casa e ainda canto, mas só para Deus , porque gosto e é "outra viajem". Amo a Internet , criação e edição de imagens, códigos html... ainda aprendo isso tudo.

"Inter" "Net" quer dizer "entre redes" e, para mim, croché virtual (hehe). Legal!
Sou casada com o Márcio Nunes, baterista, professor de música, técnico em hardware, meu amor, meu amigo e irmão. Eu sonho, deliro,... ele realiza. Tenho duas filhas, dois genros, dois netos por enquanto, seis gatos e um cachorro (vez em quando).
Felicidade, para mim é todo mundo em volta da mesa comendo pão caseiro que eu e o Márcio fazemos,bolo de frutas com açúcar mascavo, chocolate, bom vinho, e queijo da montanha...
Sofro de "quero-quero" e "ai ai ai profundo".

Desconformo com esse mundo, mas sou feliz com a vida que tenho.
Gosto de brincar de ilha: ser sozinha, cercada de gente por todos os lados.
Brasileria, paulistana, descendente de espanhóis.
Se estou brava, sapateio, rodo a baiana e grito Olé!
Se estou feliz sou a morena da praia
Se estou triste choro mesmo, "adolesço", visto um jeans, camiseta velha e
vou para a praça orar e tomar um suco de melancia.

Hoje sou assim:

Mas já fui assim:

Hoje bem melhor não?
Tenho fé incondicional em Deus.
Procuro viver as boas novas de Cristo, seus ensinamentos, a liberdade e a graça.
Não sou religiosa, sou evangélica. Acredito no tratamento pessoal de Deus para com o homem.
Conheço, admiro e respeito profundamente muitos pastores, homens e mulheres,
com os quais me identifico e aprendo muito.

"Ora, a fé é a certeza das coisas que se esperam,
a convicção de fatos que não se vêem."
*Hebreus 11:1*

Saia Justa - Um template "Charmoso"

noreply@blogger.com (MamaNunes) — Thu, 11 Jun 2009 14:09:00 +0000

Ideal para blogs que falem moda, comportamento, opinião... Um template moderno, simples e funcional.

Demo/Download

IMPORTANTE: Nunca faça mudanças em seu template sem antes fazer um backup (uma cópia) para evitar perder tudo no caso de acidente.

Detalhes do layout:

Menu com ícones e efeito hover (muda a cor ao passar o mouse)Para editar o menu, em seu documento HTML clique em "Expandir modelos de widgets" procure pelo trecho:

<div id="navigation">

Abaixo dele estão os locais indicados para inserir os endereços respectivos.
Veja na imagem (clique para ampliar)

Link para compartilhar postagem no twitter

Abaixo do link para comentários há um ícone Twiter para que os artigos sejam indicados. Muito funcional.

Ícones na sidebar (coluna esquerda)

Ícones personalizados nas divisórias (widgets)

Área de comentários customizada

Ícone exclusivo (Comentários)

Agradecimentos:
Ariane do TNB pelo tutorial "Menu com efeito hover".
Pizcos Blog pelo tutorial "Estilizar comentários"

Black Brown Theme - Layout sóbrio em duas versões

noreply@blogger.com (MamaNunes) — Mon, 25 May 2009 13:40:00 +0000

Tons escuros porém com ótima visualização, bom espaço para publicidade ou direcionamento de link com imagenes 125 X 125 (pixel) muito fácil de editar dentro da página "Layout".

Detalhes:

Menu com ícones para Home, Email, Feed e Twitter
Janela de busca personalizada
Data de post personalizada (Vertical-esquerda)
Resumo de postagens com imagens thumbnail's
Hack "Leia mais.." [...]
Espaço para publicidade editável em "Elemento de Página", 125 x 125 (pixel)
Três colunas no footer
Elemento de página no footer

Versão para mulheres:

Demo/Download

Versão para homens:

Demo/Download

Instruções para instalação:
IMPORTANTE:Antes de qualquer alteração em seu template, faça uma cópia clicando em "Baixar Modelo Completo". Salve para não perder nada em caso de acidente.

Veja AQUI o tutorial detalhado, com imagens, para instalação de templates

Menu:
Para editar o menu no cabeçalho, vá em seu documento HTML e procure pelo trecho:

Coloque os endereços no lugar indicado, com cuidado para não retirar nenhuma vírgula (sinal), senão não funciona. Exemplo na imagem abaixo. Clic para ampliar.

Data:
Para que a data apareça de maneira correta, vá em sua pagina de "Configurações" clic na aba "Formatação" e escolha a opção "Formato de data" 25 Maio 2009. Veja imagem abaixo:

Bloco para publicidade:
Vá em sua página "Layout" e clic "Imagens/Editar". Na janela que vai aparecer "Configurar Imagem", escolha imagem do "Arquivo" ou "Da web" e coloque o endereço "Link". Veja imagem abaixo;
Fontes e cores:
Opção de cores e fontes para o Cabeçalho, texto da postagem, links etc. Veja imagem abaixo.

Crédito:
Imagem digital no header (cabeçalho), detalhe do desenho "Spiral" e "Head", ambas de Kazuhiko Nakamura. Adaptada ao layout em PhotoFiltre Studio.
Ícones exclusivos Mamanunes Templates.

Red Dark Theme – Inspirado em tema Wordpress

noreply@blogger.com (MamaNunes) — Sat, 09 May 2009 10:01:00 +0000

Demo/Download

Template com ampla área de postagem e mais:

Postagens resumidas na página inicial (recurso “Leia mais”)
Imagens reduzidas da página inicial, thumbnail’s
Barra de links (linkbar) no cabeçalho
Menu para rede social na coluna da direita (sidebar).

Obs.: Caso queria modificar o tamanho dos thumbnail's e o número de caracteres (letras),do post reduzido, leia esse tutorial.

IMPORTANTE! Antes de fazer qualquer mudança ou alteração em seu template, faça uma cópia. Tutorial aqui.

Editar a barra de links(linkbar).

Faça o login, clic na oção "Layout". Na página "Layout" clic na opção "Editar |HTML".
Dentro de seu documento HTML, procure pelo seguinte trecho (use Ctrl+f para localizar):

<div id=’foxmenucontainer’>
<div id=’foxmenu’>
<ul>

<li class=’current’><a href=’ENDEREÇO DO LINK ’> Home</a></li>

Em todos os trechos onde se lê ‘ENDEREÇO DO LINK’ coloque os endereços para onde você quer direcionar seus leitores. *

clic na imagem para ampliar

Edite Sidebar (coluna da direita), ícones sociais.

Dentro de seu documento HTML, procure pelo seguinte trecho:

<div class=’rightcolum’>

<div class=’rss’>
<a href=’ SEU ENDEREÇO FEED ‘><imag alt=’subscribe’ src=’http://i9.photobucket.com/álbuns/a65/mamanunes/rss=32x32.png’ style=’vertical-align:midle’> </a>

Obs.: O trecho em vermelho é o endereço do ícone.

clic para ampliar.

Caso queira mais informações ou encomendar um template personalizado, utilize o formulário de contato .

Colocar Templates - Passo a Passo

noreply@blogger.com (MamaNunes) — Thu, 07 May 2009 14:30:00 +0000

Vamos aprender em oito passos, como instalar os templates.

Crie uma pasta para guardar todos os seus documentos, imagens, gadgets, enfim tudo o que usará em seu blog.
Depois de escolher o modelo, faça o download do documento XML e guarde na pasta ...

Siga os passos abaixo consultando as imagens

Primeiro passo - Faça o login

Segundo passo - Clic em "Layout"ou "Modelo"

Terceiro passo - Na página "Layout", clic em "Editar Html"

Quarto passo - IMPORTANTE! Faça um backup (uma cópia) do template atual clicando onde está escrito em azul "Baixar Modelo Completo". Salve na pastinha do blog, assim, se houver algum problema, você não perde tudo o que tinha..

Quinto passo - Clic em "Arquivo" e procure o documento XML do template que quer instalar.

Sexto passo - Clic em "Fazer Upload"

Sétimo passo _ No final da página, clic "Visualizar".

Oitavo passo - Se e stiver tudo bem "Salvar Modelo"

Se tiver dúvidas, não se acanhe. Faça suas perguntas, mande-me um email ou utilize o formulário de contato

Boa sorte!

Template Clock In The Wall

noreply@blogger.com (MamaNunes) — Mon, 16 Mar 2009 16:14:00 +0000

Demo / Download

A novidade é o relógio online no Header (Cabeçalho), inserido diretamente no código html do template.que pode ser tocado por outro modelo e configurado de acordo sua hora local (Cidade, País).

Detalhes do Template:

Relógio On-line Custumizável
Caixa de Pesquisa personalizada
Menu horizontal
Hack "Leia mais"
Resumo de postagens com imagens (thumbnail's)
Caixa de Comentários personalizada
Header com 3 divisões
Sidebar com 3 divisões
3 colunas no Rodapé (Footer)
Elementos de página no Rodapé Footer

Modelo de comentários (clic para ampliar)

Para editar o menu, siga as instruções na imagem abaixo (clic para ampliar).

Agora vamos ver os modelos de relógios super interessantes oferecidos pelo site Clock Link

Esses são apenas alguns modelos "Analog", ainda há modelos digitais, animados, com animais, esportivos, transparentes (só aparecem os ponteiros), enfim uma enorme quantidade de reloginhos lindos.
Veja como pegar o código HTML

Clic no relógio escolhido.
Clic "View HTML tag"
Vai abrir uma página com termos de uso, clic "Accept"

Escolha a cor
Defina a hora local
Tamanho que desejar
Copie o código (Script)

Dica: Cole o Script num bloco de notas e salve em seu computador.

Agora vamos inserir o script que você copiou, direto no html no seu template. Faça o seguinte:

Faça o Login no Blogger

No painel, escolha opção "Layout"

Clic na aba "Editar HTML"

Clic em "Baixar modelo Completo" e salve uma cópia do seu template numa pasta como segurança para o caso de algum acidente.

Procure pelo trecho abaixo. (código do relógio usado neste modelo).

<script src='http://www.clocklink.com/embed.js'/><script language='JavaScript' type='text/javascript'>obj=newObject;obj.clockfile=amp;quot0010red.swf";obj.TimeZone="BRST";obj.width=250 obj.height=250obj.wmode="transparent"showCloc(obj);</script>

Troque todo o trecho pelo código (script) do relógio que você escolheu.
Clic em "Visualizar"
Se estiver tudo bem clic em "Salvar modelo"

Menina Jeans

noreply@blogger.com (MamaNunes) — Mon, 17 Nov 2008 18:13:00 +0000

Menina Jeans, atualizado em Maio/2009. Um template simples e funcional com postagens resumidas ("Leia mais...") e imagens tumbnail's na página principal, barra de links na Sidebar e widget no rodapé do blog.
IMPORTANTE: Não deixe de fazer um backup do seu atual modelo antes de mudar o template. Siga o Passo a passo para instalação AQUI.

Demo/ Download

Header (Cabeçalho)

Pegue aqui a imagem principal e salve em seu computador. Depois, faça login no Blogger e acesse a página "Layout" , faça upload seguindo o exemplo abaixo (clic para ampliar).

Para editar os links da sidebar (barra lateral) , faça o login, clic em "Layout", depois "Editar HTML" e procure o seguinte trecho:

<div id='navigation'>

Essa é a área onde você vai inserir os endereço (links). Observe a imagem abaixo. Muita atenção para não retirar aspas " nem "< " ">" senão não funciona.

Template Costumizável

noreply@blogger.com (MamaNunes) — Thu, 16 Oct 2008 22:36:00 +0000

DOWNLOAD AQUÍ

A maioria dos templates oferecidos na blogosfera lindos, grandes, claros, sem muito "frufru". Eu gosto muito mas, assim como eu, muita gente tem dificuldade com códigos, scripts, etc.. Então fiz esse template simplezinho , com imagem que pode ser substituída por outra, desde que que se respeite o tamanho (medidas ). O template acima, por exemplo, tem uma imagem (cabeçalho) tamanho 800 x 200 px.

(clique para vizualizar imagem original)

Você pode escolher, redimencionar ou recortar uma imagem ou foto em qualquer editor tipo PhotoShop, PSP, Photofiltre, etc... e então substituir pela imagem do cabeçalho.

Outras mudanças poderão ser feitas dentro do "layout" do seu blog, tipo:
letras, (cor, tamanho e tipo ), cor dos links, etc...

Salve a imagem em seu computador ou em algum site de hospedagem, ex: Photobucket, Imageshack) e siga os seguintes passos:

Login=>Painel => Layout => Editar

Quando clicar em "editar" vai aperecer essa outra janela

Insira a imagem direto do seu computador ou do endereço da imagem hospedada, "http://................."

Obs.: Não utilize imagens sem autorização e sempre coloque os devidos créditos em lugar visível.

Para mudar a cor do fundo (background)

1- Faça o login e clique em "Layout"

2- Clique "Editar html"

3- Dentro do HTML porcure o seguinte trecho:

body {

background: #000000;

O que está em verde (exemplo) é a cor de fundo.

Neste site você encontra os códigos de todas as cores que imaginar. É só escolher, copiar o código e colar no lugar de #000000;
NÃO RETIRE O " ; " . SEM O PONTO E VÍRGULA O CÓDIGO NÃO FUNCIONA.

_LEMBRANDO__________

Caso não goste da barra de navegação do Blogger (aquela que vai acima do template), veja AQUÍ como retirá-la.

Outras mudanças poderão ser feitas dentro do "layout" do seu blog, tipo:

letras, (cor, tamanho e tipo ), cor dos links, etc...

Tente, é divertido e vale a pena personalizar sua página.

beijos

Templates sem complicação

noreply@blogger.com (MamaNunes) — Mon, 17 Dec 2007 23:47:00 +0000

Esses modelos são bem fáceis de personalisar. Você poderá fazer alterações, lembrando-se sempre de não apagar os créditos NUNCA!
Minha teatcher, aquí=> Ariane , ensina direitinho como fazer mudanças e dá ótimas dicas, além de ter templates lindos. Vale a pena conferir.

FAZENDO LIMONADA

DOWNLOAD AQUÍ

KIWIRANJA

DOWNLOAD AQUÍ

VASO CRISTAL

DOWNLOAD AQUÍ

FLORINHA

DOWNLOAD AQUI

BRINCO DE PRINCESA

DOWNLOAD AQUÍ

Visite a GALERIA e veja outros modelos.

BOA BLOGAÇÃO!!!

Templates serie "Fantasia"

noreply@blogger.com (MamaNunes) — Fri, 30 Nov 2007 14:57:00 +0000

DOWNLOAD AQUI

Template Passarinho

noreply@blogger.com (MamaNunes) — Tue, 20 Nov 2007 21:29:00 +0000

TEMPLATE "PASSARINHO"

DOWNLOAD

Template Pomba

noreply@blogger.com (MamaNunes) — Tue, 16 Oct 2007 21:22:00 +0000

DOWNLOAD

Clic na imagem para visualizar tamanho natural.

Leia as instruções em "COLOCANDO O TEMPLATE" na coluna ao lado.

Se possível, coloque a caixinha linke-me em seu blog.

Obrigada.

Template Mimo

noreply@blogger.com (MamaNunes) — Sun, 07 Oct 2007 15:05:00 +0000

DOWNLOAD

Clic na imagem para visualizar tamanho natural.
Leia as instruções em "COLOCANDO O TEMPLATE" na coluna ao lado.
Se possível, coloque a caixinha linke-me em seu blog.
Obrigada.

Template Águia

noreply@blogger.com (MamaNunes) — Sat, 06 Oct 2007 13:06:00 +0000

DOWNLOAD

Clic na imagem para visualizar tamanho natural.

Leia as instruções em "COLOCANDO O TEMPLATE" na coluna ao lado.

Se possível, coloque a caixinha linke-me em seu blog.

Obrigada.