Right to left

Submitted by farrisimin on Thu, 08/07/2014 - 03:24

Hi everyone,
I was wondering if it is possible to write from right to left to support Hebrew..

I am have a hard time figuring it out... thanks in advance for all your support..

falcon

Fri, 08/08/2014 - 21:00

Permalink

Hi,There isn't any libraries

Hi,

There isn't any libraries on H5P.org that supports it. Hopefully someone in the community will provide patches, funding or libraries that support it in the future

spazfox

Mon, 07/27/2015 - 20:59

Permalink

Some CSS

I'm using H5P with content that is also translated into Hebrew, and I've been able to get things working pretty well (mostly multiple-choice and fill-in-the-blank questions) so far with these CSS fixes placed into the RTL style sheet for my site:

<code>

.joubel-speech-bubble-inner { text-align: right; }

.h5p-blanks .h5p-wrong::after, .h5p-blanks .h5p-correct::after { left: 0.5em; right:inherit; }

.h5p-multichoice > .h5p-question { text-align: right; }

.h5p-multichoice label { text-align: right; }

.h5p-multichoice .h5p-input-container { float: right; }

.h5p-multichoice .h5p-input { right: -1000px; left:inherit; }

.h5p-multichoice .h5p-feedback-text { text-align:right; }

.h5p-multichoice .h5p-answer .h5p-feedback-inner { text-align: right; }

.h5p-multichoice .joubel-tip-container { left:0; right:inherit; }

.joubel-speech-bubble { left:1em; right:inherit; min-width: 10em; }

.joubel-speech-bubble-inner::before, .joubel-speech-bubble::before { left:10px; right:inherit; }

.h5p-multichoice .h5p-answer > label::before { left:0.75em; right:inherit; }

.popover-title, .popover-content { text-align:right; }

.h5p-blanks button.h5p-button::after { font-family: 'H5PFontAwesome4'; content: "\f06e"; padding-right: 0.5em; }

.h5p-blanks button.h5p-button.h5p-check-answer::after { content:"\f058"; }

.h5p-blanks button.h5p-button.h5p-try-again::after { content:"\f021"; }

.h5p-blanks button.h5p-button::before, .h5p-blanks button.h5p-button.h5p-check-answer::before, .h5p-blanks button.h5p-button.h5p-try-again::before { content:""; }

.h5p-multichoice .h5p-show-solution-container .h5p-multichoice-check-button::after { content: "\f058"; font-family: 'H5PFontAwesome4'; padding-right: 0.5em; }

.h5p-multichoice .h5p-show-solution-container .h5p-multichoice-check-button::before { content:""; }

</code>

falcon

Tue, 07/28/2015 - 15:53

Permalink

Thanks a lot for sharing

Thanks a lot for sharing spazfox!

Or Daniel

Sun, 01/13/2019 - 20:18

Permalink

Thanks

thanks!

F seif

Wed, 06/07/2023 - 22:04

Permalink

Hi @some css,Thank you for

Hi @some css,

Thank you for sharing this code, whitch file I must add this css code in wordpress plugin?

alaamoh

Mon, 01/14/2019 - 21:29

Permalink

thank you can you give more

thank you can you give more info about that

than you

i am really need it

darabi.babak@gm...

Mon, 03/18/2019 - 16:21

Permalink

thanks for great support

hi

i'm using h5p in wordpress, how to add rtl in wordpress?

some files dosen't exist in wordpress h5p plugin like locallib.php, hvp.php and setting.

thanks

dido2038

Sun, 06/09/2019 - 10:31

Permalink

How to adapt this solution to wordpress

Hi all;

Thank you for sharing your solution.

Could I ask you please how to adapt or implement this solution in WordPress?

Where should I copy paste this code?

Best regards.

rapidearn

Mon, 08/16/2021 - 10:01

Permalink

H5P Wordpress RTL

Hi

for making contents RTL, just do following steps:

1. go to file with this address in your control panel:
wp-content/plugins/h5p/h5p-php-library/styles/h5p.css

2. in that file, find "html.h5p-iframe .h5p-content" class.

3. paste the following code and save the file:
direction: rtl;

4. Enjoy RTL :D

Irith Herman

Sun, 01/09/2022 - 11:05

Permalink

Thank you

Now it is working.

May be you can suggest me where to change it for the Timeline widget, it doesn"t work for it.