Códigos HTML fáceis para Blogueiros

[ #11 | B E D A ] Kon'nchiwaa fadinhas e elfos! Como vocês estão? Sei que muitos tem um medo danado de mexer com html ou acha muito dificil, mas não é tão complicado assim. Vocês podem ver isso não só nos meus posts de personalização mas também nesse post agora! Reuni coisas básicas, que pode te ajudar em algum momento. E então, let's go?


Recomendo que enquanto leia esse post abra uma outra aba com o seu blog, adicione um no gadget de HTML/JavaScript (na lateral) e vá testando, e experimentando os seguintes códigos que colocarei. Se você digitar o código errado, não se preocupe, não vai acontecer nada de grave, ele só não vai aparecer, ou irá aparecer o código mesmo a barra lateral, é só apagar o Gadget e pronto.

Imagem

Hospede sua imagem em algum site, pode ser blogger ou imgur. Pegue o 'link direto' dele. Em seguida, coloque no código abaixo:

<img src = ”http://linkdaimagem”>

Imagem com link

Este é o código que você pode usar, e colocar uma imagem com link à sua barra lateral ou qualquer lugar que aceite. Ao apertar na imagem abrirá o link colocado.  Certifique-se sempre de que seus links comecem com http: //

<a href=”http://linkdositeaqui”> <img src = ”http://linkdaimagemaqui”> </a>

Link de texto

Aqui é como essa acima só que com texto mesmo, o link em um texto:

<a href=”http://linkdositeaqui”> Texto vai aqui </a>

Texto negrito, itálico, sublinhado, e destaque

Você pode alterar a aparência do texto com esses códigos simples! Teste na sua sidebar:

Texto em negrito: <b> Texto em negrito aqui </ b>

Para texto em itálico: <i> Texto em itálico aqui </ i>

Para o texto sublinhado: <u> Texto sublinhado aqui </ u>

Para destaque comum (amarelo): <mark>destacado</mark>

Para destaque personalizado: Nesse texto tem <span style="background: #1abc9c; border-radius:5px; padding:5px">trecho em destaque</span>.

Tamanho da fonte

Você também pode alterar o tamanho da sua fonte. Substitua por um número de acordo com o tamanho de sua preferencia:

<font size = "4"> O texto vai aqui </ font>

Alinhando no centro

Se você quiser que algo fique centralizado, podendo ser texto, imagem ou qualquer item, use esses códigos no início e no final do  HTML, lembrando que os </ são necessários para fechar qualquer ação, isso faz com que não aplique em tudo:

<center> Qualquer código HTML ou texto aqui </center>

Iniciando uma nova linha e espaçamento

Caso não use esse código todo texto que fazer vai ficar em uma única linha, sem paragrafo pois o ''enter'' não funciona como ''espaço'' no html, já o segundo é bom para espaçamento ao lado:

Para outra linha: <br/>

Para espaço ao lado: &nbsp;

Bem, é isso, espero que seja útil para vocês! Pratique e aplique sempre na sua vida pela blogosfera. Essas dicas são ótimas também para os seus comentários, adicione seu blog sempre no final linkando eles. Pratique na sidebar e no rodapé também!

Por hoje é só! Espero que tenham gostado! Estamos em BEDA então visite e siga o blog para não perder nada. Redes Sociais do Sweet Magic: Facebook | Twitter | We heart It | Bloglovin | Pinterest *  Conheça meu trabalho: JD Design e Web! Até mais, Kissus! Fontes: Pixie, Devmedia & Haute chocolate photography.