Tutorial - Definir tamanho de uma imagem.


Você sabe como modificar o tamanho das imagens do seu blog para que elas ocupem toda área do poste sem precisar mexer no html do seu blog ?

Se você não faz ideia de como alterar o tamanho das suas imagens sem ser clicando sobre elas e escolhendo entre:


Siga esse tutorial simples que você vai entender como fazer.
A dois modos de fazer o upload da sua imagem no blogger.

A 1° opção é a mais usada.


No painel de edição de texto na aba ESCREVER e depois no logo da ferramenta INSERIR IMAGEM.

Em seguida faça o upload da imagem como você já está acostumado, espere a imagem carregar, clique duas vezes sobre ela.


Dessa maneira ela já vai aparecer com um tamanho definido e provavelmente centralizada, então você vai alterar a aba de ESCREVER para HTML.


E como mostra a imagem acima vai aparecer o código gerado pelo blog da imagem, procure o código height="(numero)" e apague. Height é o que define a altura da imagem e caso você não apague vai fazer com que a imagem fique achatada e distorcida.

Depois ache o no código o width="(numero)". Width define a largura da imagem, basta trocar o numero entre as aspas para o tamanho da largura que você deseja.

O 2° modo é mais simples, vá diretamente na aba HTML e em INSERIR IMAGEM e faça o upload da sua imagem normalmente.


Escolha o alinhamento, eu prefiro NENHUM ou CENTRALIZADO e depois escolha o TAMANHO ORIGINAL.

Vai aparecer o código da imagem gerado pelo blogger e a única coisa que precisa fazer é adicionar o width="(numero)" quase no final do código entre a ultima aspas após o link da imagem e a barra .
urldaimagem" width="(numero)" />
Assim como na imagem abaixo.



DICA EXTRA
O código gerado pelo blogger da imagem é realmente grande. Caso você queira tornar o carregamento mais leve você pode diminuir o é bem simples, veja a imagem.

O 1° código é o gerado pelo blogger, mas o único código que você precisa para fazer uma imagem aparecer  na sua postagem é o que está entre o 2º código, de <img a /> você pode apagar o restante do código se sentir vontade deixando como na segunda caixinha bem mais simples e com o carregamento mais leve, se quiser pode pagar o border="0" ele não faz falta no código também.
Só não esqueça de colocar o width="(numero)" antes da barra e chave final do código deixando o código da seguinte maneira.

<img  src="URLDAIMAGEM" width="(numero)" />

Ficou longuinho e cheio de imagem, mas acho que ficou bem explicado para quem não sabia como mexer na largura da imagem.
Espero que gostem, pretendo trazer mais tutoriais das funcionalidades do blogger. Então se gostou ou ficou com duvidas deixe seu comentário, e ajude compartilhando <3


.