Como fazer botões personalizados para um blog

Escrito por maude coffey | Traduzido por randhal wendel
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como fazer botões personalizados para um blog
Personalize os botões do seu blog para atrair e envolver os usuários (blog image by dinostock from Fotolia.com)

Os sites que hospedam blogs, como o Blogger e o Wordpress, permitem aos usuários personalizar suas páginas com temas, cores e botões personalizados. As empresas e os indivíduos criam blogs para anunciar um produto, dar dicas de especialistas, capturar memórias de acontecimentos da vida ou relatar seus pensamentos e ideais, problemas e sucessos. Colocar um botão de contato nas barras laterais do layout do blog permite aos leitores contatar o proprietário do blog ou o site de uma empresa. Produzir um botão personalizado aproxima o blog e seus leitores e abre as linhas de comunicação e publicidade gratuita adicional.

Nível de dificuldade:
Moderado

Outras pessoas estão lendo

O que você precisa?

  • Computador
  • Internet
  • Programa de edição de imagens
  • Website de hospedagem de imagens
  • E-mail

Lista completaMinimizar

Instruções

  1. 1

    Escolha uma imagem para o botão do blog. Para um botão de e-mail, uma imagem de envelope funciona bem. Para um blog de ​​negócios, usar um botão com o seu logotipo juntamente com o texto "fale conosco" é ideal. Leve em consideração a cor de fundo do blog a fim de que o botão não se misture e a imagem se destaque. Carregue a imagem em um programa de edição de foto, como o Infranview ou o Photoshop.

  2. 2

    Redimensione a imagem para 125 pixels x 125 pixels. Carregue a imagem redimensionada para um site de hospedagem de fotos, como o Flickr ou o Photobucket. Clique com o botão direito do mouse na imagem e copie a URL (endereço) da imagem. Cole a URL em um documento para salvá-la.

  3. 3

    Use este código HTML para adicionar o botão: <a href=" "><img src=" "/></a>. Para um botão de contato por e-mail, coloque "mailto:" seguido de um endereço de e-mail completo entre o primeiro conjunto de citações no código HTML. O código deve ficar assim: <a href="mailto:yourname@emailhost.com "><img src=" "/></a> depois de inserir o endereço de e-mail. Para um botão de link, coloque o endereço da web completo entre o primeiro conjunto de citações, como <a href="http://www.yourbusinesswebsite.com "><img src=" "/></a>.

  4. 4

    Adicione as propriedades da imagem ao código HTML. Cole-as entre o segundo conjunto de citações. O código HTML agora ficará assim: <a href="mailto:yourname@emailhost.com "><img src="http://img1.photohostingsite.com/img00/1111/yourbutton.jpg"/></a>. Os números e outras informações em propriedades da imagem são diferentes para cada foto hospedada, então sua informação será diferente das propriedades mostradas aqui.

  5. 5

    Copie e cole o código completo no layout de um blog. Coloque um asterisco no final do código, se enviar o botão por e-mail a um amigo ou cliente, para evitar que o código se converta em botão. Adicione uma nota ao destinatário de e-mail para remover o asterisco antes de colar em um blog.

Dicas & Advertências

  • Sempre teste o botão online para garantir que o código seja preenchido corretamente e esteja funcionando antes de colocar em um blog.
  • Ofereça-se para trocar botões com outros blogueiros a fim de aumentar o tráfego para seu blog.
  • Não hospede a imagem em um site temporário ou seu blog poderá ter um link quebrado.
  • Nunca infrinja direitos autorais usando uma imagem que não seja sua ou usada com permissão.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível