Kodular HTML Guide
Hello Koders, this guide is about using HTML in Kodular. This guide works on all Discourse powered communities. This guide is a Very Large guide. I am sorry if I make any mistakes. This guide will be updated regularly. So, let’s get started…
Kodular used HTML4, so HTML5 tags will not work here
What is HTML (Wikipedia)
Hypertext Markup Language ( HTML ) is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScript ans VBScript.
Web browsers receive HTML documents from a web server or from local storage and render the documents into multimedia web pages. HTML describes the structure of a web page semantically and originally included cues for the appearance of the document.
HTML elements are the building blocks of HTML pages. With HTML constructs, images and other objects such as interactive forms may be embedded into the rendered page. HTML provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are delineated by tags , written using angle brackets. Tags such as <img /> and <input /> directly introduce content into the page. Other tags such as <p> surround and provide information about document text and may include other tags as sub-elements. Browsers do not display the HTML tags, but use them to interpret the content of the page.
HTML can embed programs written in a scripting language such as JavaScript, which affects the behavior and content of web pages. Inclusion of CSS defines the look and layout of content. The World Wide Web Consortium (W3C), former maintainer of the HTML and current maintainer of the CSS standards, has encouraged the use of CSS over explicit presentational HTML since 1997.[2]
To make these things work
To make these things work, you will need to check “HTML Enabled”, which is found in advance of the label in the designer section. If you don’t do this, this HTML will not work.
And write code in the text section 
-⟶
Things Available to use in a label
The tags <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <p>, <b>, <strong>, <del>, <em>, <i>, <small>, <sup>, <sub>, <ul>, <li> are available in label according to me. Other tags like <table>, <td>, <th>, <thead>, <ol> etc are not usable in label.
You cannot make lists & tables in a label.
Bold Text
To make a text bold, you will need to add <b> at the start and </b> at the end like the following code
<b>Bold Text</b>
Result: 
You can also use <strong> at start and </strong> at the end. It’s your choice
<strong>Strong Text</strong>
Result: 
Make text italic
To make a text italic, you will need to add <i> at start and </i> at end. For example:
<i>Italic Text</i>
Result: 
On the other hand, You can use <em> at the start and </em> at the end. It’s also your choice
<em>Em Text</em>
Result: 
Underline a text
To add an underline to a text, you will need to add <u> at the start and </u> at the end. For example:
<u>Underlined Text</u>
Result: 
Add a line break to the text
If you want to add a line break to a text, you will have to use the <br> tag where you want to place the line break. For example:
<b>Bold<br>Text</b>
Result: 
Note: You can also use <br/>
Make a paragraph
To make a paragraph, use <p> at the start and </p> at the end. The <p> tag makes a text like a paragraph. You should use it to make a paragraph like:-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean pulvinar est in nisl iaculis maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris at lobortis sapien. Nullam risus neque, rhoncus eget libero congue, pretium dignissim est. Donec egestas lectus dui, at consequat nunc tempor et. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla dictum ullamcorper ipsum, quis blandit diam finibus eu. Donec ornare risus et elit convallis, nec mollis dui porta. Nulla facilisi. Aliquam sollicitudin ultrices odio, nec finibus erat. Etiam lacinia, nunc vel commodo sodales, tortor felis venenatis nisi, eu.</p>
Result: Sorry, will give it later
Make deleted text
If you have updated something and you ant to show users your edits, you should use <del> at start and </del> at end. For example:
<del>Deleted Text</del>
Result: 
Make a text subscript
In order to make a text subscript, use <sub> at start and </sub> at the end. For example:
<sub>Subscripted Text</sub>
Result: 
Make a text superscript
In order to make a text subscript, use <sup> at start and </sup> at the end. For example:
<sup>Subscripted Text</sup>
Result: 
Sorry, the text should be superscript
Make a text small
If you want to make a text small, you will need to use <small> at the start and </small> at the end like:
<small>Small Text</small>
Result: 
If you want to make a text very small, you will need to use multiple <small> like:
<small><small>Very Small Text</small></small>
Result: 
Make a text big
If you want to make a text big you will need to use <big> at the start and </big> at the end like:
<big>Big Text</big>
Result: 
If you want to make a text very small, you will need to use multiple <big> like:
<big><big>Very Big Text</big></big>
Result: 
Make a text heading
To make a text heading you will have to use between the <h1> and <h6> tags
Heading 1
To make heading 1 you will have to use <h1> at start and </h1> at end like:
<h1> Heading 1 </h1>
Result: 
Heading 2
To make heading 2 you will have to use <h2> at start and </h2> at end like:
<h2> Heading 2 </h2>
Result: 
Heading 3
To make heading 3 you will have to use <h3> at start and </h3> at end like:
<h3> Heading 3 </h3>
Result: 
Heading 4
To make heading 4 you will have to use <h4> at start and </h4> at end like:
<h4> Heading 4 </h4>
Result: 
Heading 5
To make heading 5 you will have to use <h5> at start and </h1> at end like:
<h5> Heading 5 </h5>
Result: 
Heading 6
To make heading 6 you will have to use <h6> at start and </h6> at end like:
<h6> Heading 6 </h6>
Result: 
Change font color
To change font color use <font color="{color name}"> at start and </font> at the end. For example:-
<font color="red">Your Text in RED</font>
Result: 
HTML Emojis
Emojis dont work in Kodular
Result:
Fractional Expressions
To write fractional expressions, you will have to use HTML Entities.
Some characters are reserved in HTML. If you use the less than (<) or greater than (>) signs in your text, the browser might mix them with tags. Character entities are used to display reserved characters in HTML. A character entity looks like this:
& *entity_name* ;
OR
&# *entity_number* ;
–More things later–
For a list of all HTML Entities, click here
That is for today, more things will be added later as you guys recommend me to add things
Other things
i have used no blocks
Images
Images of HTML Result
Files
I thought to give the files to help better understand. So here they are:-
AIA: HTMLEverything.aia (3.6 KB)
AIS: HTMLEverything.ais (5.5 KB)
APK: HTMLEverything.apk (5.0 MB)
Credits
Thanks to @bodymindpower for her idea of <small>
Thanks to @bestprintsf for his idea of single and multiple <big>
Thanks to @Vaibhav for his idea of fractional expression ie. HTML entities
Thanks to @e_sorrentino72 for his idea of emojis
Thanks
Thank you
I hope you liked this guide. If you have any type of question. Feel free to ask me. I will try my best to answer your questions. I wish a reply from you about my guide. By the ways, thank you so much.
If this guide helped you, please like this guide
to your list as mentioned there already
