[Resolved] RTL Menu – Sub Menu aligned left. I need it to be aligned right

[Nir]

I started a new website with RTL language – Hebrew.
http://www.iBlocks.co.il

The menu is aligned right as needed in RTL.
But the sub menu text and the text background color aligned left.
I need the sub menu text and background color aligned right.

Can you help?

Nir Petrank

[Leo]

Hi there,

Try this CSS:

.main-navigation .main-nav ul ul li a {
    text-align: right;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

[Nir]

With your CSS the text aligned right.
But the background under the text aligned left.

Can you align the background to right?

Can you do a change in your generatepress theme and have natural RTL menu?

I talked with Tom before I purchased this theme.
He assured me that the theme is RTL.
But I see that the menu isn’t.
Can you do a change in the theme and not a patch with CSS?
When the WordPress is RTL the menu has to be RTL.
This is RTL compatibility.

Please talk with Tom.

Nir Petrank

[arabsworks]

Dear Nir,

We ask TOM many times from many GP users to have a permanent and final solution for RTL problem hopefully soon .

RTL Solution with GP customizer

[Nir]

Is there a CSS solution somewhere in this forum for RTL menu?

This is for Tom,
I heard that you are very responsible and helping in the forum.
You had a very respective recommendation from Adam – WPCrafter.com WordPress For Non-Techies.
This is what I got from your side when I asked a presale question –
——————————————
Hi there,

The theme should be 100% RTL compatible.

Are you looking for specific header styles?

Tom Usborne
Lead Developer

facebook.com/GeneratePress
twitter.com/GeneratePress
—————————————————

Can I use an RTL menu with your theme or not?

Nir Petrank

[Leo]

You can try this for now: https://docs.generatepress.com/article/navigation-dropdown/#open-sub-menus-to-the-left

I’ll make sure he sees your message 🙂

[Nir]

OK. It is working fine.

How do I do this in the mobile menu?
After I press the mobile main menu, the menu is aligned left and sub menu is aligned right.
I need it to be aligned right and sub menu aligned left.

Can you help on this?

[Leo]

Give this a shot:

@media (max-width: 768px) {
    .main-navigation .main-nav ul li a {
        text-align: right;
    }
    .main-navigation .menu-item-has-children .dropdown-menu-toggle {
        float: left;
    }
}

[Tom]

This is actually in the theme by default. The issue is that the rtl.css file won’t load if a child theme is activated.

More here, including the solution: https://generatepress.com/forums/topic/rtl-css-is-being-overwritten-by-styles-css/#post-317410

[Nir]

Hello Tom,

What do I need to do with the code Roy wrote?

Can you explain the solution in simple words?
1. replace this
2. add this
3. etc..

Why can’t it be in your child theme by default?
I downloaded your child theme from your website and used it.

[Tom]

It should likely be in the GP provided child theme – I’ll get that done.

For now, take this code:

function tu_enqueue_rtl_file() {
	if ( is_rtl() ) {
		wp_enqueue_style( 'generatepress-rtl', get_template_directory_uri() . '/rtl.css' );
	}
}
add_action('wp_enqueue_scripts', 'tu_enqueue_rtl_file', 100);

And add it to your site using one of these methods: https://docs.generatepress.com/article/adding-php/

[Nir]

I changed the active theme.
I use now the theme itself and not the child theme.
And the menu works fine.

[Tom]

I just updated the child theme: https://docs.generatepress.com/article/using-child-theme/

Thanks for the heads up! 🙂

[Nir]

OK. Thank you.

Where can I download the new version?
Is it in its original place?
Is it here –

https://docs.generatepress.com/article/using-child-theme/

[Nir]

OK. I downloaded the new child theme, installed it and it works fine.

Many thanks for your help
Nir Petrank

[Author]

Posts