XhCode Online Converter Tools
Copy the complete result

UBB code and HTML conversion tool to convert UBB to HTML code online

1,Convert Ubb code to Html format code online
2,Convert Html code to Ubb forum format code online
3,UBB and HTML code conversion tools can convert Ubb or Html code of a given content to each other, and easily convert between webpage code.
HTML to UBB

HTML to UBB (Ultimate Bulletin Board) Code is a conversion of HTML markup into UBB (a simple markup language used by online forums, particularly the Ultimate Bulletin Board). UBB tags are used to format posts and comments in forums, similar to BBCode (Bulletin Board Code).

Here's an overview of how you can convert HTML to UBB and some examples of U mappings:

UBB Basic Syntax and Common Tags
In UBB, the markup is more simplified and often uses square brackets [ ] to define formatting, while HTML uses tags like <div>, <p>, <b>, etc.

HTML Tag UBB Tag Example
<b> [b]...[/b] <b>Bold Text</b> → [b]Bold Text[/b]
<i> [i]...[/i] <i>Italic Text</i> → [i]Italic Text[/i]
<u> [u]...[/u] <u>Underlined Text</u> → [u]Underlined Text[/u]
<img> [img]...[/img] <img src="image.jpg"> → [img]image.jpg[/img]
<a href=""> [url]...[/url] <a href="http://example.com">Link</a> → [url]http://example.com[/url]
<blockquote> [quote]...[/quote] <blockquote>Text</blockquote> → [quote]Text[/quote]
<ul> [list]...[/list] <ul><li>Item</li></ul> → [list]Item[/list]
<ol> [list=1]...[/list] <ol><li>Item</li></ol> → [list=1]Item[/list]
<li> [*] <li>Item</li> → [*]Item
<code> [code]...[/code] <code>Code</code> → [code]Code[/code]
<hr> [hr] <hr> → [hr]
1. Example: Convert HTML to UBB
Let's take an HTML page and convert it into UBB code.

HTML Example:
html

<html>
<head><title>HTML to UBB</title></head>
<body>
<h1>Welcome to the Forum</h1>
<p>This is <b>bold text</b> and <i>italic text</i>.</p>
<a href="http://www.example.com">Visit Example</a>
<img src="image.jpg" alt="Example Image">
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<p><blockquote>This is a quoted text.</blockquote></p>
</body>
</html>
Converted UBB Code:
ubb

[center][h1]Welcome to the Forum[/h1][/center]
[p]This is [b]bold text[/b] and [i]italic text[/i].[/p]
[url=http://www.example.com]Visit Example[/url]
[img]image.jpg[/img]
[list]
[*]Item 1
[*]Item 2
[/list]
[p][quote]This is a quoted text.[/quote][/p]
Explanation:
<h1> → [h1] (UBB supports [h1] for header text.)
<p> → [p] (Paragraphs are used similarly in UBB.)
<b> → [b] (Bold formatting in UBB.)
<i> → [i] (Italic formatting in UBB.)
<a href=""> → [url] (Hyperlinking.)
<img> → [img] (Image embedding.)
<ul> & <li> → [list] and [li] (List items in UBB.)
<blockquote> → [quote] (Blockquotes in UBB.)
2. HTML to UBB Tag Conversion Table
HTML UBB
<b>Text</b> [b]Text[/b]
<i>Text</i> [i]Text[/i]
<u>Text</u> [u]Text[/u]
<p>Text</p> [p]Text[/p]
<h1>Heading</h1> [h1]Heading[/h1]
<h2>Heading</h2> [h2]Heading[/h2]
<a href="url">Link</a> [url]url[/url]
<img src="image.jpg"> [img]image.jpg[/img]
<br> [br]
<blockquote>Text</blockquote> [quote]Text[/quote]
<ul><li>Item</li></ul> [list][*]Item[/list]
<ol><li>Item</li></ol> [list=1][*]Item[/list]
<code>Code</code> [code]Code[/code]
3. HTML to UBB in Practice
If you're manually converting HTML to UBB, the process is straightforward:

Find the HTML tags: Look for common HTML tags like <b>, <i>, <ul>, etc.
Convert them to UBB equivalents: Replace HTML tags with UBB tags, keeping the structure intact.
For example:

HTML: <ul><li>First item</li><li>Second item</li></ul>
UBB: [list][*]First item[*]Second item[/list]
4. Automated Conversion (Using a Script)
If you have a lot of HTML content to convert to UBB, you can write a script to automate this. Here's a basic example in JavaScript:

javascript

function convertHTMLtoUBB(html) {
let ubb = html;
ubb = ubb.replace(/<b>(.*?)<\/b>/g, '[b]$1[/b]');
ubb = ubb.replace(/<i>(.*?)<\/i>/g, '[i]$1[/i]');
ubb = ubb.replace(/<u>(.*?)<\/u>/g, '[u]$1[/u]');
ubb = ubb.replace(/<a href="(.*?)">(.*?)<\/a>/g, '[url]$1[/url]');
ubb = ubb.replace(/<img src="(.*?)" alt="(.*?)">/g, '[img]$1[/img]');
ubb = ubb.replace(/<blockquote>(.*?)<\/blockquote>/g, '[quote]$1[/quote]');
ubb = ubb.replace(/<ul>/g, '[list]');
ubb = ubb.replace(/<\/ul>/g, '[/list]');
ubb = ubb.replace(/<li>/g, '[*]');
ubb = ubb.replace(/<\/li>/g, '');
ubb = ubb.replace(/<p>/g, '[p]');
ubb = ubb.replace(/<\/p>/g, '[/p]');
return ubb;
}

let htmlContent = "<p><b>Hello</b>, <i>World</i>! <a href='http://example.com'>Click here</a>.</p>";
console.log(convertHTMLtoUBB(htmlContent));
Explanation of Script:
This script uses regular expressions to search for HTML tags and replace them with the corresponding UBB tags.
It handles common formatting tags like <b>, <i>, and <a>.
Conclusion
Converting HTML to UBB involves translating HTML tags into the simplified UBB markup format, which is widely used in forum software like Ultimate Bulletin Board (UBB). By manually or programmatically replacing HTML tags with their UBB equivalents, you can easily transform HTML content into forum-ready posts.