Search code examples
pythonhtmlwordpressbokeh

How to get Bokeh HTML visualizations to show on WordPress?

I have a Bokeh dashboard of visualization that I created in Python. I have the HTML file saved. When I open the file with my browser, it brings up my graphs (like it is supposed to!). However, I am trying to display this dashboard on my WordPress site. Pasting the HTML code into the HTML page option on WordPress doesn't work. Does anyone know the trick for this, or can point me to the correct resources?

Solution

  • You can make a shortcode to include the code. You can either save the html to a file and get the contents of it, or just copy & paste the code into your shortcode. Add something like this to your functions.php file:

    function get_my_bokeh() {
    return file_get_contents( "http://www.example.com/path/to/bokeh.html" );
}
add_shortcode( 'print_bokeh', 'get_my_bokeh' );

    /* OR */

    function get_my_bokeh() { 
    ob_start(); ?>

    <!-- paste your HTML code here --> 

    <?php return ob_get_clean();
}
add_shortcode( 'print_bokeh', 'get_my_bokeh' );

    Then add the shortcode [print_bokeh] to the text editor.

    In both examples above you should clean out all of the <html> <head> & <body> elements that make up a whole HTML document and just have the content.