De esta manera podemos insertar Gists de GitHub en nuestro blog sin necesidad de usar Javascript y haciéndolo mas amigable para los buscadores.
Embedding GitHub gists SEO friendly – WordPress
<?php // Embed gist without JavaScript in WordPress wp_embed_register_handler( 'gist', '/https?:\/\/gist\.github\.com\/([a-z0-9\/]+)([\?\#]file[=-].*)?/i', 'qr_embed_gist' ); function qr_embed_gist( $matches, $attr, $url, $rawattr ) { if(empty($matches[1])){$matches[1]=null;} if(empty($matches[2])){$matches[2]=null;} // Query single file $file = wp_remote_get( esc_url_raw( 'https://gist.github.com/' . esc_attr($matches[1]) . '.json' ) ); if ( !is_wp_error($file) && 200 == $file['response']['code'] ) { $giton = $file['body']; $giton = json_decode($giton, true); $embed = '<pre><code class="gist-embed">' . preg_replace( "/^\s+|\n|\r|\s+$/m", "", $giton["div"] ) . '</code></pre>'; wp_enqueue_style( 'gist', esc_url_raw( $giton["stylesheet"] ) ); }else{ $embed = 'Error: ' . $file['response']['code'] . ' - Invalid Gist URL'; } return apply_filters( 'embed_gist', $embed, $matches, $attr, $url, $rawattr ); }
<?php // Another way to Embed gist with <noscript> as fallback - WordPress wp_embed_register_handler( 'gist', '/https?:\/\/gist\.github\.com\/([a-z0-9\/]+)([\?\#]file[=-].*)?/i', 'qr_embed_gist' ); function qr_embed_gist( $matches, $attr, $url, $rawattr ) { if(empty($matches[1])){$matches[1]=null;} if(empty($matches[2])){$matches[2]=null;} // Query single file $urlx = esc_url_raw( 'https://gist.github.com/' . esc_attr($matches[1]) ); $file = wp_remote_get( $urlx . '.json' ); if ( !is_wp_error($file) && 200 == $file['response']['code'] ) { $giton = $file['body']; $giton = json_decode($giton, true); $giton = strip_tags($giton["div"], '<a>'); $embed = '<script src="' . $urlx . '.js' . '"></script>'; $embed .= '<noscript><pre><code class="gist-embed">' . preg_replace( "/ |\s+$/m", "", $giton ) . '</code></pre></noscript>'; }else{ $embed = 'Error: ' . $file['response']['code'] . ' - Invalid Gist URL'; } return apply_filters( 'embed_gist', $embed, $matches, $attr, $url, $rawattr ); }
Ejemplo:
En el código anterior se muestran dos métodos distintos, el primero inserta el HTML de manera directa en la página y el segundo utiliza el método tradicional con Javascript, pero con <noscript>
como respaldo.