Blogger has an editor XML file that equipped with line number and code color. In this article i try to learn the color code that available in blogger editor.
 |
| Understanding Font Color In Blogger Template Editor |
How many color in Blogger template editor?
As my observation blogger provide more than 10 font color and 2 background colors to help the reader read the XML code in template editor. I do not know the exact color of the code. So i call the color as my wish. On this article i want to highlight this 10 colors that is being used in Blogger template editor.
 |
| The Various Color Font in Blogger Code Template Editor |
1. Background Color
Blogger use white color as template editor background and use grey color for code line number. The code line number is available on the left side. We can see on the picture above.
2. Grey Font Color for XML declaration and document type declaration
Blogger use grey color for XML declaration and document type declaration. There is only two line in Blogger template that use this color. Which are line 1 and line 2. However for the code for mobile condition it also has the grey color.
 |
| Grey Color for XML declaration and HTML declaration |
3. Darker Green Font Color for HTML tag and tag name
Blogger use green color for HTML tag and element. HTML tag are start with '< >' (opening tag) and end with '< />' (closing tag). Everything inside the opening and closing tag is called HTML element. The first code inside the < > is called tag name. We can see the <head> , <meta>, <title> on picture above has darker green color. For illustration we can see the code structure below.
 |
| Green Color for HTML tag and tag name |
4. Light Green Font Color for XML tag and XML tag name
Blogger
use light green color for XML code. Similar with HTML, XML code tag are start with '<
>' (opening tag) and end with '< />' (closing tag). The color is slightly different with HTML code color. If we look the code below we can see the <title> has darker green color. Meanwhile the <b:skin> tag has lighter green color.
 |
| Light Green Color for XML code |
5. Light Blue Font Color for HTML or XML attribute that relate to data blog
The light blue color are in certain location like the example below.
 |
| Light Blue in b:version and expr:dir |
6. Bright Blue Font Color for HTML or XML attribute name
HTML or XML element can have attributes. Blogger used bright blue color for HTML/XML attribute name. In the code bellow <div> is HTML tag, class is one of attribute for <div>. The code <b:section> is XML code. The code class, id, maxwidget, name, shoawddelemen are attribute name for the <b:section>
 |
| HTML or XML attribute name has Bright Blue Color |
7. Dark Red Font Color for value of attribute
Blogger use Dark Red for a value of an attribute. On code above we can see all the code with single quotation mark. They are the value of attribute on HTML or XML tag. For example for div element in HTML above we can that it has class attribute with
'cap-left', 'cap-right' value.
8. Dark Blue Font Color for Variable Definition and CSS
Blogger
use dark blue color for variable definition and also for CSS.
 |
| Dark Blue Font Color For Variable Definition and CSS |
9. Orange Font Color for data storage from Blog
The orange font color is being used to recognize data blog. This color also is being used for comment in coding.
 |
| Orange Font Color for data storage from Blog |
10. Purple font color for Javascript Function
The purle font color is being used for Javascript function.
Post a Comment for "Understanding Font Color Blogger Template"