Right to left

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's picture

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's picture

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's picture

Thanks a lot for sharing spazfox!
Or Daniel's picture

thanks! 

alaamoh's picture

thank you can you give more info about that 

than you

i am really need it

nadavkav's picture

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

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.