SNORDIAN's H5P Resize Pulse

描述

PLEASE NOTE: I gave some of my free time to create this plugin. Using it and its source code is absolutely free. I don’t want any money from you. However, if you like this plugin, I kindly ask you to make a one-time donation of 2.50 EUR to the Rainforest Coalition (https://www.rainforestcoalition.org/donate) — or more if you can afford to.

H5P is a versatile plugin to add interactive content to your website. You may try to run it inside some fields that are created by other plugins, e.g. inside tabs, accordions, lightboxes, etc. And with some of them it seems that H5P doesn’t work although it is, but the content is set to a height of 0 pixels. That problem is described at https://h5p.org/manipulating-h5p-with-javascript.

The best solution would be to modify the plugin that’s including tabs, etc. to your WordPress site, but that’s not always possible. In some cases, this plugin may be a feasible workaround at least.

In “observer” mode, it will try to add a so called ResizeObserver to the container that holds the iframe with H5P content. That observer will send a resize pulse whenever the container changes in size, e.g. when it becomes visible. This should be a safe option just taking some extra resources.

In “interval” mode, it will trigger H5P to resize in regular intervals which should let it be displayed in many cases. However, if they appear too frequent, they may cause the browser to stall. Choose the time interval wisely! Also, some H5P content types may break that way. The only way around this is then the “selector” mode.

In “selector” mode, you need to determine a CSS selector that will identify all the elements that you interact with to display other contents, e.g. the tab buttons. If that selector is set in the plugin’s settings, it will trigger a resize pulse when that element is clicked. This way, you prevent stalling the browser or breaking H5P content types. Depending on how the other plugin was created, there may not ba a suitable CSS selector then.

If necessary, you can use the manage_h5presizepulse_options capability to control access to the plugin settings.

PLEASE NOTE: H5P IS A REGISTERED TRADEMARK OF H5P GROUP. THIS PLUGIN WAS NEITHER CREATED BY H5P GROUP NOR IS IT ENDORSED BY THEM.

安裝

Install H5P Resize Pulse from the WordPress Plugin directory or upload it manually and activate it. Done. You may want to customize the time interval though.

常見問題

None so far.

評價

2023年9月29日 1 reply
This is a simple, lightweight solution to a common problem when using H5P with WordPress. It works perfectly. The author is one of the most prolific developers of H5P content types and custom solutions around, so you can expect the coding and support to be top-notch, too.
2021年10月31日 1 reply
I had a problem in showing h5p content in tabs. I needed tabs or accordions format to show h5p content effectively. However, only the first tab showed the h5p content. I did not know what to do, but I found this plugin created by Oliver. This saved my day. Thank you, Oliver!
閱讀全部2個評價

貢獻者及開發者

“SNORDIAN's H5P Resize Pulse” 是一個開源的軟體。以下的人對這個外掛作出了貢獻。

貢獻者

將 SNORDIAN's H5P Resize Pulse 外掛本地化為台灣繁體中文版。

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

修改日誌

0.1.5

Add observer mode.

0.1.4

Fix release version.

0.1.3

Fixed invalid header.
Made more options robust.

0.1.2

Added option to trigger resize pulse based on CSS selector instead of pulsing automatically.

0.1.1

Fixed readystatechange listener to avoid conflicts with other plugins

0.1

Initial release