Tuesday, July 9, 2013

How to add shortcode of Gists in WordPress

This code will help you to detect gists and embed them automatically on your website, add php code in your functions.php file of your active theme:

// [gist id="ID" file="FILE"]
function gist_shortcode($atts) {
return sprintf(
'<script src="https://gist.github.com/%s.js%s"></script>',
$atts['id'],
$atts['file'] ? '?file=' . $atts['file'] : ''
);
} add_shortcode('gist','gist_shortcode');

// Remove this function if you don't want autoreplace gist links to shortcodes
function gist_shortcode_filter($content) {
return preg_replace('/https:\/\/gist.github.com\/([\d]+)[\.js\?]*[\#]*file[=|_]+([\w\.]+)(?![^<]*<\/a>)/i', '[gist id="${1}" file="${2}"]', $content );
} add_filter( 'the_content', 'gist_shortcode_filter', 9);

All this formats will work in your WordPress Visual Editor:

  • https://gist.github.com/1147076
  • https://gist.github.com/1147076#file_annotated.js
  • https://gist.github.com/1147076.js?file=annotated.js
  • [gist id=1147076]
  • [gist id=1147076 file=annotated.js]
Disqus Comments