Tutorial: Blogroll com imagens

23 de set de 2014
Oi pessoal! Recentemente, em um dos grupos do Facebook que participo (Coisas de Blogueiras) surgiu uma dúvida sobre o blogroll de algumas blogueiras. As meninas queriam saber como que elas fazem para os banners ficarem com tamanho padrão como na imagem acima. Então eu decidi postar aqui no blog como que faz esse Blogroll dos sonhos haha Obs.: Nesse tutorial eu utilizarei o Photoshop.

Passo 1: Tire print do blog de sua preferência. Eu vou utilizar o meu mesmo, só como exemplo.

Passo 2: Com o Crop Tool (atalho C) selecione todo o header e dê Enter.

Após dar Enter a imagem ficará assim
Passo 3: Agora vá em Image » Canvas size (atalho Alt+Ctrl+C). Agora nós estamos vendo o tamanho da imagem. No meu blog, eu utilizo banner de 120x60px, ou seja, a altura é a metade da largura. Então, temos que ter medidas proporcionais. A altura está 411px, então vou colocar largura de 822px e clicar em ok.
Canvas size

Após alterar a largura para 822px e clicar em ok

Passo 4: A imagem, no meu caso, ficou um pouco cortada, então eu vou ajustá-la. Vá em Image » Image size (atalho Alt+Ctrl+I) e coloque width: 120px e height: 60px e clique em ok!
Após o ajuste
Após o redimensionamento

Resultado
Agora é só salvar, fazer o upload e ser feliz rsrs Espero que tenham gostado do tutorial! Conta aí nos comentários qual o próximo tutorial que você quer que eu faça. Beijos
13 comentários:
  1. Muito bacana Carla!
    Adoro aprender coisa nova... ainda mais quando pode me ajudar com o blog!

    Um grande beijo!

    http://renatavernisi.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada Renata! Fico feliz em ajudar, tbm adoro aprender coisas novas rsrs
      Beijo

      Excluir
  2. Carlinha!! lindo de morreeer seu blog!! Já passei por aqui antes mas não lembro se comentei!!! qual photoshop vc usa? adorei seu tutorial!! não tenho blog roll mas vou usar para outra coisa no meu blog!!!!
    Mil beeijos amada!! acho vc tão fooofa e meiga!!!
    www.minicharmedodia.com.br

    ResponderExcluir
    Respostas
    1. Oii Katyucia só tenho que dizer que o seu comentário fez o meu dia muito mais feliz rsrs Eu uso o Photoshop CS5, fico feliz que o tutorial foi útil pra você.
      Mill beijos pra vc tbm! Obrigada mesmo ♥

      Excluir
  3. Já estou usando esse tutorial para fazer meu blogroll. Hahhaha
    Você ensinou super bem e de uma forma muito simples, parabéns. E o seu blog é lindo *-*

    Beijos
    www.blogmeuniverso.wordpress.com

    ResponderExcluir
    Respostas
    1. Fico feliz que os leitores usem os tutoriais ♥
      Obrigada Amanda!
      Beijos

      Excluir
  4. E eu me matando rs assim fica mais fácil! Valeu pelo tutorial!

    www.universopraticofeminino.com

    ResponderExcluir
  5. Anônimo26.4.15

    Ei, flor no teu blogroll quando clica na imagem vai direto pro blog, isso tu não explicou como fazer nos pos. Fiz já todos meus baners e add na página mas, queria que ao clicar redirecionasse ao blog. Pode me dizer o que fazer, por favor ? Obrigada desde já bjs

    ResponderExcluir
    Respostas
    1. Obrigada pela dica anônimo, vou atualizar o post. O código é esse:

      <*a href="linkdoblog" target="_blank"><*img src="linkdamimagem">


      ps.: retire as *

      Beijos e desculpa haha

      Excluir
    2. Anônimo2.5.15

      Oi, flor obrigada por responder, só mais uma coisinha onde exatamente eu add o código ? <3

      Excluir
    3. Você pode colocar na sidebar, crie um widget HTML/JAVASCRIPT e insira o código ou pode criar uma página e, editando em HTML, utilizar o código! Beijos

      Excluir
  6. Sempre via isso em outros blogs e pensava "nossa como é difícil" com esse tutorial aprendi rapidinho hahaha. Amei <3


    labiosconfusos.blogspot.com.br

    ResponderExcluir

 
Todos os direitos reservados © - Tecnologia do Blogger Layout e desenvolvimento por Carla Vieira · Ilustração por Laura Melo