moski / gist-Blogger

Adding Gist support to blogger dynamic view
http://blog.moski.me/2012/01/gist-with-bloggers-dynamic-views.html
85 stars 52 forks source link
A simple way to embed gist into Blogger's dynamic view. By [Moski Doski](http://moski.me).

Usage

At the end of each of your blog posts, include the following code using the HTML editor:

<script src="https://raw.github.com/moski/gist-Blogger/master/public/gistLoader.js" type="text/javascript"></script>

Now to include any gist template just add the following anywhere in your blog post.

<div class="gistLoad" data-id="GistID" id="gist-GistID">Loading ....</div>

Replace "GistID" with your gist id.

Optionally, you can specify a file to be loaded if your gist contains multiple files using the data-file attribute, like this:

<div class="gistLoad" data-id="GistID" data-file="YourFileName.extension" id="gist-GistID">Loading ....</div><br />

Example:

<div class="gistLoad" data-id="4982341" data-file="gistfile2.cs" id="gist-4982341">Loading ....</div><br />

Development

If you want to work with this script locally. You need to clone the repo using

git clone git@github.com:moski/gist-Blogger.git

To start up the server, just run

rackup

Now, to use the local version of the script, change the script embed code in your post to the local version

<script src="http://localhost:9292/gistLoader.js" type="text/javascript"></script>

You also need to change the main script path inside (gistLoader.js)

//var gistBloggerPath = "https://raw.github.com/moski/gist-Blogger/master/public/gistBlogger.js";
var gistBloggerPath = "http://localhost:9292/gistBlogger.js";

That's it, now blogger will start calling your script.

Thanks