RTL (right to left) somoeone? [update: managed to apply CUSTOM CSS! ]

Need help App Organization
1

Hi, i’m searching but can’t find a way
to RTL elements
even if i had the option to add custom
CSS code direction:rtl to elements
i was happy with it

it’s really a problem for me
as i had paid project for a client in Hebrew language
and i see there isn’t RTL option at all…

maybe i can work only with custom HTML elemnts
and to add “dir=rtl”?
but if so how can i work with the database?..
please help

1 Like
2

OK, i think i managed something
i believe it’s not the straightforward way to do it
but it’s working for me now -
i had added a simple HTML element somewhere in the page
and added custom CSS with this code:
<style>
body {direction:rtl;}
</style>

and now it seems that all the elements are RTL :slight_smile:
(would be happy for a better built in solution…)

2 Likes
3

and now i understand that this in this way
i can add custom CSS to any element/page in bubble :slight_smile:

4

RTL template just with direction:rtl not working if you want to have a good RTL template like this :
https://toomar.net you must using some other thing like float : right or margin and other things.

5

Of course,
if you want to do it right
you should work on every CSS element by itself (h1,h2,titles etc.)
and not the body only,
but with this HTML element method ()
you can do it!

6

it does not work on the repeating groups for me, any idea how to do this?
cheers

7

Bubble Support RTL, but you will need to keep in mind several things:

  1. Elements will stay the way they are designed in the editor regardless if the RTL language is activated or not, unless you want to use HTML element every where which I don’t recommend.
  2. Repeating Groups now support RTL since May 2018.
  3. There are several ways to activate the language on your website Front End make sure to activate the RTL language to see the behavior needed for texts and translation using the “app text” and repeating groups, but elements will not switch direction though.

How to activate the language on your website (front-end), you can add to the url ?lang=langueCode, for example if you want to activate Hebrew, the url should be:

I recommend reading these posts:

4 Likes
8

amazing feature, i didn’t see it till now ,
@vascolucci thank you

2 Likes