[TUTORIAL]Aprendendo a melhorar seus posts com BBCode

Pra quem quer enfeitar o seu post, colocar um fundo diferente ou usar um separador para determinado assunto, as BBCode são feitos pra isso! Mas como funciona esse monte de código esquisito q ela gera?

Código:


[table border="1"]
[tr]
[td] [/td]
[/tr]
[/table]


Vamos descobrir isso!

Antes de começar a entender como BBCode funciona primeiro você precisa ter uma pequena noção de como o código HTML funciona.

Html é uma linguagem de programação que foi inventada inicialmente para formatar textos na internet. Foi sendo aprimorada para tratar tabelas, listas, imagens, formulários e vários outros elementos usados numa página.
É a linguagem básica pra quem quer aprender a fazer páginas pra net. No HTML usamos TAG, é uma palavra reservada q vai dar pro browser uma instrução, um código que ele vai entender e interpretar e mostrar isso na sua tela. Por isso chamamos de "linguagem de programação", pois você vai "conversar" com a máquina; e se ela entender ela vai fazer certinho o que você pedir! Um exemplo:

A TAG IMG é usada pra dizer ao seu PC q vc vai usar uma imagem, a sintaxe, ou seja, o comando certo é: <IMG>
Mas se vc simplesmente escrever <IMG> o pc não vai fazer nada, pois você precisa dizer pra ele onde está essa imagem. Então precisa incrementar essa tag e combinar na sintaxe o código que pede endereço das coisas: SRC.

A sintaxe completa será: <IMG SRC="">

Agora só falta vc por o link da imagem entre as aspas pra ela ser chamada e aparecer na sua tela

"Mas o que vamos aprender aqui é BBCode, pq esse Derllan manezão tá ensinando html?"

Elementar... a única diferença entre HTML e BBCode é o simbolo q define a TAG, ao invés de <> vamos usar [ ].

A TAG BBCode para imagem então fica assim: [IMG SRC=""]

Como a TAG IMG é usada apenas para "puxar" a imagem, ela não precisa ser "fechada"... como assim fechada??
Costumo dizer q no HTML/BBCode tudo q você abre [], você tem q fechar [/].

Exemplo:
A TAG [ B ], é usada pra deixar um texto em negrito, o texto tem q ficar entre a TAG: [ B ] Olá Pessoal! [ /B ]

So pra deixar claro pessoal, quando for usar a tag tem q ser sem os espaços, eu coloquei os espaços só pra poder aparecer senão você veria o texto com a TAG aplicada: Olá Pessoal!

Aqui no editor de mensagens já tem várias tags BBCode implementadas, são esses botões cinza que ficam em cima da caixa onde a gente escreve. É só clicar neles e escrever seu texto no entre as tags pro texto ter o efeito.

Pra você saber o que cada uma faz basta apenas deixar o mouse em cima do botão q ele mostra a função e um exemplo em baixo de como aplicar.

Bem simples né!

---

Alguns exemplos de TAGs:

TAG [ CODE ] ... [ /CODE ]

Código:

 
Usado pra mostrar uma sintaxe, um bloco de programação ou simplesmente uma TAG. Exibe exatamente dessa forma que você está vendo este texto dentro dessa caixa. Aqui qualquer código de qualquer linguagem não funciona, ela é exibida da forma q é escrita, o nosso [B]Olá Pessoal![/B] agora ficou sem o negrito e a TAG apareceu ^^

---

TAG [ URL ] ... [ /URL ]

Nossa TAG pra mostrar um link funciona assim:

CLIQUE AQUI PRA VER NOSSO FÓRUM
CLIQUE [ url=https://maiorais.forumeiros.com ] AQUI [ /url ] PRA VER NOSSO FÓRUM

No primeiro colocamos o endereço do link [ URL = http://seu_endereço_aqui ] seu_texto_aqui [ /URL ]

---

TAG [ COLOR ] ... [ /COLOR ]

TAG para cor.
[ color=red ] TEXTO EM VERMELHO [ /color ]
TEXTO EM VERMELHO

---

TAG [ FONT ]...[ /FONTE ]
Muda a fonte do texto:
[ font=Comic Sans Ms ] TEXTO EM FONT COMIC SANS MS [ /font ]
TEXTO EM FONT COMIC SANS MS

---

TAG [SIZE] ... [/SIZE]
Muda o tamanho do texto:
[ size=18 ] TEXTO GRANDE [ /size ]

o numero determina o tamanho dele...
TEXTO GRANDE

... o gigante tem tamanho 24
TEXTO GIGANTE

---

FORMATAÇÃO DE PARÁGRAFO:

Centralizado	A direita	Justificado
[ CENTER ] ... [ /CENTER ]	[ RIGHT ] ... [ /RIGHT ]	[ JUSTIFY ] ... [ /JUSTIFY ]
Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração, Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração	Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração, Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração	Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração, Batatinha quando nasce, Espalha ramas pelo chão, Menininha quando dorme, Põe a mão no coração

---

NEGRITO: [ B ] ... [/B ]
Texto em negrito

ITÁLICO: [ I ] ... [ I /]
Texto em itálico

SUBLINHADO: [ U ] ... [ /U ]
Texto sublinhado

RISCADO: [ STRIKE ] ... [ /STRIKE ]
Texto riscado

---

TAG [ HR ]
Traça uma linha horizontal usada visualmente como separação

---

Em breve explicarei como formatar usando tabela, que foi como eu usei pra explicar a formatação de parágrafo.

Qualquer dúvida postem aqui!