Guia de BBCode

Introdução

O que é BBCode?
O BBCode é uma implementação especial do HTML. A possibilidade de se usar BBCode nas suas mensagens é determinada pelo administrador do fórum. Adicionalmente, você poderá desativar o BBCode em cada mensagem. O BBCode por si mesmo é similar em estilo ao HTML, as etiquetas (tags) são incluídas em colchetes [ e ] ao invés de < e >, proporcionando uma maior facilidade na formatação de seus textos e mensagens dentro do fórum. A tarefa de adicionar BBCode às suas mensagens é facilitada pelo uso de um painel colocado imediatamente acima da caixa principal das mensagens, dependendo do modelo do phpBB em uso, onde você pode escolher e aplicar os vários itens para o código que pretenda aplicar. Apesar da existência desse painel, tenha certeza de que este guia lhe será muito útil.
Voltar ao topo

Formatação de Texto

Como criar textos em negrito, itálico e sublinhado
O BBCode inclui tags que lhe permitem mudar rapidamente o estilo básico do texto. Isto é possível das seguintes formas:
  • Para tornar uma parte do texto em negrito, você deve incluí-la entre as tags [b][/b], ou seja,

    [b]Olá[/b]

    passará a ser Olá
  • Para sublinhar use [u][/u]. Por exemplo:

    [u]Bom Dia[/u]

    passa a ser Bom Dia
  • Para tornar o texto itálico, utilize [i][/i], ou seja,

    Isto é [i]Ótimo![/i]

    resulta em: Isto é Ótimo!
Voltar ao topo
Como mudar a cor e o tamanho do texto
Para alterar a cor ou o tamanho de seu texto, devem ser usadas as seguintes tags. Ter em mente que a forma como aparecerá no monitor de cada visitante depende do navegador ou do sistema que utilize:
  • A mudança da cor do texto é feita englobando-o em [color=][/color]. Tanto pode especificar o nome de uma cor conhecida, que será em inglês (exemplo: red, blue, yellow, etc.) ou especificando o seu valor hexadecimal, ou seja, #FFFFFF, #000000. Por exemplo, para criar um texto em vermelho, você poderá usar:

    [color=red]Olá![/color]

    ou

    [color=#FF0000]Olá![/color]

    Ambos resultarão em Olá!
  • A mudança do tamanho do texto pode ser feita de uma forma similar, utilizando [size=][/size]. Esta tag está dependente do estilo do phpBB que você utiliza, mas o formato recomendado é um valor numérico representando o tamanho do texto em porcentagem, começando em 20 (minúsculo) até 200 (enorme) pelo padrão. Por exemplo:

    [size=30]MINÚSCULO[/size]

    normalmente aparece como MINÚSCULO

    enquanto que

    [size=200]ENORME![/size]

    será ENORME!
Voltar ao topo
Posso combinar tags?
Sim, claro que pode. Por exemplo, para chamar a atenção de alguém, você poderá escrever:

[size=200][color=red][b]OLHE PRA MIM![/b][/color][/size]

que irá aparecer como OLHE PRA MIM!

Entretanto, não recomendamos o uso de muito texto na forma que acabamos de descrever! Lembre-se que depende de si, o autor da mensagem, assegurar que os códigos estejam colocados corretamente. Por exemplo, isto está incorreto:

[b][u]Isto está incorreto[/b][/u]
Voltar ao topo

Citar e produzir textos de largura fixa

Citar textos em respostas
Há duas formas de citar um texto, com ou sem referência.
  • Quando você utiliza a função Citar para responder a uma mensagem, note que o texto dessa mensagem é adicionado ao corpo da mensagem incluído em um bloco [quote=""][/quote] de citação. Este método lhe permite citar com uma referência a uma pessoa ou o que você decida colocar! Por exemplo, para citar um trecho de texto que Mr. Blobby escreveu, você escreverá:

    [quote="Mr. Blobby"]O texto que Mr. Blobby escreveu será citado aqui[/quote]

    No resultado será adicionado automaticamente "Mr. Blobby escreveu:" antes do texto citado. Note que você precisa incluir as aspas "" à volta do nome que deseja citar.
  • O segundo método permite-lhe citar algo sem referência a alguém ou algo. Para o fazer, escreva o texto entre as tags [quote][/quote]. Quando visualizar a mensagem, verá que simplesmente surgirá um bloco de citação.
Voltar ao topo
Produzir código ou texto com uma largura fixa
Se você desejar escrever um código, ou de fato, algo que requeira uma largura fixa, ou seja, tipo de fonte Courier, englobe o texto entre as tags [code][/code], como por exemplo:

[code]echo "Isto é um trecho de código";[/code]

O formato utilizado entre as tags [code][/code] é preservado quando posteriormente o visualizar.
Voltar ao topo

Gerando Listas

Criando uma Lista sem Ordem Específica
O BBCode aceita dois tipos de lista, uma lista sem ordem e outra ordenada. São basicamente o mesmo que em HTML. Uma lista sem ordem produz cada item de uma forma sequencial, um em seguida do outro, precedendo-o um caractere constante. Para criar, você deve utilizar [list][/list] e colocar cada item entre as tags, utilizando [*] antes de cada um. Por exemplo, para listar as suas cores favoritas, você pode escrever:

[list]
[*]Vermelho
[*]Azul
[*]Amarelo
[/list]

Esta lista aparecerá como:
  • Vermelho
  • Azul
  • Amarelo

Você também pode personalizar o estilo de uma lista usando as tags [list=disc][/list], [list=circle][/list] ou [list=square][/list].
Voltar ao topo
Criando uma Lista Ordenada
O segundo tipo de lista, uma lista ordenada, proporciona-lhe o controle do que vá aparecer antes de cada item. Para criar uma lista ordenada você utilizará [list=1][/list] para criar uma lista numérica ou alternativamente [list=a][/list] para uma lista alfabética. Da mesma forma que para o tipo de lista sem ordem, os itens são precedidos de [*]. Por exemplo:

[list=1]
[*]Ir às compras
[*]Comprar um computador novo
[*]Insultar o computador quando ficar bloqueado
[/list]

produzirá o seguinte:
  1. Ir às compras
  2. Comprar um computador novo
  3. Insultar o computador quando ficar bloqueado
Enquanto que para uma lista alfabética você utilizará:

[list=a]
[*]A primeira resposta possível
[*]A segunda resposta possível
[*]A terceira resposta possível
[/list]

produzirá o seguinte
  1. A primeira resposta possível
  2. A segunda resposta possível
  3. A terceira resposta possível

[list=A]
[*]A primeira resposta possível
[*]A segunda resposta possível
[*]A terceira resposta possível
[/list]

produzirá o seguinte
  1. A primeira resposta possível
  2. A segunda resposta possível
  3. A terceira resposta possível

[list=i]
[*]A primeira resposta possível
[*]A segunda resposta possível
[*]A terceira resposta possível
[/list]

produzirá o seguinte
  1. A primeira resposta possível
  2. A segunda resposta possível
  3. A terceira resposta possível

[list=I]
[*]A primeira resposta possível
[*]A segunda resposta possível
[*]A terceira resposta possível
[/list]

produzirá o seguinte
  1. A primeira resposta possível
  2. A segunda resposta possível
  3. A terceira resposta possível
Voltar ao topo

Criando Links

Criar um link para outra página
O phpBB BBCode aceita um número variável de formas para criar URIs (Uniform Resource Indicators), melhor conhecidos como URLs.
  • A primeira dessas formas é usando as tags [url=][/url]. O que quer que você escreva depois do sinal = faz com que o conteúdo destas tags aja como uma URL. Por exemplo, para fazer um link para o phpBB.com, você usa:

    [url=https://www.phpbb.com/]Visite o phpBB![/url]

    Isto irá resultar no seguinte link: Visite o phpBB!. Veja que a página irá abrir na mesma janela ou nova janela dependendo das preferências do navegador do usuário.
  • Se pretende que a URL esteja à vista, faça simplesmente isto:

    [url]https://www.phpbb.com/[/url]

    Tal resultará no seguinte link: https://www.phpbb.com/
  • Adicionalmente, o phpBB possui algo chamado Links Mágicos, função que permite transformar automaticamente qualquer URL escrita com uma sintaxe correta, em um link sem ser necessário especificar quaisquer tags ou mesmo o prefixo http://. Por exemplo, escrevendo www.phpbb.com na sua mensagem, automaticamente resultará em www.phpbb.com quando vir essa mensagem.
  • A mesma coisa se aplica aos endereços de e-mail, podendo especificar o endereço. Por exemplo:

    [email]no.one@domain.adr[/email]

    que resultará em no.one@domain.adr, ou você pode apenas escrever no.one@domain.adr em sua mensagem, que será automaticamente convertido em um link quando a mensagem for salva.
Como em todos os códigos BBCode aqui apresentados, você pode misturar URLs com quaisquer outras tags. Como por exemplo, [img][/img] (ver o item seguinte), [b][/b], etc. Em relação ao formato das tags, está totalmente dependente de si assegurar a ordem correta de seu início e fim, por exemplo:

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/url][/img]

não está correto, o que pode conduzir sua mensagem a ser excluída por algum administrador ou moderador. Por favor, tenha cuidado.
Voltar ao topo

Exibir imagens em mensagens

Adicionar uma imagem a uma mensagem
O phpBB BBCode incorpora uma tag para incluir imagens em suas mensagens. Dois fatores muito importantes devem ser lembrados aqui, quando se utiliza estas tags: Primeiro, a maioria dos usuários preferem não ver muitas imagens em mensagens; Segundo, a imagem que você pretende exibir deve existir na internet (não pode existir apenas no seu computador, a menos que tenha um servidor de páginas na WEB e este esteja sempre ativo e seja publicamente acessível!). Para exibir uma imagem, você terá que escrever a URL da imagem entre as tags [img][/img]. Por exemplo:

[img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img]

Você deve ter notado, na seção da URL acima, que você pode englobar uma imagem com as tags [url][/url], se assim o desejar, ou seja,

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img][/url]

irá produzir:

Voltar ao topo
Anexar arquivos em uma mensagem
Os anexos podem ser inseridos em qualquer local da mensagem utilizando o novo BBCode [attachment=][/attachment], se a funcionalidade de anexos estiver sido ativada pelo administrador do fórum e se você tiver as permissões apropriadas para anexar arquivos. Na tela do envio de mensagens existe um menu padrão para se adicionar os anexos desejados.
Voltar ao topo

Gerando Spoilers

Adicionando um spoiler em um post
Um spoiler básico consiste em um texto contido em [spoiler][/spoiler]. Por exemplo:

[spoiler]Detalhes sobre a narrativa do filme[/spoiler]

Isso geraria:
Spoiler
Detalhes sobre a narrativa do filme
Voltar ao topo
Adicionando um spoiler com título em um post
Um spoiler pode, opcionalmente, mostrar um título personalizado. Para isso, o texto precisa ser agrupado em [spoiler title=][/spoiler]. Por exemplo:

[spoiler title=Resumo do enredo]Detalhes sobre a narrativa do filme[/spoiler]

Isso geraria:
Resumo do enredo
Detalhes sobre a narrativa do filme
Voltar ao topo

Incorporando mídia

Como inserir mídia de outros sites em postagens
Os usuários podem incorporar conteúdo como vídeos e áudio de sites permitidos usando as tags [media][/media], ou simplesmente postando uma URL suportada em texto simples. Por exemplo:

[media]https://youtu.be/QH2-TGUlwu4[/media]

Conforme mencionado acima, o link também pode ser usado sem as tags [media].

O exemplo mostrado aqui geraria:



Os seguintes sites são suportados:
abcnews, acast, amazon, anchor, applepodcasts, audioboom, audiomack, audius, bandcamp, bbcnews, bitchute, bleacherreport, brightcove, castos, cbsnews, clyp, cnbc, cnn, cnnmoney, codepen, comedycentral, coub, dailymotion, democracynow, dumpert, eighttracks, espn, facebook, falstad, flickr, foxnews, funnyordie, gamespot, getty, gfycat, gifs, giphy, gist, globalnews, gofundme, googledrive, googleplus, googlesheets, hudl, hulu, ign, imdb, imgur, indiegogo, instagram, internetarchive, izlesene, jsfiddle, jwplatform, kaltura, khl, kickstarter, libsyn, liveleak, livestream, mailru, medium, megaphone, metacafe, mixcloud, mlb, mrctv, msnbc, natgeochannel, natgeovideo, nbcnews, nbcsports, nhl, npr, nytimes, odysee, orfium, pastebin, pinterest, podbean, prezi, reddit, rumble, rutube, scribd, sendvid, slideshare, sporcle, sportsnet, spotify, spreaker, steamstore, stitcher, strawpoll, streamable, streamja, teamcoco, ted, telegram, theatlantic, theguardian, theonion, tiktok, tmz, tradingview, traileraddict, trendingviews, tumblr, twentyfoursevensports, twitch, twitter, ustream, vbox7, veoh, vevo, videodetective, vimeo, vine, vk, vocaroo, vox, washingtonpost, wavekit, wistia, wshh, wsj, xboxclips, xboxdvr, youku, youmaker, youtube.

Para obter documentação completa sobre sites suportados e URLs de exemplo, visite a MediaEmbed Plugin Documentation.
Voltar ao topo

Outros Assuntos

Posso adicionar as minhas próprias tags?
Se você for um administrador e possuir permissões para tal, você poderá adicionar BBCodes diversos através do seu painel de BBCodes personalizados.
Voltar ao topo

Advanced BBCode Box BBCodes

Tipo de fonte
[font=Comic Sans MS]texto[/font]

Example:
[font=Comic Sans MS]The quick brown fox jumps over the lazy dog[/font]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Realçar o texto
[highlight=yellow]texto[/highlight] Dica: você também pode usar color=#FF0000

Example:
[highlight=yellow]The quick brown fox jumps over the lazy dog[/highlight]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Alinhar texto
[align=center|left|right|justify]texto[/align]

Example:
[align=center]The quick brown fox jumps over the lazy dog[/align]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto flutuante
[float=left|right]texto[/float]

Example:
[float=right]The quick brown fox jumps over the lazy dog[/float]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto exponecial
[s]texto[/s]

Example:
[s]The quick brown fox jumps over the lazy dog[/s]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto subscrito
[sub]text[/sub]

Example:
[sub]The quick brown fox jumps over the lazy dog[/sub] The quick brown fox jumps over the lazy dog

Result:
The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto sobrescrito
[sup]text[/sup]

Example:
[sup]The quick brown fox jumps over the lazy dog[/sup] The quick brown fox jumps over the lazy dog

Result:
The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto com brilho
[glow=color]texto[/glow]

Example:
[glow=red]The quick brown fox jumps over the lazy dog[/glow]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Segunda sobra do texto [shadow=color]texto[/shadow]
Segunda sobra do texto [shadow=color]texto[/shadow]

Example:
[shadow=blue]The quick brown fox jumps over the lazy dog[/shadow]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Sombra do texto
[dropshadow=color]textp[/dropshadow]

Example:
[dropshadow=blue]The quick brown fox jumps over the lazy dog[/dropshadow]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Borrão no texto
[blur=color]texto[/blur]

Example:
[blur=blue]The quick brown fox jumps over the lazy dog[/blur]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto fadein / fadeout
[fade]texto[/fade]

Example:
[fade]The quick brown fox jumps over the lazy dog[/fade]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Texto pré-formatado
[pre]texto[/pre]

Example:
[pre]The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog[/pre]

Result:
The quick brown fox jumps over the lazy dog
	The quick brown fox jumps over the lazy dog
Voltar ao topo
Direção do texto
[dir=ltr|rtl]texto[/dir]

Example:
[dir=rtl]The quick brown fox jumps over the lazy dog[/dir]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Letreiro
[marq=up|down|left|right]texto[/marq]

Example:
[marq=left]The quick brown fox jumps over the lazy dog[/marq]

Result:
The quick brown fox jumps over the lazy dog
Voltar ao topo
Spoiler
[spoil]texto[/spoil]

Example:
[spoil]The quick brown fox jumps over the lazy dog[/spoil]

Result:
► Exibir Spoiler
Voltar ao topo
Hide from guests
[hidden]texto[/hidden]

Example:
[hidden]The quick brown fox jumps over the lazy dog[/hidden]

Result:
Esconder conteúdo
Você tem que está registrado e logado para ver o conteúdo oculto.
Voltar ao topo
Mensagem de alerta
[mod=username]text[/mod]

Example:
[mod=Nome de usuário]The quick brown fox jumps over the lazy dog[/mod]

Result:
 ! Mensagem de: Nome de usuário
The quick brown fox jumps over the lazy dog
Voltar ao topo
Mensagem Off Topic
[offtopic]texto[/offtopic]

Example:
[offtopic]The quick brown fox jumps over the lazy dog[/offtopic]

Result:
Off Topic
The quick brown fox jumps over the lazy dog
Voltar ao topo
NFO ascii art text
[nfo]texto[/nfo]

Example:
[nfo]༼ つ ◕_◕ ༽つ ʕ•ᴥ•ʔ ¯\_(ツ)_/¯[/nfo]

Result:
༼ つ ◕_◕ ༽つ    ʕ•ᴥ•ʔ   ¯\_(ツ)_/¯
Voltar ao topo
Incorporar qualquer URL de vídeo
[bbvideo]http://video_url[/bbvideo]

Example:
[bbvideo]https://www.youtube.com/watch?v=sP4NMoJcFd4[/bbvideo]

Result:
Voltar ao topo
Embed MP4/OGG/WEBM video files
URL must start with https or http and end with .mp4, .ogg or .webm (no BBCode needed). Note that browser support and GUI implementation varies.

Example:
https://storage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4

Result:
Voltar ao topo