Web Applications Stack Exchange is a question and answer site for power users of web applications. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm having difficulty embedding gists in my Tumblr posts. I want to add a tutorial on solving a problem and I want to include source code of the algorithm in my post with syntax highlighting.

I tried to include the embed code of the gist in the HTML of the post, but it didn't work. Can anyone tell me how to do this?

share|improve this question

migrated from stackoverflow.com Oct 23 '13 at 3:44

This question came from our site for professional and enthusiast programmers.

up vote 2 down vote accepted

Embed a Gist on Tumblr

There are two ways:

Dirty / Quick:

When creating a post, click HTML and then add in the following line:

<script src="https://GISTURLHERE.js"></script>

This will then include the Gist. The concern with this is the Tumblr parser could remove the inline script tag.

Clean / Slower

Use the following lib: https://github.com/blairvanderhoof/gist-embed

This will embed the gist, after reading the URL from the data-attr. The code block should be unaffected by Tumblrs parser.

There are alternatives to this solution, but afaik the basics for most are the same.

Take a URL (to your gist) and then create a script tag pointed to that URL. Once the script has loaded, the gist will be rendered.

Hope that helps.

share|improve this answer
Thankyou so much :) – chaithu Oct 22 '13 at 5:11

Import following scripts to theme.html

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="http://static.tumblr.com/fpifyru/VCxlv9xwi/writecapture.js"></script>
<script src="http://static.tumblr.com/fpifyru/AKFlv9zdu/embedgist.js"></script>

Then just add

<div class="gist">[gist URL]</div>


<div class="gist">https://gist.github.com/1395926</div>
share|improve this answer

A little update to this code, as Tumblr Rich text editor kindas mess with the "div' tag

<script src="http://static.tumblr.com/fpifyru/VCxlv9xwi/writecapture.js"></script>
<script type="text/javascript">
    $(function() {
            function(index, element) {
                if ( $(element).attr('href').indexOf('gist.github.com') > 0 ) {
                    var divElement = $('<div></div>');
                    writeCapture.html(divElement, '<script src="'+$(element).attr('href')+'.js"></'+'script>');


share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.