You are here

H5P Guides

WordPress Customization

If you wish to do local modifications in order for H5P content to fit better on your site, this is the place for you.

Hooks / Actions

The H5P WordPress plugin has the same hooks as the Drupal module does. These are useful altering various things.

For a complete list and instructions on how to use them, check out the examples in the H5P Mods plugin.

Content URLs

Sometimes you might need a static URL for your content, e.g. if you're storing results or relaying data to other services. You can use the content's iframe embed URL for this, but you might run into issues if you've disabled the embed dialog. What you want to do then is add an option to wp-config.php which changes this behaviour. Adding the following code to wp-config.php will make sure that the content URLs are always working:

define('H5P_EMBED_URL_ALWAYS_AVAILABLE', true);

Development Mode

Enabling the development mode in wp-config.php will make your H5P installation totally ignore the patch version of libraries. This means that if you upload an older or the same version of a library it will replace the existing one, no matter what.

define('H5P_DEV', true);

Be warned! You should never enable this option for a production site.

Comments

Thu, 12/10/2015 - 14:11

Full screen

I have installed this plugin on wordpress, and create intractive video so I want to auto play and full screen default.pleas help me

Log in or register to post comments

falcon's picture

Thu, 12/10/2015 - 15:15

You want it to automatically

You want it to automatically go into fullscreen and start playing when the page is viewed? I'm afraid that isn't possible with the current version, and automatic fullscreen is difficult to achieve because of security concerns, but possible if for instance the interactive video is on slide 2 of a presentation. The full screen may then be triggered when the user clicks the navigation button, but this probably isn't recommended.

Log in or register to post comments

Fri, 12/11/2015 - 06:50

Replace Video

Thanks for replay.

I want to second costoimze when play vodeo and cleck on text (Interactive Video) and replace video this page of video tag,I want to recycle this process. Its possible and other js customize supported or not?

Log in or register to post comments

falcon's picture

Fri, 12/11/2015 - 16:20

Sorry, didn't get the

Sorry, didn't get the question. Could you try to rephrase it?

Log in or register to post comments

Tue, 12/15/2015 - 12:57

I wANT customize inrectove

I wANT customize inrectove video same frame its posible?

Log in or register to post comments

falcon's picture

Tue, 12/22/2015 - 11:00

I'm sorry, I didn't get the

I'm sorry, I didn't get the question. Could you try to rephrase?

Log in or register to post comments

Wed, 03/02/2016 - 11:57

Allow wp subscribers to create H5P content

Hi

I have installed h5p on my wordpress installation www.skeelio.com and would like to get my subscribers to also be able to create and share h5p via my portal in the same way users create or upload youtube videos (Just like the h5p website). Your help is greatly appreciated.

Log in or register to post comments

icc's picture

Thu, 03/03/2016 - 17:24

Hi! Currently, it's only

Hi! Currently, it's only possible to create content inside /wp-admin. Using a plugin that can change the permissions for roles, you should be able to give your subscribers access to creating H5Ps. I haven't tried it my self so I can't recommend any plugin, however, it should be possible to do.

We have also looked at the possibility of creating a shortcode for inserting the editor into pages, templates etc, but there hasn't been any real need for it, yet.

Let me know if it works out for you with the permissions.

Log in or register to post comments

Thu, 08/04/2016 - 10:37

custom validations for textfileds with custom error messages

Hi I have installed the h5p plugin on wordpress. In my presentation I have textfields in every slide. I want to add some basic validations like (onfocus, onchange, add datepicker).

Can you suggest the way to go, I would like to include a custom js file with all the code for validation and trigger a function on click of next and previous buttons of the presentation)

Its urgent can you suggest a solution soon..

Thanks

Log in or register to post comments

icc's picture

Thu, 08/04/2016 - 10:52

Have you tried using jQuery

Have you tried using jQuery to locate the elements and add the event listeners?

You may have to use the domChanged event in order to know when each slide is added and then run the jQuery code that looks for the element on the slide. Some more information about the events in H5P can be found here: https://h5p.org/events

Log in or register to post comments

Wed, 08/17/2016 - 22:46

H5p video triger event

Hi,

i want to pop a message when video is ended.how can i do this

Log in or register to post comments

falcon's picture

Thu, 08/18/2016 - 09:22

Hi,To figure out when the

Hi,

To figure out when the video has ended you should probably use H5P's xAPI integration. When an event with result.completion = true and no context.contextActivities.parent[0].id from Interactive Video gets triggered you should be at the end.

Log in or register to post comments

Tue, 04/04/2017 - 17:07

Plugin h5p does not really work on word press (

Hello,

I was so happy to start using h5p ( that's the only reason for my wordpressblog) and then it does not work. I could install the plugin and I have all the different types of content to work with. I prepared some and then when I want to put them in my blog I receive the name and I do this but I cannot see anything. This starts already when I say save or upload. I tried it with a friends blog there it works fine and I can see my result. On my own page it stays empty.

I tried to install directly via my ftp server, but then I never get the chance to say activate. It is not shown there..

Thanks for trying to help me

Log in or register to post comments

icc's picture

Wed, 04/05/2017 - 10:16

I'm sorry to hear that you're

I'm sorry to hear that you're having issues. Try opening your browser's console(Ctrl+Shift+J in Chrome) to look for any error messages when viewing the page where the content should appear. Feel free to include a screenshot.

If there are no error messages, try reloading the page and/or checking your web server's error_log file.

Log in or register to post comments

Wed, 04/05/2017 - 15:22

I tried open it with chrome,

and I received some errors. We actually tried it with tablet of a collegue, whose plugin works on a different provider and it did not work on his either. So I believe that it has something to do with my provider.

Log in or register to post comments

Wed, 04/05/2017 - 15:25

I tried this now not only with your content

but using a very simple Fill in the blanks

And here is the log:

load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.7.3:9 JQMIGRATE: Migrate is installed, version 1.4.1
admin.php?page=h5p&task=show&id=2:247 GET http://blog.c-eng.eu/wp-content/uploads/h5p/cachedassets/e677c3bf0835274...
admin.php?page=h5p&task=show&id=2:247 GET http://blog.c-eng.eu/wp-content/uploads/h5p/cachedassets/e677c3bf0835274... 403 (Forbidden)
h5p.js?ver=1.7.13:843 Unable to find constructor for: H5P.Blanks 1.7
H5P.error @ h5p.js?ver=1.7.13:843
H5P.newRunnable @ h5p.js?ver=1.7.13:766
(anonymous) @ h5p.js?ver=1.7.13:132
each @ jquery.js?ver=1.7.13:2
each @ jquery.js?ver=1.7.13:2
H5P.init @ h5p.js?ver=1.7.13:92
(anonymous) @ h5p.js?ver=1.7.13:2012
c @ jquery.js?ver=1.7.13:2
fireWith @ jquery.js?ver=1.7.13:2
ready @ jquery.js?ver=1.7.13:2
H @ jquery.js?ver=1.7.13:2
h5p.js?ver=1.7.13:963 Uncaught TypeError: Cannot read property 'getCopyrights' of undefined
    at Object.H5P.getCopyrights (h5p.js?ver=1.7.13:963)
    at HTMLDivElement.<anonymous> (h5p.js?ver=1.7.13:149)
    at Function.each (jquery.js?ver=1.7.13:2)
    at init.each (jquery.js?ver=1.7.13:2)
    at Object.H5P.init (h5p.js?ver=1.7.13:92)
    at HTMLDocument.<anonymous> (h5p.js?ver=1.7.13:2012)
    at c (jquery.js?ver=1.7.13:2)
    at Object.fireWith [as resolveWith] (jquery.js?ver=1.7.13:2)
    at Function.ready (jquery.js?ver=1.7.13:2)
    at HTMLDocument.H (jquery.js?ver=1.7.13:2)
H5P.getCopyrights @ h5p.js?ver=1.7.13:963
(anonymous) @ h5p.js?ver=1.7.13:149
each @ jquery.js?ver=1.7.13:2
each @ jquery.js?ver=1.7.13:2
H5P.init @ h5p.js?ver=1.7.13:92
(anonymous) @ h5p.js?ver=1.7.13:2012
c @ jquery.js?ver=1.7.13:2
fireWith @ jquery.js?ver=1.7.13:2
ready @ jquery.js?ver=1.7.13:2
H @ jquery.js?ver=1.7.13:2

Log in or register to post comments

icc's picture

Wed, 04/05/2017 - 15:43

Hm, it looks like the plugin

Hm, it looks like the plugin's having trouble generating some files. Try adding the following to your wp-config.php and see if you're still getting this errors:

define('H5P_DISABLE_AGGREGATION', true);

Log in or register to post comments

Wed, 04/05/2017 - 16:13

where do I put this exectly?

Hi,

I tried to put this in the last line of the php and then I was not able to access my blog anymore. After taking it away it works again.

Log in or register to post comments

icc's picture

Wed, 04/05/2017 - 16:24

Put it between the<?php

Put it between the

<?php

and

/* That's all, stop editing! Happy blogging. */

Log in or register to post comments

Wed, 04/05/2017 - 16:31

I can open it again and it shows a warning on my blog but

it still does not work at all, I cannot see my content.

load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.7.3:9 JQMIGRATE: Migrate is installed, version 1.4.1
tether.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
transition.js Failed to load resource: the server responded with a status of 403 (Forbidden)
drop.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-progress-circle.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-help-dialog.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-message-dialog.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-simple-rounded-button.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-speech-bubble.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-tip.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-throbber.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-slider.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-score-bar.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-progressbar.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-ui.js Failed to load resource: the server responded with a status of 403 (Forbidden)
soundjs-0.6.0.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
odometer.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
arithmetic-quiz.js Failed to load resource: the server responded with a status of 403 (Forbidden)
sound-effects.js Failed to load resource: the server responded with a status of 403 (Forbidden)
countdown-widget.js Failed to load resource: the server responded with a status of 403 (Forbidden)
timer-widget.js Failed to load resource: the server responded with a status of 403 (Forbidden)
qa-generator.js Failed to load resource: the server responded with a status of 403 (Forbidden)
intro-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
game-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
result-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
transition.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-help-dialog.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-message-dialog.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-progress-circle.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-simple-rounded-button.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-speech-bubble.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-throbber.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-tip.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-slider.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-score-bar.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-progressbar.js Failed to load resource: the server responded with a status of 403 (Forbidden)
joubel-ui.js Failed to load resource: the server responded with a status of 403 (Forbidden)
soundjs-0.6.0.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
odometer.min.js Failed to load resource: the server responded with a status of 403 (Forbidden)
arithmetic-quiz.js Failed to load resource: the server responded with a status of 403 (Forbidden)
sound-effects.js Failed to load resource: the server responded with a status of 403 (Forbidden)
countdown-widget.js Failed to load resource: the server responded with a status of 403 (Forbidden)
timer-widget.js Failed to load resource: the server responded with a status of 403 (Forbidden)
intro-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
qa-generator.js Failed to load resource: the server responded with a status of 403 (Forbidden)
game-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
result-page.js Failed to load resource: the server responded with a status of 403 (Forbidden)
h5p.js?ver=1.7.13:843 Unable to find constructor for: H5P.ArithmeticQuiz 1.0
H5P.error @ h5p.js?ver=1.7.13:843
H5P.newRunnable @ h5p.js?ver=1.7.13:766
(anonymous) @ h5p.js?ver=1.7.13:132
each @ jquery.js?ver=1.7.13:2
each @ jquery.js?ver=1.7.13:2
H5P.init @ h5p.js?ver=1.7.13:92
(anonymous) @ h5p.js?ver=1.7.13:2012
c @ jquery.js?ver=1.7.13:2
fireWith @ jquery.js?ver=1.7.13:2
ready @ jquery.js?ver=1.7.13:2
H @ jquery.js?ver=1.7.13:2
h5p.js?ver=1.7.13:963 Uncaught TypeError: Cannot read property 'getCopyrights' of undefined
    at Object.H5P.getCopyrights (h5p.js?ver=1.7.13:963)
    at HTMLDivElement.<anonymous> (h5p.js?ver=1.7.13:149)
    at Function.each (jquery.js?ver=1.7.13:2)
    at init.each (jquery.js?ver=1.7.13:2)
    at Object.H5P.init (h5p.js?ver=1.7.13:92)
    at HTMLDocument.<anonymous> (h5p.js?ver=1.7.13:2012)
    at c (jquery.js?ver=1.7.13:2)
    at Object.fireWith [as resolveWith] (jquery.js?ver=1.7.13:2)
    at Function.ready (jquery.js?ver=1.7.13:2)
    at HTMLDocument.H (jquery.js?ver=1.7.13:2)
H5P.getCopyrights @ h5p.js?ver=1.7.13:963
(anonymous) @ h5p.js?ver=1.7.13:149
each @ jquery.js?ver=1.7.13:2
each @ jquery.js?ver=1.7.13:2
H5P.init @ h5p.js?ver=1.7.13:92
(anonymous) @ h5p.js?ver=1.7.13:2012
c @ jquery.js?ver=1.7.13:2
fireWith @ jquery.js?ver=1.7.13:2
ready @ jquery.js?ver=1.7.13:2
H @ jquery.js?ver=1.7.13:2

Log in or register to post comments

icc's picture

Wed, 04/05/2017 - 16:43

OK, it seems your browser is

OK, it seems your browser is having trouble viewing some of the files. Try opening one of the files directly in your browser, e.g. /wp-content/uploads/h5p/libraries/H5P.ArithmeticQuiz-1.0/js/arithmetic-quiz.js

If that fails, go the file system and check that the file exists and that the web server has permission to read the file. If everything is OK there then I'm guessing there is some sort of configuration, setting or option in the web server that disallows the serving of these files.

Log in or register to post comments

Wed, 04/05/2017 - 16:52

I checked the file and when I tried to open it I received the

following message:

You don't have permission to access /blog/wp-content/uploads/h5p/libraries/H5P.ArithmeticQuiz-1.0/js/arithmetic-quiz.js on this server.

So I need to talk to my provider?

Log in or register to post comments

Wed, 04/05/2017 - 17:17

I talked to the provider and now it works

I am not sure if others have the same problem. But I had a file called htaccess in my upload folder and after deactivating it everything works fine.

Thank you so much for your help. I am so looking forward to working with your plugin and my students.

Log in or register to post comments

icc's picture

Thu, 04/06/2017 - 10:15

Ah, that's great. I'm glad

Ah, that's great. I'm glad you got it working!

Log in or register to post comments

Tue, 08/01/2017 - 16:45

Integrate with Badgearoo

Hi

I'm trying to assign a badge (Badgearoo plugin) to the user when they complete a multiple choice quiz. Is there an easy way to integrate these two WordPress plugins? The Badgearoo custom assign function is PHP so I guess I could make an ajax call from the H5P.xAPICompletedListener but I'm hoping there's a better way?

Log in or register to post comments

icc's picture

Wed, 08/02/2017 - 11:10

Yes, there is!There's an

Yes, there is!
There's an action called 'h5p_alter_user_result' in WordPress that's triggered whenever results are set or updated. If you add a listener to this you'll know when to award the badge. Here's an example of the action in use by a plugin that integrates H5P with the MyCred plugin(for awarding badges and such), made by the talented rpetitto on wordpress.org: github.com/rpetitto/mycred-h5p/blob/master/mycredh5p.php#L67

Log in or register to post comments

Fri, 08/04/2017 - 18:58

Works a treat!

Thankyou so much, that works great!

Log in or register to post comments

saadiqbal's picture

Wed, 03/04/2020 - 12:39

H5P for myCred

We just released an FREE addon for H5P integration with myCred.me

https://wordpress.org/plugins/mycred-h5p/

Log in or register to post comments

Franko's picture

Thu, 05/10/2018 - 22:52

Memory Game with "audio extracts"

Hello,

I installed the memory game plugin in my site. I would like to know if it's possible to use audio extracts. I mean, at the time to make click over the images to be able to listen an audio extract. I have a code to play a sound by clicking but I don't know where to insert it in order to combine the function of the memory game and the function of the clicking sound. I hope it is understandable my subjet. Thank you for your help.

Franko

Log in or register to post comments

BV52's picture

Wed, 05/16/2018 - 05:16

Hi Franko,Please see my

Hi Franko,

Please see my answer here.

-BV52

Log in or register to post comments

Franko's picture

Wed, 12/05/2018 - 04:27

Audio in memory game

Hello BV52,

You know, I am very happy. I can see that now it is possible to insert audio in memory game. Thank you so much. That tool is extremely important for teachers. Thank you so much!

Log in or register to post comments

Wed, 05/30/2018 - 10:48

Replace Script

Hi!

I want to add some components to the H5P windows and the most simple way to do this for me is to replace some of the original js files with copies of them which contains my changes.

function h5pmods_alter_scripts(&$scripts, $libraries, $embed_type) {
  if (isset($libraries['H5P.DragQuestion'])) {
    $scripts[] = (object) array(
      // Path can be relative to wp-content/uploads/h5p or absolute.
      'path' => '/score-tracking.js',
      'version' => '?ver=1.2.3' // Cache buster
    );
  }
}
add_action('h5p_alter_library_scripts', 'h5pmods_alter_scripts', 10, 3);

How do I use this code to do this? For example to replace the h5p-action-bar.js file.

That's my attempt:

unction h5pmods_alter_scripts(&$scripts, $libraries, $embed_type) {
  if (isset($libraries['H5P.ActionBar'])) {
    $scripts[] = (object) array(
		
      'path' => 'wp-content/plugins/h5p-mod/h5p-action-bar.js',
      'version' => '?ver=1.2.3'
		
    );
  }
}
add_action('h5p_alter_library_scripts', 'h5pmods_alter_scripts', 10, 3);

Thank you!

Log in or register to post comments

BV52's picture

Thu, 05/31/2018 - 03:19

Hi ThreepwI think your

Hi Threepw

I think your question has been answered here.

If you have further concerns feel free to post in the forums.

-BV52

Log in or register to post comments

Fri, 08/24/2018 - 11:55

h5p editor

Can we have add mathematically symbols in h5p editor in wordpress.

Log in or register to post comments

BV52's picture

Mon, 08/27/2018 - 04:14

Hi chauhan04amit,There have

Hi chauhan04amit,

There have been several discussions to have more flexibility in adding mathematical symbols in H5Ps. Here's a sample thread.

-BV52

Log in or register to post comments

Franko's picture

Wed, 12/05/2018 - 04:36

Customize Speak the words set

Hello, I would like to customize Speak the words set but simply I can't... I could customize Drang and drop and change its backgrounds by replacing some code in h5p php library styles and cachedassets css but I really can't find the codes of Speak the words... Can you please get some information about that? Thank you so much.

Log in or register to post comments

BV52's picture

Wed, 12/05/2018 - 09:46

Hi Franko,The easiest way is

Hi Franko,

The easiest way is to use a PHP hook, to add your own CSS-file to the content type. Please visit the Visual Changes page for more details.

-BV52

Log in or register to post comments

Franko's picture

Sun, 01/27/2019 - 04:04

Thank you so much. I could do

Thank you so much. I could do it by using H5PMods. It is wonderfull. Thank you so much.

Log in or register to post comments

dharmin.flickdevs

Tue, 02/12/2019 - 07:30

Restrict access to defined referral URLs

I want change Restrict access to defined referral URLs generated by the plugin none-guessable like "slskjlskejse23ß0428340923". is it possible?

Log in or register to post comments

icc's picture

Fri, 04/12/2019 - 13:08

I'm not sure I understand

I'm not sure I understand what you want to do? Where are these generated?

Log in or register to post comments

Thu, 03/28/2019 - 16:54

save audio from audio-recorder

Hello,

thanks for the great audio-recorder plugin. I want to add it to an wordpress site of mine with woocomerce and save the users audio input.

Is it possible to customize the plugin- so that i can change the download button into a button that stores the audio in the order and attach it to his order?

Log in or register to post comments

BV52's picture

Fri, 03/29/2019 - 09:27

Hi nhyx,Yes this is possible

Hi nhyx,

Yes this is possible with some changes to the code. You can make these changes or you can ask a developer to do it for you. You can use these documentation as a starting point.

-BV52

Log in or register to post comments

Wed, 04/10/2019 - 01:51

unblock content after watching video

Hi Guys, is posible to modify 'Interactive Video' content type, to unblock a custom post for a user after he see the video? where can i find an example or documentation about this kind of modifications? thanks in advance

Log in or register to post comments

BV52's picture

Wed, 04/10/2019 - 08:39

Hi dsuarezdev,This page

Hi dsuarezdev,

This page provides some information on how to make changes to the contents.

-BV52

Log in or register to post comments

sdsgroup's picture

Thu, 12/19/2019 - 17:35

Course presentation: Automatic run slides

Hello. I would love to make slides in the course presentation, with automatic run, for example every 10 seconds the slide changes automatically.

There is a pluggin doing it already. They have auto slide and slide delay time. It is called Slider hero.

can we get this with H5P already?

Is there any way to get it?

thank you!

Log in or register to post comments

BV52's picture

Thu, 12/19/2019 - 17:41

Hi sdsgroup,This feature is

Hi sdsgroup,

This feature is not yet available for Course Presentation.

-BV

Log in or register to post comments

sdsgroup's picture

Thu, 12/19/2019 - 18:08

automatic run presentation slides in course presentation

thanks a lot for the fast answer.

like you said yet ...
Do you know if we will be able to have it?
Anybody is working on it already?
thank you again

Log in or register to post comments

Fri, 07/23/2021 - 14:48

Buttons

Does anyone know how to add buttons such as reshuffle or restart?

Log in or register to post comments

Fri, 06/17/2022 - 20:57

drag & drop

Hello. I want to use drag & drop with multiple correct answer. of 20 images the correct sequence will be of only three images to be deposited in a container. now the chek tells me which are the right and wrong figures. I want you to tell me if they are correct only if all three are correct otherwise, even if only one drop is wrong I want to return the feedback of the sequence error only.

Log in or register to post comments

Mon, 04/10/2023 - 06:55

I want to get the h5p object instead of the shortcode in text

Hello, I want the associated h5p object to be loaded in a wordpress page after selecting from a combobox, currently I only get the shortcode in text. Could you tell me what instruction I should add to load the object instead of the text?

Log in or register to post comments

Pages

H5P is a registered trademark of H5P Group
Privacy policy | Copyright © 2024