How can I make H5P content both mobile and desktop responsive?

[Bhavyatafoundation]

I'm trying to integrate H5p content on my website. But while embedding the iframe on the unit page the size of the respective content depends on the width mentioned for the iframe. I need the content to be mobile as well as desktop responsive for our students. Below is the screen capture of desktop, mobile view:

[Bhavyatafoundation]

This question is regrading making the content responsive under the course. As there is no issue when executed on a stand-alone page. Can you please help us with this?

[Anshuman Sahu]

for that we would need to check your content actually , it maybe possible that the content itself isnt responsive .

[Bhavyatafoundation]

This reply has been marked as private.

[Anshuman Sahu]

This reply has been marked as private.

[Bhavyatafoundation]

This reply has been marked as private.

[Anshuman Sahu]

This reply has been marked as private.

[Bhavyatafoundation]

This reply has been marked as private.

[Anshuman Sahu]

Well i checked this out and see that you have not use wplms h5p unit type like this : https://www.youtube.com/watch?v=Wbby9lIi3AQ Please use the h5p unit type ..Make sure that your wplms h5p plugin is updated to latest version .

[Anshuman Sahu]

for the time being please add this custom css in youe wp-amdin -> appearance -> customize -> custom css :

.course_content_content iframe {
    width: 100%;
    min-height: 500px;
}

[Bhavyatafoundation]

Thanks a lot!! It worked just perfectly fine. :)

[Author]

Posts