H5P content not appearing in WP posts

Which version of H5P Wordpress plugin are you using? I your are not using 1.1.0, you should upgrade, and try again. If you are using the latest version, please let us know if you are seeing any errors in your webserver logs or browser console.

I use WP with the Mantra theme, everything is up-to-date. The h5p games work in editing mode, but do not load in the post. My javascript console in FF gives two problems when I open the post.

A warning:
Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead
[line 30 in dcxBDoAgDETRC0kaFsbzQEWpQailLLi9kujS7fuTsYAlq0M1W5HTLEAZU1tDhaNCRSHWOlmIMwM3nwg_HGQoa9jFKZX8joZyZJPIi5M-Xo6rBen__aEb.js:31]

and an error:
TypeError: H5P is undefined [line 30 in the same js file]

And the game does not show. Any advice?

I'm guessing that your theme or site doesn't use jQuery, and therefor the interactive content can't be started. Version 1.1 of the plugin currently lacks the ability to load jQuery into the theme. This will be fixed in the next release.

It would be great if you could check that putting wp_enqueue_script('jquery'); into line 543 of wp-content/plugins/h5p/public/class-h5p-plugin.php actually fixes your issue. (That would be just above the comment "Add JavaScript with library framework integration") It could be that you're seeing another issue not yet reported.

Thanks for the response!
I changed class-h5p-plugin.php as suggested, but the behaviour is the same as before. I also beleive it may be different from the jQuery issue. First, because I am not getting any error that referes to jQuery. Second, because I also tried (after the suggested class-h5p-plugin.php failed) to install the WP jQuery plus plugin. It ruined the site's appearance (not irreversibly, only until I turned it off) and did not make h5p work either.
I am using the very popular Mantra theme and 13 quite popular plugins:
Add Tags And Category To Page And Post Types
Contact Form 7
Contact Form DB
Email Spam Protection
Hupso Share Buttons for Twitter, Facebook & Google+
MailPoet Newsletters
NextGEN Gallery by Photocrati
Official StatCounter Plugin
Shortcodes Ultimate
Simple Tags
W3 Total Cache
Wordfence Security
WordPress SEO

I tried disabling three (Wordfence, W3 total cache, Shortcodes Ultimate) that I though could possibly interfere with h5p, but with no luck.

More ideas?

I tried again to disable W3 Total Cache. It did not fix the problem, but this time my FF console gave more meaningful error messages, since the js files were not minified by W3 Total Cache. Here they are:

Error: in line 95 of h5p-integration.js
ReferenceError: H5P is not defined

Warning: line 1 of jquery.js
Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead

Error: line 1004 of h5p.js:
TypeError: H5P.init is not a function

Maybe it does have something to do with jQuery?

Thanks for the info. I'll set up a site locally with the same theme and plugins as yours, and then we'll see if I'm able to recreate the issues you're having. 

It seems like the `NextGEN Gallery` plugin changes the order of which the JavaScripts and the footer is printed. This causes H5P to crash. We'll make the H5P JavaScript code a bit more generic so that the loading order of the scripts and settings doesn't matter as much. This fix will be added to the next release of this plugin.

If you can't wait and wish to apply this fix your self, you can change line 577 of public/class-h5p-plugin.php to:
print '<script>var H5P = H5P || {};H5P.settings=' . $json_settings . '</script>';

Also:
Remove line 95 of public/scripts/h5p-integration.js and then insert the removed line after line 10 in the same file. It should look something like this:
jQuery(document).ready(function () {
H5PIntegration.i18n = {H5P: H5P.settings.i18n};
...

Thank you for reporting this issue and contributing to a better plugin :-)

I have another plugin--mapifypro--that pulls content from a custom post type.  For whatever reason, the h5p isn't appearing in that content... it's just blank.  I don't see the h5p application, I don't see the shortcode, and I don't see any errors in the console.

Take a look for yourself: http://locihouse.com/stage/map-location/new-hope-ghost-tours/?mpfy-pin=167

You should see the h5p app (the default "memory" game with the fruit) appearing in the right column just under where it says "New Hope Ghost Tours."  

I have been trying to troubleshoot this for hours and finally just caved and created a profile here and thought I could ask for some help.  Any ideas?

Thanks in advance.

I've had a problem in Wordpress with image hotspot like egymarton had. I've put the fixes you gave, images now show up in posts, but without image hotspots on them.

<a href="http://bekewul.com/test-h5p">http://bekewul.com/test-h5p</a> it's a test page.

I'am using Avada theme and i've got NExtgen plugin too.

Get same error, h5p not showing..

error like this 

https://1drv.ms/i/s!AtaBiDzx2TsHhDjAb3SHrLyOyMAO

I'm using the latest version at the moment, an the only error I get comes from the chrome console and says this:

ReferenceError: Can't find variable: H5PIntegration

Later, it points out to h5p.js (several lines:  414, 384, 381 and 1995). The error also mentions jquery.js.

I have tried installing WP jQuery Plus pluggin, but is didn't work. And the files are diferent from those of 2014...

Any idea? Thanks.

My problem is that H5P content is not displayed. And the only error I get in the javascript console is in h5p.js line 414.

The error says "Can't find variable: H5PIntegration", and the line is the one in bold.

 return '<base target="_parent">' +
         createStyleTags(H5PIntegration.core.styles) +
         createStyleTags(H5PIntegration.contents['cid-' + contentId].styles) +
         createScriptTags(H5PIntegration.core.scripts) +
         createScriptTags(H5PIntegration.contents['cid-' + contentId].scripts) +
         '<script>H5PIntegration = window.parent.H5PIntegration; var H5P = H5P || {}; H5P.externalEmbed = false;</script>';

I have continued looking for a solution and this is what I have found:

1/I was traying to place content into a Learn Press lesson instead of a WP post (sorry, but they look quite similar). I have found that -by now- Learn Press and H5P are not complatible. When I place h5p tags into a post, the work fine. (Wish I could do something to make them work together).

2/ In the admin site, when I try to create interactive video I can add neither interactions (tab 2) nor summaries (tab 3). This is what happens:

2.1/I click on "H5P Content-->Add New".
Just after loading the web inspector tells about a JS error: ckeditor.js line 770 (SyntaxError: Unexpected string literal ":". Expected either a closing ']' or a ',' following an array element.)

2.2/ Then I choose "Interactive Video" --> Tabs 2 and 3 don't work. I can only add a video. (image 1)
In the Wep inspector appears a new Error: "Can't find variable: CKEDITOR" (image 2)

Latest versions have been updated before making this post, except for WP itself (not 4.7 yet, but the version before).

If there is any try you want me to do, just tell me. Thanks a lot and congratulations for this great plugging.

1. Strange that it doesn't work. The shortcode system should be useable anywhere in WordPress – but there might be some exceptions if they're loaded through AJAX.

2. Ah, it seems your browser is having trouble loading the WYSIWYG / CKEditor. Which browser are you using? Try using another browser to see if you get the same error.
I would double check that the file available at: /wp-content/plugins/h5p/h5p-editor-php-library/ckeditor/ckeditor.js
is the same as this file: https://raw.githubusercontent.com/h5p/h5p-editor-php-library/stable/ckeditor/ckeditor.js
to do this it's probably easiest to copy paste their contents into an online diff tool. It might be that the file has gotten corrupted some how.

I have made a clean new wordpress installation. No themes (just the default), no pluggins except askimet and h5p, and CKEditor fails the same. Try CKEditor for wordpress and deactivating all the other pluggins even askimet, and with the old default wordpress theme, but nothing different.

At google I found this: https://wordpress.org/support/topic/not-working-on-wordpress-40/?replies...

It say's it's fixed for wp 4.0, but the solution (adding some lines to the theme's file functions.php) didn't work for me.

The last thing I found is this: CKEditor is Compatible up to: 4.3.8 (Source: https://wordpress.org/plugins/ckeditor-for-wordpress/)

Is this possible? Any tip?

Thanks for your support.

Ok, were you logged in to H5P.org when you sent it? I can't find this message when searching for your username. Anything else I might search for that will be in that message?

Everything is working now. Thanks to Pål J. for helping me on that. I don't now why, if fails -and continue failing- in my mac (several browsers), but it works perfectly when I try with another computer. Moreover, it works also combining Learnpress with H5P -I had read that they are incompatibles. 

Thanks to all for your help and for this incredible pluggin. Wish I could solve the faliure, but I have spent several hours and found nothing. 

Hi,

I've just had an issue come up where I've created H5P content for a "Lesson" page using the Sensei learning platform on Wordpress. I've made the page public and everything is viewable for the anonymous user except the H5P content. Once logged in, H5P displays correctly.

Similarly when I've embedded the content on another site (Edmodo) it displays only when I'm logged into the Wordpress site (where it was created).

I looked for a setting that might be relevant but I didn't see anything. Is there something obvious I'm not seeing?

Thanks!

Hi,
Make sure the embed button is available through the content settings (when editing the content).
Also make sure that the 'h5p_embed_access' capability is enabled for users that are not logged in.

You should also check your browser console for any error messages, and finally check your PHP error log for any error messages when this happens.

the H5P content appears in laptops and desktops but  didnot appear in mobile devices " itis blanked" , would you help , what cause this problem.

ps"i installed the plugin in different themes , and still have the same problem"