Introducing the Online HTML Editor For Blogger's

After the CSS Prettify for CSS, we are now releasing a web editor, which is we called as Online HTML Editor For bloggers, this Online Editor has been made to simplify and enhance your Coding Experience. Built in Tag, brackets and tab handler, and the active line highlight mode lets you focus on your content. it’s not really unique or new editor in world of blogging, but we have tried to create something different we have seen on internet. It’s may not be look professional Editor but we have added some advance functionality as we mostly seen in professional HTML document editors, which we will discuss later. The editor have pretty strong functionality to read the XML (i.e blogger template) document and quickly load the document inside Iframe after pressing the preview button. So let’s see the example below and then we will learn the features of the editor.

First, let's take a look at our simple XML file. Because this is a quick introduction, I'll run through the screen shot a bit quicker way than sharing full code of XML document.

wow..!! It’s look amazing, now try it yourself and leave your feedback in the comments below.

Useful features of the editor

• Syntax Highlighter

  Syntax Highlighter is a characteristic feature of code editor, which gives the order to change programming language such as JavaScript code into different colors based on language. Spicy Blogging does not have its own syntax highlighting plugin, It uses CodeMirror Syntaxhighlighter to Prettify the HTML, JavaScript, CSS and XML code.

• Line Numbering

  Line numbers at least is a must in a basic editor, Why? because If you are getting error messages line numbers would let you help where is the error exist and where it's come from.

• Bracket And Tag Closer

  When typing an html document, Editor will close tags and brackets automatically such as "html" and "{}" using auto bracket and tag closer addons. It's one of the most smart feature for an advance code editor.

• Highlighting Active Line

  Editor will highlight the current line when user click anywhere in the screen that entire line gets highlighted based on the terms of CSS.

• Responsive Design Even Useful On Smart Phones

  When we talk about responsive design in terms of web design, it's mean that layout will be re sized based on the view port or in other words users screen resolution. Editor will work like horse on mobile devices and let you help to test and create webpages on small screens.

Why Online HTML Editor

Its just little approach to give our reader a quick and easy tool to test blogger templates, Mostly whenever bloggers need to edit template they use blogger default editor which take less than one minute (depend on your connection speed) to save the template and then they can see the live preview. But by using our online editor the live preview is just away from only one click and your template will be live in the iframe. So I think its enough to tell you why online html editor rather than using an offline editor.

Credits

CodeMirror and it's addons is Open Source components, which released under MIT Lincese. You can find the source code of their open source projects along with license information on the CodeMirror official website. We acknowledge and are grateful to these developers for releasing as open source project.

Need Help

As always, please feel free to leave your comments if you need help, have feedback, ideas to improve the editor, or you simply want to report bug! You can reach us by posting your comments in the form below. We are more than happy to help our readers as much as we can. Peace and blessing :)

Ishtiaq Ahmad on September 15, 2015