Embedding Videos on abstract page

[sushantv]

Application version: OJS 3.1.2

Description of issue: I intend to embed vimeo videos under the abstract text. The video is visible fine on the editor but when I actually view the page, nothing is shown. Is the html stripped off due to security reasons?

Here’s the embed code that I used:
<div style="padding:75% 0 0 0;position:relative;"><iframe src="https://player.vimeo.com/video/544899464?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%;" title="SampleVideo_1280x720_1mb.mp4"></iframe></div><script src="https://player.vimeo.com/api/player.js"></script>

I tried searching and looking at the other discussions on the forum but couldn’t find a specific solution.

Screenshot:

[sushantv]

@sushantv

So, Some more details on this. I managed to allow iframe through the details given here:

Iframes not showing up in ojs 3.0.0

This will be a restriction of the allowed_html setting and the htmlpurifier library. See:

Now, the video is displaying fine but for some reason, the height of the video is very less. It looks like the height tag in the iframe is just ignored and also not displayed in the source code. Anything I need to do to enable it?

[rcgillis]

Hello @sushantv

The version of OJS that you’re using is no longer supported by PKP. I recommend that you upgrade to the newest version of OJS, as it is likely that the issues you are experiencing will be resolved by upgrading. However, other community members here on the forum are free to offer suggestions.

Upgrading instructions are available in the PKP Administrator’s Guide.

Information about the latest version of OJS can be found on the [PKP Website]https://pkp.sfu.ca/ojs/

Best regards,

Roger
PKP Team

[ctgraham]

I concur that upgrading to a more recently release of OJS is an important note here, but I do not think a more recent release of OJS will operate differently with respect to HTMLPurifier and the config.inc.php allowed_html setting.

@sushantv , to support the example code, you’ll need to modify the HTMLPurifier configuration to allow both the iframe element and the style attribute:

Allignment of image in announcement OJS 3.0.2.0

It looks like HTMLPurifier treats these as risky and/or invalid by default: http://htmlpurifier.org/phorum/read.php?3,6308 You’ll need to tell HTMLPurifier to allow the “style” attribute by modifying the code. This will be similar to the PKPString modification suggested here:

[sushantv]

Thanks for your help so far. I only have one question. What tags do I need to add in config.php file so that the tags are not stripped?

This is code i intend to embed:

It shows fine on the editor but on the front page, the height is not proper.

Here’s the code in my config.inc.php file:
allowed_html = "a[href|target|title],em,strong,cite,code,ul,ol,li[class],dl,dt,dd,b,i,u,img[src|alt],sup,sub,br,p,iframe[frameborder|scrolling|style|position|top|left|src|width|height],div[class,height,overflow,border-style,style,padding-bottom,position]"