The first major update to the Blogger Template Editor since 2006 . Loosely referred to as Edit HTML , it has gone though a complete makeover. The previous Editor appeared as a light box-style window and was pretty similar to the version available before Blogger switched to the new look back in October 2011. This update is a full-blown overhaul with build from scratch approach bringing a whole new set of features to the table.
The New Template Editor is using CodeMirror , a JavaScript component which provides an in-browser Code Editor. It has been modified a bit to add some Blogger specific functionalities ( Preview Template & Jump To Widget ) but the core appears to be same. Shifting to Code Mirror , which is open source and has a active development community around it ( Check it on Github ) is surely nothing less than awesome. It is used by sites like CodePen , CodeSchool , CSSDeck , JSBin as well as Google Apps Script just confirms the fact that it is ready for big-time use.
The New Editor is aimed at making Creation & Editing Blogger Template a lot easier for user with less experience in coding HTML/CSS/JS . Some of the specific additions are
Finding code related to a specific widget has become very easy , Just open the Jump To Widget Dropdown and select the widget of your choice. By making jumping to specific Widget Code block, it becomes easier for users to add code to render widget on specific page (Earlier it was a bit overwhelming to go through a lot of code to add those conditional tags ).
The ability to expand code makes the Template Editor look less cluttered and more clean. Current once you expand the code , there is no ability to collapse it again . May be they will add that in the future. And also after expanding the code block ,the triangle disappears but if that specific area is clicked again then the code collapses and the triangle reappears.
Giving a option to preview the template in the same window is well thought UX move , keeping the continuity of the Google UI and not at all compromising with the testing of the template. It will surely improve the workflow of many template designers.
There are few many features about this. That will be continued in our coming article so please keep reading and If you like this article then please subscribe to Our feeds and Like us on Facebook for Future Updates. Thank you.
The New Template Editor is using CodeMirror , a JavaScript component which provides an in-browser Code Editor. It has been modified a bit to add some Blogger specific functionalities ( Preview Template & Jump To Widget ) but the core appears to be same. Shifting to Code Mirror , which is open source and has a active development community around it ( Check it on Github ) is surely nothing less than awesome. It is used by sites like CodePen , CodeSchool , CSSDeck , JSBin as well as Google Apps Script just confirms the fact that it is ready for big-time use.
The New Features
Jump To Widget
Finding code related to a specific widget has become very easy , Just open the Jump To Widget Dropdown and select the widget of your choice. By making jumping to specific Widget Code block, it becomes easier for users to add code to render widget on specific page (Earlier it was a bit overwhelming to go through a lot of code to add those conditional tags ).
Expandable Code Segments (Code folding)
The ability to expand code makes the Template Editor look less cluttered and more clean. Current once you expand the code , there is no ability to collapse it again . May be they will add that in the future. And also after expanding the code block ,the triangle disappears but if that specific area is clicked again then the code collapses and the triangle reappears.
Inline Preview Template
Giving a option to preview the template in the same window is well thought UX move , keeping the continuity of the Google UI and not at all compromising with the testing of the template. It will surely improve the workflow of many template designers.
There are few many features about this. That will be continued in our coming article so please keep reading and If you like this article then please subscribe to Our feeds and Like us on Facebook for Future Updates. Thank you.
No comments:
Post a Comment