I would like to share a class library, “BBCode.NET
“, written by me. It converts BBCode
to HTML. It was initially posted at codeplex.com long time ago. Codeplex was shutdown, and after some code upgrade, I republish it at Github.
Here is How to Use the Class Library
Take the following as sample input data:
string input = @"
[color=red][size=20]A Video Tutorial About Freezing HTML Table Headers[/size][/color]
[font=brush script mt,30]Changing the font[/font]
[b]Bolding the text[/b]
[i]Italic the text[/i]
[url]https://mywebsite.com[/url]
[url=https://mywebsite.com]Visit My Website[/url]
[img]https://mywebsite.com/logo.png[/img]
[youtube,560,315]_dpSEjaKqSE[/youtube]";
Convert the BBCode
text into html with basic built-in rules:
string output = BBCode.ConvertToHtml(input);
The output:
<span style='color: red;'><span style='font-size: 20pt;'>
A Video Tutorial About Freezing HTML Table Headers
</span></span><br />
<span style='font-family: brush script mt; font-size: 30pt;'>
Changing the font</span><br />
<strong>Bolding the text</strong><br />
<i>Italic the text</i><br />
<a href='https://mywebsite.com'>https://mywebsite.com</a><br />
<a href='https://mywebsite.com'>Visit My Website</a><br />
<img src='https://mywebsite.com/logo.png' /><br />
<iframe width="560" height="315"
src="https://www.youtube.com/embed/_dpSEjaKqSE"
title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write;
encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
Design and add your own BBCode
:
// Obtain the basic built-in rules
List<BBCodeRules> rules = BBCode.BasicRules;
// Designing new rule
string bbcode_syntax = "[size={d1}]{text}[/size]";
string html_syntax = "<span style='font-size: {d1}pt;'>{text}</span>";
string fields = "{d1};{text}";
// Add the new rule into the list
rules.Add(new BBCodeRules(bbcode_syntax, html_syntax, fields));
// Covert the BBCode with new set of rules
string output = BBCode.ConvertToHtml(input, rules);
The Order of Same BBCode
If you have two same BBCode
rules, but different parameters, for example:
[font={d1},{d2}]{text}[/font]
[font={d1}]{text}[/font]
The more complex rule must be added first, then follow by less complex rule.
For example, this is the correct order:
[font={d1},{d2}]{text}[/font] // this must come first
[font={d1}]{text}[/font]
and this is the wrong order:
[font={d1}]{text}[/font]
[font={d1},{d2}]{text}[/font] // this must come first
White List and Black List HTML Tag Input
string whiteListTags =
"p;br;hr;strong;b;u;em;h1;h2;h3;h4;h5;h6;span;body;style;table;tr;td;img;a";
output = BBCode.AllowTags(input, whiteListTags);
output = BBCode.ConvertToHtml(input);
To block (black list) html tags:
string blackListTags = "iframe;script;form;object;";
output = BBCode.BlockTags(input, blackListTags);
output = BBCode.ConvertToHtml(input);
Default Built-in BBCode Rules
[b]{text}[/b]
Example: [b]your text here[/b]
[u]{text}[/u]
Example: [u]your text here[/u]
[i]{text}[/i]
Example: [i]your text here[/i]
[color={d1}]{text}[/color]
Example: [color=red]your text here[/color]
Example: [color=#525252]your text here[/color]
[size={d1}]{text}[/size]
Example: [size=20]your text here[/size]
[font={d1},{d2}]{text}[/font]
Example: [font=brush script mt,30]Changing the font[/font]
[font={d1}]{text}[/font]
Example: [font=brush script mt]Changing the font[/font]
[code]{text}[/code]
Example: [code]your text here[/code]
[url]{text}[/url]
Example: [url]https://adriancs.com[/url]
[url={d1}]{text}[/url]
Example: [url=https://adriancs.com]Visit the Authur's Website[/url]
[img]{text}[/img]
Example: [img]https://yourwebsite.com/someimg.jpg[/img]
[img,{width},{height}]{text}[/img]
Example: [img,300,200]https://yourwebsite.com/someimg.jpg[/img]
[youtube,{width},{height}]{videocode}[/youtube]
Example: [youtube,560,315]_dpSEjaKqSE[/youtube]
[youtube]{videocode}[/youtube]
Example: [youtube]_dpSEjaKqSE[/youtube]
Happy coding!