Introdução

BBCode é uma implementação especial do HTML. Servirá para simplificar o código HTML de modo que nossos usuários possam utilizá-lo ao enviar notícias a nossa web, deixar suas mensagens em nosso fórum, etc. Usaremos em todo tipo de formulários nos que quisermos que o usuário possa inserir links, imagens, tabelas, imoticonos, etc. de forma simples e sem necessidade de ter conhecimentos sobre HTML.

O BBCode se utiliza de uma forma similar a linguagem HTML: Utilizam-se etiquetas entre colchetes da seguinte maneira: Usaremos [etiqueta] para abrir a etiqueta e [/etiqueta] para fechá-la.

Muitos conhecidos sistemas de fóruns e plataformas de gerenciamento de conteúdos web utilizam BBCode. Por exemplo phpBB ou SMF

Veremos o esquema de envio de texto + BBCode para incluir uma imagem. O usuário escreveria no textarea de um formulário:

[imagem]http://www.meu_servidor.com/minha_imagem.jpg[/imagem]


E ao enviá-la substituiríamos mediante uma função em PHP as etiquetas [imagem] e [/imagem] por código HTML, ficando da seguinte maneira:

<img src="http://www.meu_servidor.com/minha_imagem.jpg" />


Isto nos permite usar como quisermos as etiquetas. Se utilizamos um banco de dados podemos salvar as mensagens enviadas em modo texto e BBCode tal como foram redigidas e para mostrá-las utilizar uma função PHP para substituir o código BBCode pelo código HTML correspondente.

Criando nossos BBCodes com PHP

Definiremos as etiquetas BBCode que nós queremos com o código HTML que lhes corresponda e criaremos uma função com PHP para substituir os BBCodes escritos pelo usuário por código HTML. Utilizaremos a função STR_REPLACE() de PHP para substituir as etiquetas BBcode por HTML.

Primeiro, associaremos o código HTML a etiquetas elementares de BBCode mediante um array. Logicamente, vocês podem criar suas próprias etiquetas com o código HTML que quiserem:

<?php

$bb_code = array(
// emoticonos: deve apontar a suas imagens no código HTML
':)' => '<img src="feliz.gif" />',
':(' => '<img src="triste.gif" />',
':D' => '<img src="contente.gif" />',

// letra negrito
'[b]' => '<span style="font-weight:bold">',
'[/b]' => '</span>',

// letra cursiva
'[i]' => '<span style="font-style:italic">',
'[/i]' => '</span>',

// letra sublinhada
'[u]' => '<span style="text-decoration:underline">',
'[/u]' => '</span>',

// quebra de linha
'[quebra]' => '<br><br>',

// imagens
'[imagem]' => '<img src="',
'[/imagem]' => '" />'

// lembrem que depois do último elemento não há vírgula
);
?>

Agora utilizaremos uma função para substituir as etiquetas BBCode por código HTML:

<?php
function substituir( $codigo )
{
$search = array_keys( $GLOBALS['bb_code'] );
$codigo = str_replace( $search, $GLOBALS['bb_code'], $codigo );
return $codigo;
}
?>

Neste exemplo $codigo é a variável na que passaremos à função com o texto+BBCode que tiver escrito o usuário.

Agora vamos a ver o código completo pronto para ser provado que inclui os códigos anteriores com um texto+BBCode de exemplo:

<?php

// definimos nossas etiquetas
$bb_code = array(
// emoticonos: deve apontar a suas imagens no código HTML
':)' => '<img src="feliz.gif" />',
':(' => '<img src="triste.gif" />',
':D' => '<img src="contente.gif" />',

// letra negrito
'[b]' => '<span style="font-weight:bold">',
'[/b]' => '</span>',

// letra cursiva
'[i]' => '<span style="font-style:italic">', < '[/i]' => '</span>',

// letra sublinhada
'[u]' => '<span style="text-decoration:underline">',
'[/u]' => '</span>',

// quebra de linha
'[quebra]' => '<br><br>',

// imagens
'[imagem]' => '<img src="',
'[/imagem]' => '" />'

// lembrem que depois do último elemento não há vírgula
);

// Definimos nossa mensagem de prova
$mensagem = 'Esta palavra está em [b]negrito[/b] e [u]isto está sublinhado.[/u] '
.'[salto]Este é o logo de criarweb: [quebra]'
.'[imagem]http://www.criarweb.com/images/logo-criarweb.gif'
.'[/imagem]';

// Substituímos o BBCode pelo código HTML e o mostramos na página
echo '<p>'.substituir ( $mensagem ).'</p>';

// Incluímos a função para substituir o código
function substituir ( $codigo )
{
$search = array_keys( $GLOBALS['bb_code'] );
$codigo = str_replace( $search, $GLOBALS['bb_code'], $codigo );
return $codigo;
}
?>

Para trabalhar com formulários só temos que substituir $mensagem pelo valor enviado através do formulário. Por exemplo, colocaríamos um campo textarea chamado "mensagem" no formulário que apontará ao nosso script PHP e neste mudaríamos o valor de $mensagem por $HTTP_POST_VARS['mensagem']

Espero que este tutorial tenha sido de utilidade para muita gente.