prettyPrint() doesn't get called on page load

Question

I\'m trying to prettify my code in Blogger. I\'ve linked Google JS and CSS files to my template. The problem is that I want the code to be prettified on page load, so I add

Answer 1

I believe your test page is using Blogger's "Ajax templates" (not sure what the official name is), whereas the other link you posted is using classic templates.

If you reload your test page, you'll first see the Blogger logo in the middle of the page, then your content appears. If you view the test page source, you'll see a lot of code, but not your content. I believe with layout templates, Blogger's code first runs, then it fetches your content using Ajax. Any JavaScript code that runs on document ready (DOMContentLoaded) or window load will run before your content is loaded into the page.

I believe if you add a HTML/Javascript widget to the page (after your content block), then include a call to prettyPrint() within that widget, it should be called every time a post is displayed.

---

Update: The official name of this template is "Dynamic Views", and it appears that the HTML / JavaScript widget isn't supported for Dynamic Views. I can't find any mention of an API that lets you hook into Blogger's JavaScript, so I believe the answer (for now at least) is that it's not possible to add template-level code to do what you want. The most practical way would be to include a script tag with prettyPrint() in every post :-(

---

Update 2: I've traced through Blogger's code and I think I've found a suitable (and bindable) event. Try including this after the Dynamic Views code (in the head element, after the tags):

The viewitem event is triggered every time the user views an item (which can happen multiple times in the page's lifetime). The element argument is a jQuery object of the item's container element, so if you want to save prettyPrint() a little time you can do this: