Nov 7, 2018

How to modify Blogger's Dynamic Views template

These three lines launch the rendering engine that displays the blog:

window.onload = function() {

To update the templates, call blogger.templates().compile(). Place the call to compile() before the call to blogger.ui().configure().view(), then you can update the template before it's used.

For example to change RSS Icon:

  '{template:RSSIcon}' +
    '<a id="rssIcon" href="/feeds/posts/default" target="_blank">' +
    '<img width="28" height="28" ' +
       'src="data:image/png;base64,my-path-to-image" />' +
    '</a>' +

To replace Blog Header:

    .raw().replace("&lt;input", "{RSSIcon}&lt;input"));

Note that the < and > characters have to be encoded as &lt; and &gt; because Blogger uses XML templates.

To use Custom CSS:

  "#rssIcon {width="28" height="28";}");