Tutorial - Imagem ao Lado do Texto no gadget


Olá amigas -sqn
Me desculpem por não postar nesses dias todos,uma falta de posts danada aqui né? parou um pouco porquê eu tenho portado em blogs também tipo o birthday cake,eu tenho que estar sempre por lá também,e por aqui claro,me emocionei bastante com 6 comentários no post de menu blow e facebook deslizante , a postagem foi da minha postadora claro,eu tinha falado pra ela postar porquê tava muito PARADO esse blog aqui,enfim. 

Indo para o ponto principal da postagem, vim postar o tutorial de como deixar a imagem ao lado do texto, que nem o primeiro gadget aqui no blog, desse jeito. É algo bem básico, em uma das opções não precisa-se mexer no HTML do blog, somente precisa colar um código bem pequeninho no gadget que preferir, e na outra precisa-se. Mas não se preocupem, vou deixar com vocês os dois para escolherem o melhor. Mas para quem já é experiente, pode fazer os dois, depende da vontade. Vamos logo ao tutorial, antes que eu perca muito tempo, como sempre.

Créditos;kawaii world

1º modo - Esse modo é o que usamos somente o gadget, ou seja, o mais fácil. Então crie um novo de HTML, ou edite algum que já exista, e cole o código do blockquote. E não se preocupe, explicarei tudo que for preciso para que tudo saia certo e também, que fique bonito:

<img src="url do seu icon" align="left" style="border: 2px solid #000;" />


Em url do seu icon, coloque exatamente o que eu peço, o link da sua imagem/avatar. Eu faço no tamanho 64x64, pois não ocupa muito espaço se o texto for grande, mas isso depende de vocês e da forma que vão escrever ou etc.


Troque left por right, se quiser que sua imagem fique no lado direito do gadget, mas se preferir ele no lado esquerdo, não edite nada.


Agora só falta editar uma coisinha: border: 2px solid #000; - 2px é o tamanho da borda, aumente ou diminua; Solid é o estilo de borda, e se você não sabe outro, veja alguns nessa imagem; #000 é a cor da borda, mude isso pelo código da sua cor.
Depois é só escrever depois do fim desse código, normalmente.


2º modo - Nesse modo, você usará o HTML e o gadget, que dependendo da situação, deixa mais bonito que o do modo 1. Então, abra um gadget e cole o código abaixo:

<img src="url do icon" align="right" class="nome do efeito" />


Esse nome do efeito é aquela palavra, que acima de ]]></b:skin>, começa um código, como por exemplo, digamos que eu usei esseefeito, eu trocarei nome do efeito, por efeitowow. Entendem? É aquela palavra que fica depois de um ponto, que dá início a um efeito.

Agora, procurem um efeito legal, e façam como eu disse.

8 comentários:

  1. ótimo tuto para iniciantes em HTML :3

    Beijos

    http://goodiesmaster.blogspot.com.br/

    ResponderExcluir
  2. Este comentário foi removido por um administrador do blog.

    ResponderExcluir
  3. Este comentário foi removido pelo autor.

    ResponderExcluir
    Respostas
    1. Este comentário foi removido por um administrador do blog.

      Excluir
    2. Este comentário foi removido pelo autor.

      Excluir
  4. Me ajudou completamente!

    ResponderExcluir
  5. Que lindinho e ainda fica com borda junto, super amei. http://vihpaula.blogspot.com.br/

    ResponderExcluir

❤ Ofensas e palavrões serão ignorados e excluidos.
❤ Seguindo, segue de volta?Sim mas fale um pouco do post.
❤Nada de pedir post pelo os comentários , se quiser algo vá na página peça .
❤Se quiser pode deixar a URL do seu blog , sempre vou retribuir a visita!
❤Perguntas/Dúvidas , serão respondidas :-)
❤Se não gostou, não use palavras ofensivas.

« »