Image Pairing -adjust Layout?

Submitted by Kaot7 on Sat, 03/07/2020 - 07:24
Forums: 
Content creation

Hello,

I use h5p in my wordpress-blog and i try to install some quizzes...lately, i made a new image-pairing game, which can be seen here: 

https://www.kamaha75.de/2020/03/05/maerchensprueche-das-quiz/

You will see my problem immediatly:
the cards are shown as two long columns. If i try to take the first card on the left side it is impossible to put it on the last card on the right side, for the "windows"/ view does not move. I can only pair the cards i see on the screen...

Is there any possibility for me (not beeing a programmer or IT-Specialist) to adjust the views of the displayed cards -  I would like to have a view like that:

https://ebildungslabor.github.io/H5P/imagepairing.html

In wordpress, I would call that responsive design - i don`t know if that is what I am looking for...

Maybe there is another plugin for adjusting layouts? Or something to be easily changed in the settings? 

Looking for help :-)

 

BV52's picture

BV52

Mon, 03/09/2020 - 17:56

Hi Kaot7,

I could be wrong but I think the width was adjusted to accomodate 4 cards per column. I've also noticed that on your site the Image pairing is only 2 colums (per side), I uploaded your content here in H5P.org and it became 3 columns. So to have a similar layout from the 2nd example you have to either create the site where the H5P activities will have a much width as possible or use a PHP hook, to add your own CSS-file to the content type. Please visit the Visual Changes page for more details.

-BV