Google has announced new improvements to the Blogger Template HTML Editor. It now supports line numbering, syntax highlighting, auto-indentation and code folding. The Option To "Expand Widget Templates", in the Template "Edit HTML" Wizard, is No More.
The new Template "Edit HTML" wizard replaces the single "Expand Widget Templates" option with selective gadget ("widget") expansion. Now referred to as "folded" code, a concealed widget code section is identified by a fold marker ("sideways arrow icon"), next to the line number.
Hints on using the new template HTML editor
If you want to search for a code in the HTML editor, click inside the editor, click the "Format template” button, press CTRL F on your keyboard and enter what you want to find in the search box that appears inside the editor. Then, hit the "ENTER" button on your keyboard.
CSS rules are also folded and you can find them at the top of the template.
<b:skin>---</b:skin>
and
<b:template-skin>---</b:template-skin>
Below is a screenshot of the new HTML editor:
To see the new template HTML editor, click the “Template” tab on the Blogger dashboard, then the “Edit HTML” button.
Uses of the buttons of the new HTML editor
There are some new buttons at the top of the template editor!
Some of the buttons have obvious uses — the "Back" button takes you back to your Blogger dashboard, the "Save template" button saves your template. The uses of the other buttons are highlighted below:
In a post on the Blogger Buzz blog, 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.
What's your take on this new editor?
The new Template "Edit HTML" wizard replaces the single "Expand Widget Templates" option with selective gadget ("widget") expansion. Now referred to as "folded" code, a concealed widget code section is identified by a fold marker ("sideways arrow icon"), next to the line number.
Hints on using the new template HTML editor
If you want to search for a code in the HTML editor, click inside the editor, click the "Format template” button, press CTRL F on your keyboard and enter what you want to find in the search box that appears inside the editor. Then, hit the "ENTER" button on your keyboard.
CSS rules are also folded and you can find them at the top of the template.
<b:skin>---</b:skin>
and
<b:template-skin>---</b:template-skin>
Below is a screenshot of the new HTML editor:
To see the new template HTML editor, click the “Template” tab on the Blogger dashboard, then the “Edit HTML” button.
Uses of the buttons of the new HTML editor
There are some new buttons at the top of the template editor!
Some of the buttons have obvious uses — the "Back" button takes you back to your Blogger dashboard, the "Save template" button saves your template. The uses of the other buttons are highlighted below:
- "Jump to Widget" lets you go straight to a specific widget in your code
- "Edit Template & Preview Template" toggle these buttons to switch from the html view of your blog to a preview of your blog with the changes you've made to your template.
- "Format Template" cleans up your code to make it easier to read and search. It does not add or remove anything.
- "Revert Changes" lets you delete your unsaved changes to your template. This will be very useful whenever you notice a mistake in your preview!
- "Revert Widget Templates to Default" clears all of your changes to widgets and resets them to their original state.
In a post on the Blogger Buzz blog, 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.
What's your take on this new editor?
Looks cool and will try it asap. Waiting for improvements in the comment system.
ReplyDeleteNice but seems one still have to study it very well. trying to find ]]></b:skin> but cant find it in the new html editor. pls help
ReplyDeleteGotten, 'll try it out later. Please how can you be contacted through e-mail?
ReplyDeleteAAAAhhh Jide!! i suggest you prepare a tutorial on how to use this new blogger template HTML
ReplyDeleteThat's a great one. You know I almost destroyed my blog with the revert to default theme but I am glad all is well. Cheers!
ReplyDeleteRegards WorldWebSurfers.com
This is a very nice article on blogger html editor i like your article.
ReplyDeleteI noticed this when I tried working on one of my blogs. At first I taught it was from the template I uploaded, but was clear on it when I discovered same on my Tech blog NaijaTechBlog.
ReplyDeleteI really found this new Blogger HTML Editor sweet. Thumps up Jide!
Thanks and will try it now
ReplyDelete