How To Use The New Blogger HTML Editor

The Blogger template editor now includes a number of changes that seem interesting and make it much more friendly than it was.

To begin with, what we see now is all the template’s code starting with numbered and colored lines showing us different code snippets: tags, variables, properties, etc.. depending on the HTML, CSS, JavaScript and even the language of Blogger – include, b:if and other occurrences.

blogger template, blogger tricks, blogger widgets

This is what any decent external editor does, but certainly, from now on it will be much easier to find that little bug that drives us crazy when we omit quotation marks or add one more semicolon. This also applies to CSS, which appears mostly in dark blue without distinguishing selectors and rules, but the rest is a major improvement.
Another great help are the numbers that appear in front of each fragment of code, so that we can easily pinpoint and correct errors of this type: “Error parsing XML, line 103, column 9: The element … “

Using the New Blogger Template HTML Editor

When you want to search for a code in the HTML editor, click inside the editor and press CTRL + F on your keyboard, then enter what you want to find in the search box that appears inside the editor.

Finally, hit the “ENTER” button on your keyboard and it should take you to the requested code.

If you want to be taken to the section of code that belongs to a particular widget, just click on the Jump To Widget button at the top of the editor, choose the widget’s name from the list and it will take you directly to that portion of code.

The CSS rules can be found folded at the top of the template, between <b:skin>…</b:skin> and <b:template-skin>…</b:template-skin> tags. To expand them, you have to click on the sideways arrow next to the line number.

Another great functionality is that now we can Preview Template in the same window without needing to leave the page and we can easily go back to customize our template by clicking on the Edit Template button.

Finally, Format template re-orders the code, adding indentation automatically.

As always, we must use the Save button for the changes to take effect or we can Revert the changes.

And that’s it. With a bit of effort, we can easily familiarize with this new HTML editor. Surely as usual and even reasonable to be something inherent in the human condition, this change does not appeal to many. Same with the Lightbox for images, the new template designer, the new desktop and other new things that have been added in the past. But who now remembers that they once were new?
———-
For more info, check out this post on the Blogger Buzz blog, where Google software engineers +Samantha Schaffer and +Renee Kwang explained the steps for moving the date of a blog post from above the post title to underneath it, as an example in using the new Blogspot HTML editor.

Related Posts

How to Use Character Entities in CSS, HTML and JavaScript

Sometimes, when using scripts, we must write special characters like accents by using a special set of codes called character entities. However, these don’t always look good…

How to Turn Off Auto Enhance for Blogger Photos

When you go to upload photos on Blogger, look closely for changes between the picture you uploaded on your computer and how it looks on Blogger. If…

Where To Find Free Blogger Backgrounds and Textures

Blogger is a fantastic tool for amateur and professional writers that have a passion for publishing online content. Unlike WordPress or hosting companies that require you to…

How To Set Up a Custom Domain in Blogger

Our web today is a wonderful place. It’s increasingly become a knowledge hub for strollers around the globe. And you know what the best part is? It…

Redirect Blogger 404 Error (Page Not Found) To Homepage

A 404 error page tells you and search engines that a page is not found by displaying a text similar to “Sorry, the page you were looking…

How to Hide Posts from Blogger Homepage

The point of blogging is to make your blog posts visible to your target audience as well as to search engines. However, there are times when you…

Leave a Reply

Your email address will not be published.