Octopress and jQuery

It's always the little things that take hours to figure out.

Reading time: about 1 minute (192 words).

In the process of theming Axiomatic Semantics, I came across a virtually undocumented (in the Octopress sphere) caveat when including jQuery elements. A number of javascript functions in the Octopress source use $ as a variable. This is not uncommon; although jQuery aliases to $ - which causes some confusion in the processing of Octopress’ functions. My issue was the GitHub aside constantly being stuck at the Status Updating… phase. To overcome this issue, the simplest method is to insert the jQuery include in after_footer.html, but if you need the call before then for whatever reason and want it in head.html; you’re gonna have a bad time.

The fix is quite simple:

    $.noConflict()

will return control of $ back to Octopress as old references of $ are saved during jQuery initialization; noConflict() simply restores them for use again. You can read more about it in the jQuery documentation.

Note: This is not to be confused with the Status Updating… bug that was rectified in Octopress 2.0 when GitHub updated their API to v3. If you’re using an older Octopress version, a rake update_source should take care of that problem.