Tutorial de BBCode en PHP

Introducción

Cualquier internauta que haya utilizado un foro phpBB seguramente conocerá los códigos BBCode. Estos códigos permiten escribir texto enriquecido, es decir, con imágenes, cambios de tamaño, color, negrita, cursiva e incluso enlaces. Digamos que es un HTML simplificado de tal forma que cualquier usuario, experimentado o no, sea capaz de utilizarlo.

Debido a su facilidad de uso y que además mucha gente está ya acostumbrada a este código seguramente nos interesará insertarlo en alguna de nuestra aplicaciones web, en un sistema de comentarios, en nuestro libro de visitas, en el panel de noticias, etc.

Antes de nada, por si todavía no conoces BBCode vamos a ver como funciona. La mecánica es similar a la de HTML, abriremos las etiquetas con [etiqueta] y las cerraremos con [/etiqueta]. Por ejemplo, para poner una palabra en negrita:

	[b]Negrita[/b]

Conviertiendo BBCode a HTML con PHP

Visto el funcionamiento básico, vamos a la parte que más nos interesa, convertir el código BBCode a HTML o XHTML para que pueda ser visualizado en nuestra página web.

Partiendo del ejemplo anterior, lo que tenemos que hacer en PHP es convertir esto:

	[b]Negrita[/b]

En esto:

	<strong>Negrita</strong>

Para ello utilizaremos la función "str_replace" de PHP. Esta función tiene 3 parámetros, el primero es la búsqueda, el segundo es el texto que reemplazará a la búsqueda y el tercero es la cadena donde buscar. Con este ejemplo lo veremos mejor:

	echo str_replace("a","o","cacatúa"); // Imprime cocotúo

La clave de esta función está en que podemos pasarle un array como búsqueda y otro array como reemplazo. Por ejemplo:

	$busq = array("uno","dos");

	$reemp = array(1,2);

	$cadena = "uno dos tres cuatro";

	echo str_replace($busq,$reemp,$cadena); // Imprime 1 2 tres cuatro

Visto esto ya lo tenemos, sólo tenemos que crearnos dos arrays, uno con los BBCode y otro con su equivalente en HTML.


	$bbcode = array();
	$xhtml = array();
	$mensaje = "[i]Esto es una prueba[/i]
	[imagen]http://www.holamundo.es/images/logo.png[/imagen]
	 de [b]BBCode[/b]";
	
	// Ponemos cada BBCode y su reemplazo
	$bbcode[] = "[i]"; $xhtml[] = "<em>";
	$bbcode[] = "[/i]"; $xhtml[] = "</em>";
	
	$bbcode[] = "[b]"; $xhtml[] = "<strong>";
	$bbcode[] = "[/b]"; $xhtml[] = "</strong>";
	
	$bbcode[] = "[imagen]"; $xhtml[] = "<img src='";
	$bbcode[] = "[/imagen]"; $xhtml[] = "' />";
	
	echo str_replace($bbcode,$xhtml,$mensaje);

Si la variable $mensaje la recogemos desde un formulario ya tendremos listo nuestro conversor de códigos BBCode. Además, podemos añadir tantas etiquetas como queramos y a nuestro gusto.

Un ejemplo funcional

Veamos un último ejemplo más completo, con un formulario y la transformación de BBCode en una función.

  <?php

  function bbparse($mensaje) {

		$bbcode = array();

		$xhtml = array();

		

		// Ponemos cada BBCode y su reemplazo

		$bbcode[] = "[i]"; $xhtml[] = "<em>";

		$bbcode[] = "[/i]"; $xhtml[] = "</em>";

		

		$bbcode[] = "[b]"; $xhtml[] = "<strong>";

		$bbcode[] = "[/b]"; $xhtml[] = "</strong>";

		

		$bbcode[] = "[imagen]"; $xhtml[] = "<img src='";

		$bbcode[] = "[/imagen]"; $xhtml[] = "' />";

		

		return str_replace($bbcode,$xhtml,$mensaje); 

	}

	

	/* Si el formulario se ha enviado imprimimos

	 la frase introducida parseando BBCode */

	if(isset($_POST['contenido'])) {

		echo "Has introducido: ".bbparse($_POST['contenido']);

	}

  ?>

  	

	<form action="" method="post">

		<textarea name="contenido">Introduce aqui tu [b]BBCode[/b]</textarea>

		<input type="submit" name="Enviar" value="Enviar" />

	</form>

A partir de aquí sólo tenéis que añadir más códigos BBCode, si lo necesitáis y ya lo tendréis listo para usar en vuestra aplicación tan sólo copiando el código de la función "bbparse()"

Redactado por Nenillo