Blogger Template Formatting: The Secret to Perfect Indentation

Hello! 👋

Welcome. Benvenuto, accomodati.

Have you been wondering how to make your Blogger XML easy on your eyes and your blood pressure?

I'd wager you have. But since nobody talks about this — maybe — then I shall talk about this.

Talking commences.

You see, on Blogger XML template, 5,000+ lines of code is not something to take lightly. We need consistent indentation to clearly see where each tag begins and ends.

---

An Example

⬆️ Blood pressure: 200/100. ☠️

---

THREE MAGIC STEPS

1. We select everything on the XML template. Hit:

   CTRL + A

2. Put "fake" indentation by pressing:

   TAB

3. Finally, hit:

   SHIFT + TAB

⬆️ Result. ✨

Afterwards, we can save that.

This auto indentation feature also works in post edit / create!

---

TWO MAGIC STEPS

From "THREE MAGIC STEPS" above, actually, we do not need to make the "fake" indentation — that was just me doing it because I am used to VS Code (Visual Studio Code).

So then, it is just TWO magical steps:

1. Select: highlight some parts or select all with —
   CTRL + A
2. Tidy it:
   SHIFT + TAB

For our information, this feature does not auto-indent JavaScript or CSS code block, or anything unparsed inside <![CDATA[ ]]> (Character Data) section. Well, it does sort of work, but... 🤔

You might want to try that.

We can tidy those parts (JS / CSS) manually in VSCode or other editor, then paste that into Blogger XML.

---

Additional Information

Blogger text editor implements CodeMirror .

The auto indentation using SHIFT + TAB is built-in feature from CodeMirror.

---

And therefore, the secret has been revealed.

That is all from me. I hope this tip is useful.

Cheerio!

Ciao!