Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Criação de Blogs Profissionais e Redes Sociais.

Templates Free Vanessa S.

Template Personal Web Card

Template Personal Web Card – 1 Coluna :

Template Personal Web Card

Demo Download Licença Termos de Uso
Informações sobre este template:
Este Template foi desenvolvido por Vanessa S.
Há um tempo atrás eu criei um Personal Web Card para o meu uso, e agora resolvi disponibiliza-lo para download gratuito, porém, fiz algumas adaptações nele para que ele possa ser usado por qualquer usuário.

Este template possui uma característica bem diferente e é ideal para servir como página pessoal, ou para criar um cartão de apresentação online.
Nele você pode incluir o gadget “perfil”, ou um resumo sobre você, para que seus leitores conheçam melhor a pessoa que está por trás dos textos, podendo incluir informações adicionais sobre você e seu blog.
Se você trabalha com prestações de serviços, por exemplo, pode incluir links para seus últimos trabalhos e ainda pode incluir links para seus perfis nas principais redes sociais as quais você participa.

O Template Personal Web Card não foi projetado para publicações de postagens, e não é muito personalizável, se você alterar as imagens que compõem o template ele perderá completamente o layout, portanto, se você procura um template para fazer muitas modificações, ou para publicar postagens, eu não aconselho o uso deste template.

Características do template:
• Designer Clean
• 1 Coluna
• Menu em abas
O efeito das abas no menu só foi possível graças ao script desenvolvido por Abu Farhan
Efeito Sombra nos textos com CSS3
Bordas Arredondadas nos títulos do menu
Uso de CSS3, compatível com qualquer navegador, nas versões mais recentes, com exceção do IE, que não suporta CSS3.
Os efeitos CSS3: sombra nos textos e bordas arredondadas, não serão visualizados no IE.

Estão incluidos na pasta de download:
– Arquivo XML.
– Leia-me.

 

Caso não saiba como trocar de template, confira o Video Tutorial que ensina passo a passo Como Trocar o template no blogger e veja como proceder.

Para o funcionamento correto deste template, é necessário que você siga os seguintes passo:

Incluir a aba de Redes Sociais:

Vá na aba “designer” >> “Elementos de página” >> “Adicionar gadget”, escolha a opção “html/javascript”.
Coloque o título que você preferir (Redes Sociais, Network, Socials etc).
Cole o seguinte código, fazendo as edições no locais destacados, para acrescentar os links e os ícones de cada rede social.

<div id="network">
<ul>
<li><a href="LINK-DO-BLOG"><img src="URL-ICONE-BLOGGER" /><strong>Blog</strong></a></li>
<li><a href="LINK-TWITTER" target="_blank"><img src="URL-ICONE-TWITTER" /><strong>Twitter</strong></a></li>

<li><a href="LINK-FACEBOOK" target="_blank"><img src="URL-ICONE-FACEBOOK" /><strong>Facebook</strong></a></li>

<li><a href="LINK-FEED" target="_blank"><img src="URL-ICONE-FEED" /><strong>Feeds</strong></a></li>

<li><a href="LINK-YOUTUBE" target="_blank"><img src="URL-ICONE-YOUTUBE" /><strong>Youtube</strong></a></li>

<li><a href="LINK-GOOGLE BUZZ" target="_blank"><img src="URL-ICONE-GOOGLE-BUZZ" /><strong>Google Buzz</strong></a></li>

<li><a href="LINK-MYSPACE" target="_blank"><img src="URL-ICONE-MYSPACE" /><strong>Myspace</strong></a></li>

<li><a href="LINK-PICASAWEB" target="_blank"><img src="PICASA" /><strong>Picasa</strong></a></li>

<li><a href="LINK-BLOGSBLOGS" target="_blank"><img src="URL-ICONE-BLOGSBLOGS" /><strong>BlogsBlogs</strong></a></li>

<li><a href="LINK-FORMSPRING" target="_blank"><img src="URL-ICONE-FORMSPRING" /><strong>FormSpring</strong></a></li>

<li><a href="LINK-LASTFM" target="_blank"><img src="URL-ICONE-LASTFM" /><strong>Last fm</strong></a></li>

<li><a href="LINK-ORKUT" target="_blank"><img src="URL-ICONE-ORKUT" /><strong>Orkut</strong></a></li>

<li><a href="LINK-FLICKR" target="_blank"><img src="URL-ICONE-FLICKR" /><strong>Flickr</strong></a></li>

<li><a href="LINK-LINKEDIN" target="_blank"><img src="URL-ICONE-LINKEDIN" /><strong>Linkedin</strong></a></li>
</ul>
<div class="clear"/>
</div></div>

Confira algumas sugestões de ícones para download gratuito:
Pacote de Icones para Redes Sociais
Icones de Redes Sociais Variados

Se você quiser retirar alguma rede social que consta no código, basta apagar o código correspondente a ela. E se quiser acrescentar mais alguma, basta repetir o código a partir de <li> até </li> e faça as inclusões necessárias.

Incluir a aba “Sobre”

1) Você pode utilizar o gadget “perfil” do próprio Blogger.
Vá no menu “layout” >> “Adicionar gadget”, escolha a opção “Perfil”.
Altere o título para “Sobre”.
Atenção: Se o seu perfil estiver indisponível (não compartilhado), se você não compartilhar seu perfil, ele não será exibido.
Sugiro que você marque a opção “Compartilhar meu perfil” se quiser que as informações sejam exibidas.

2) Se não quiser exibir a descrição que consta no perfil, você pode optar por criar uma pequena apresentação (biografia) em forma de texto e inclui-la diretamente na aba.
Basta escolher a opção “html/javascript”, em “adicionar gadget” e escrever o texto da sua biografia.

[alerta]Importante:
O menu suporta no máximo 4 abas, não insira mais do que isso, caso contrário ficará desconfigurado. Procure usar títulos curtos no Menu.
Para adicionar mais abas ao menu, basta inseri-las através da aba “design” >> “Elementos de página” >> “Adicionar gadget” e escolha o gadget que você quiser.[/alerta]

Se quiser alterar a imagem de background, procure por:

http://4.bp.blogspot.com/_3eh_nW6DoIE/TLMnOHSaHEI/AAAAAAAABXY/H49zIZnr-BQ/s1600/bg-bublle.jpg

Crie ou escolha a sua imagem, hospede-a no seu servidor preferido (eu recomendo o Picasa), copie o endereço desta imagem e substitua a url da imagem acima, pela url da sua imagem.

Atenção:
– Não ofereço qualquer tipo de suporte para editar, refazer ou modificar, a seu gosto, o template aqui disponível;
– Caso queira realizar modificações na estrutura, nas imagens do template ou instalar recursos, que não estejam descritos neste tutorial, pesquise como fazer.
– Quaisquer modificações nos recursos instalados, é por sua conta e risco;
– É indispensável que ao instalá-lo você leia atentamente as instruções e os termos de uso, e que respeite os direitos autorais da criação deste template.
– É permitido modificação no template, você poderá alterar ou incluir recursos por sua conta própria, mas os créditos de autoria original devem ser sempre mantidos, em qualquer caso.

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Sobre o autor | Website

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Desculpe, os comentários deste artigo estão encerrados.

24 Comentários

  1. #Alemão disse:

    Esta com problemas esse template, teria como arrumar?

  2. Luis Fernando disse:

    Será que posso tirar o código do rodapé e deixar no HTML?

  3. Italo Eduardo disse:

    parabéns lek, template simples mais com uma mega tecnologia, servira como uma luva pra mim, Obrigado ^^

  4. Eduardo Felipe disse:

    A cada dia mais, eu adoro o MB.
    CLAAAAU, VAAALEU PELO TEMPLATE,
    tu é diva, er/

  5. Sybylla disse:

    Olá, Clau!

    Puxa, eu adoro seu site, não só pelas dicas mas como pelo visual. Eu estive "namorando" rsrs esse template do Web Card e quando vi disponível para utilização eu criei uma outra página, instalei e customizei. Ficou muito show, facilita o acesso e as vizualiações. Deixei o meu num estilo meio retrô, porque meu blog é todo preto, azul e branco (porque fala de ficção científia) mas eu sou menina, e queria uma coisa personalizada para mim… rs

    Parabéns por todas as dicas e pelas explicações. Em muitos lugares elas são complicadas e aqui dá para entender super bem. E vc tem o toque feminino que em outros sites não existe!

    Abç!

  6. .:: Clau ::. disse:

    Thiago
    Depois eu vou olhar com calma e tentar ver o que ocorreu..eu ainda estou viajando 😉
    valeu pelo toque.

  7. Thiago disse:

    Oi Clau…
    Eu gostei muito desse template…

    Mas ele apresentou um Bug [que nao sei corrigir] no meu IEca.

    Queria saber se é só no meu mesmo que apresentou esse bug, e se alguém sabe como corrigílo.

    Fiz dois screenshots pra relatar o bug..

    Um com o seu Personal Web Card que está funcionando corretamente, e um com o Template disponível.
    Abraços Clau 😀

  8. Nerd Flanders disse:

    Lindo o template, adorei!

  9. Silvana disse:

    Poxa muito legal teu blog q ajuda o pessoal no blogger
    eu quero fazer um mas nao quero ele a cara de algum outro entende…to pegando as dicas q vc loca no site pra moldar ao meu.
    Obrigada e continue assim que vc esta ajudando muita gente.

    @silvanagar

  10. .:: Clau ::. disse:

    Escolas de Surf,
    ?? Mel ? mendes?

    Eu quem agradeço pela presença e pelos comentários de vcs gente *_*

  11. ?? Mel ? mendes? ? ? disse:

    Caramba,Clau…Sem palavras,é um arraso,nem dá pra dizer o quanto eu aprendo contigo!Mas eu tenho que deixar meu agradecimento,você é tudo de bom na Blogosfera!

  12. Escolas de Surf disse:

    Parabéns. Lindo trabalho.
    Obrigado 😉

  13. .:: Clau ::. disse:

    Gustavo
    Desculpa o inconveniente do comentário enorme acima do seu, mas tem horas q não dá,né?rs
    Muito obrigada por ajudar a divulgar o template, fico feliz q vc tenha gostado. Muito bom ver vc por aqui =D

  14. Lukas disse:

    Isto mesmo,eu assumo e exclui o blog.
    E desculpe pelo comentàrio só o que você disse nos termos de uso,sò achei que era à mim.

    E a respeito do blog,eu exclui ele,atè porquê mesmo,eu larguei ele faz tempo,mas sò depois de 90 dias que ele è excluìdo agora que excluiu.

    Escrevo agora meus pròprios artigos,e espero que você não me interprete mal pela minha burrada em copiar seus artigos,mudei sim,eu tambèm me sentia culpado por copiar mas de qualquer jeito queria ter um blog mas,não sabia o que publicar,até que eu começei a conhecer os còdigos e as propriedades lendo seus artigos,e agora pretendo escrever o que eu sei sobmeus conhecimentos como você diz.
    Perdão pela incoveniência.

    Obrigado pelo seu tempo.

  15. querocriarumblog.com.br disse:

    Clau,
    belo trabalho, aliás, normal vindo de você.
    parabéns!
    Divulguei no Quero Criar um Blog.
    abraço.

  16. .:: Clau ::. disse:

    Lukas
    Primeiramente devo esclarecer que a área de comentários do MB não é palco para discussões e nem é "tanque para se lavar roupa suja", mas tendo em vista seu comentário, necessário se faz o uso de uma exceção para fins de esclarecimentos.
    Respondendo a seu comentário: pelo q vi o comentário deixado pelo Max Martins não contém xingamento algum e nem tampouco ofensa pessoal, até pq os termos usados por ele foram: "kibadores" e "cara de pau". E que eu saiba Kibador é um termo utilizado na internet, sinônimo de "Plagiador" ,termo utilizado juridicamente para pessoas que infringem os direitos autorais de outrem, que por sinal, este ato é considerado Crime, previsto em nossa legislação penal.
    Pelo que constatei, no comentário supracitado, de autoria do Max Martins, ele não citou o seu nome e nem citou o nome de ninguém.
    Vc se sentiu ofendido pq? Tem seu nome citado no comentário dele?
    Já que vc citou o termo OFENSA que tal analisarmos os fatos para verificar quem realmente foi ofendido aqui?
    1. Uma pessoa que tem a boa vontade em responder comentários diários com dúvidas de um leitor, achando que está ajudando este leitor, mas na verdade este leitor está simplesmente fazendo essa pessoa de "idiota" qdo fica publicando dúvidas e pedidos de ajuda, mas na verdade esse leitor estava COPIANDO/PLAGIANDO todos os artigos publicados pela autora do blog, aquela a qual sempre atendia e respondia os pedidos de ajuda desse leitor.
    Quem realmente foi ofendido nesse caso Lukas?
    2. Vc, ou eu que fui descaradamente plagiada por vc, que até o momento tive a boa vontade em responder a todos os seus pedidos de ajuda, pois pensei q vc realmente estava agindo de boa fé?
    E não adianta vc negar os plágios, pq tenho testemunhas (e vc sabe muito bem disso) e provas do ato ilícito, do conteúdo plagiado q vc mantinha publicado no gerenciandoblogger, blog criado por vc q agora está fora do ar!
    Mesmo qdo eu descobri q vc estava me plagiando, em momento algum me dirigi a vc de maneira ofensiva ou rude..ao contrário..continuei aceitando seus comentários, pois queria exatamente ver até onde vc teria a capacidade de chegar.
    Me responda, quem realemnte foi ofendido neste caso Lukas?
    Eu espero muitíssimo que vc tenha se conscientizado do erro grotesco q vc cometeu, ou melhor dizendo: da infração que vc cometeu, e que não cometa mais, pq plagio meu caro: é crime!
    Apesar de tudo isso, eu desejo q vc aprenda e cresça e q não cometa mais esse tipo de infração, pois eu não te desejo o mal,ao contrário, espero que vc se conscientize e pare de achar q as pessoas são idiotas, ou cegas, pare de abusar da boa vontade e da boa fé de quem só quis te ajudar, e principalmente, pare de achar q na internet existe impunidade…isso é muito feio!
    Reflita!

    Sem mais,

  17. Lukas disse:

    Sabe Clau,estava pensando em fazer um template com você,mas não faço mais.Desculpe a incoveniência e as palavras,mas nossos seus termos você deixou bem claro: 'Contiver palavrões, xingamentos, ofensas pessoais a autora deste blog ou a qualquer pessoa; E ainda publica comentàrios de pessoas que xingam as outras de cara de pau,não sei se por acaso foi eu,mas fiquei ofendido com estas palavras,e desculpe mais uma vez,sò não concordo com esta ação.

    E porquê estou dizendo isso?

    Não tenho nada contra você,sò que você citou nos seus termos de uso,que não ia publicar comentàrios com ofensas etc e publicou.

  18. ? Jão Bless ? disse:

    Muito Bom Clau
    AdoroOoo Esse Site
    é viciante… rsrsrs…
    Forte Abraço !!!

  19. .:: Clau ::. disse:

    Felipe,
    Annekira

    Obrigada 😉

    mundodadanca1
    Sim, foi exatamente isso q eu fiz. Só que no meu caso, como eu tenho domínio próprio, eu criei um outro blog, instalei o template nele e criei um subdomínio para este blog que está o meu web card. Vc pode criar um novo blog, e instalar este template nele e incluir um link no menu ou na sidebar do seu blog principal.

    Max
    É, ele ficou leve e clean, né? Q bom que gostou..
    Tu vê!! Mas como diz o ditado popular: "as vezes é bom se fazer de morto, pra "comer" o coveiro". =P

  20. Max Martins disse:

    Clau,

    E os kibadores ainda agradecem.
    É lamentável a cara-de-pau.

    Abraços

  21. Max Martins disse:

    Clau,

    Ficou muito limpo mesmo. E, melhor, navegação simplificada pra quem visita. Gostei do efeito de auto-ajuste do conteúdo quando passamos entre os itens do menu. Muito bacana!

    Excelente trabalho! Parabéns =)

    Abraços

  22. mundodadanca1 disse:

    Olá Clau!
    Muito interessante esse web card. Para instala-lo devo ter uma outra url do blogspot e linkar para meu blog? Pelo que percebi no seu web card, foi isso que você fez.
    Aproveitarei ao máximo essa ótima idéia.

    Abraço
    Roger Dance

  23. AnneKira disse:

    Gostei da idéia *_*
    Muito bom trabalho Clau!!

  24. Felipe Correia disse:

    nem gostei do header!
    mais é legal!

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.