user1882752
user1882752

Reputation: 576

Wordpress use h5p short code within custom template

I have a custom display template, which us basically blank. I want to be able to pass a short code id to the page for it to display i.e. [h5p id="4"] I can do this easily enough on wordpress pages, but I want a single page to display different content depending on what the user selected before hand. Whereas I would have to create a custom page for each interaction which I dont want.

The format will eventually be:

<html>
<body>
//GET THE H5P id based on previous engagement- this part I have, its just the display
Custom h5p block [h5p id="4"]
</body>
</html>

I tried calling the short code with"

echo do_shortcode("[h5p id='1']");

But the page just loads as a blank. No error messages.

My actual code looks like so (dont laugh - I dont know wordpress)

<?php
    /*
Template Name: page_display
*/
global $wpdb;
//https://stackoverflow.com/questions/67467781/wordpress-use-h5p-short-code-within-custom-template
$template         = str_replace( '%2F', '/', rawurlencode( get_template() ) );
$theme_root_uri   = get_theme_root_uri( $template );
$template_dir_uri = "$theme_root_uri/$template";

$user_details_sql = 'SELECT
wp_users.user_nicename
FROM wp_users
WHERE id = ' . get_current_user_id();

$user_details_results = $wpdb->get_results($user_details_sql, OBJECT );

echo '<HTML>
<head>
<title>Archon Dashboard</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="' . $template_dir_uri . '/custom/style.css'  . '">
</head>
<body class="w3-theme">';

foreach($user_details_results as $user_details_result){
    
    echo 'Welcome back ' . $user_details_result->user_nicename . '<br />
    
        <div class="w3-container">
        <div align="center">';
        
    echo do_shortcode("[h5p id='1']");  
    echo '  
        </div>';
}
echo '
    </div>
</body>
</html>';

Upvotes: 1

Views: 180

Answers (1)

Oliver Tacke
Oliver Tacke

Reputation: 366

The do_shortcode function will replace the shortcode with the HTML for H5P's iframe, but you will have to add a

do_action( 'wp_footer' );

to your template, e.g. at the end. It's usually called when WordPress displays a footer.

H5P interprets that action as a signal that WordPress is done building the post/page and H5P can start its work: to actually fill the H5P iframe with life.

Upvotes: 1

Related Questions