[hkayaliParticipant]

Hi,

I would like to change the text direction of the Navbar to RTL on the arabic pages of my website.
Can I use CSS to set this format to a specific menu?

[KoryKeymaster]

Hey there,

Is your site completely in Arabic, or only some? Are you using WPML, or have you just created a few Arabic pages? If you setup the language parameters on your site, WordPress will setup the text direction to be RTL across your site and X has the appropriate styling to make this happen. If this won’t work for you, perhaps you can provide us with a link to your website and provide us with further details on what you’re trying to accomplish so that we can help you achieve something that matches your goals.

Thanks!

[hkayaliParticipant]

This reply has been marked as private.

[KoryKeymaster]

Hey there,

You could try adding this to your functions.php file in your child theme:

function rtl_on_specific_entries() {

  GLOBAL $wp_locale, $wp_styles;

  $ids = array( 138, 'my-page', 'My Page' );

  if ( is_page( $ids ) || is_single( $ids ) ) {
    $wp_locale->text_direction = 'rtl';
    $wp_styles->text_direction = 'rtl';
  }

}

add_action( 'wp', 'rtl_on_specific_entries' );

You will need to make some modifications to the $ids array in the function. Basically, you can pass in a page/post ID, slug, or Title as a data point to target which page/post you’re going after. Make sure that if you enter in IDs that they’re done as numbers (without the quotes around them as 138 is above), and if you do a slug or page title, make sure they’re in quotes. Comma separate your data points too, as you will encounter an error if you don’t. What this will do is keep your site as LTR on every page of your site except the ones referenced in the $ids array. This is the simplest way to alter this for your specific use case.

Thanks!

[hkayaliParticipant]

Thank you for your feedback. The code worked on the desktop site but I’m getting the following warning in the preheader section of the RTL pages:

Warning: Creating default object from empty value in /home/content/p3pnexwpnas03_data03/74/2358874/html/wp-content/themes/x-child-integrity-light/functions.php on line 25

Line 25 is:

$wp_styles->text_direction = ‘rtl’;

When I removed Line 25 the error was gone but RTL functionality still worked. Is that ok?

How can I change the link associated with the Logo so it points to the Arabic homepage when pressed on these pages?

[ThaiModerator]

Hi Hkayali,
#1 Removed the line 25 the RTL functionality still worked fine on those pages.
#2 For changing the link associated with the Logo point to Arabic Homepage, you have to copy the _brand.php locates in x\framework\views\global to exactly the path of child-theme x-child-integrity-light\framework\views\global.
After that, change the line 18 on _brand.php,
From:
<a href="<?php echo home_url( '/' ); ?>" class="aaa <?php x_brand_class(); ?>" title="<?php echo $site_description; ?>">
To:
<a href="<?php echo is_page( array( 138, 'my-page', 'My Page' ) ) || is_single( array( 138, 'my-page', 'My Page' ) ) ? home_url( '/ar/' ) : home_url( '/' ); ?>" class="aaa <?php x_brand_class(); ?>" title="<?php echo $site_description; ?>">
Hope it helps

[hkayaliParticipant]

Hi

I’m using a vertical Navbar for a new website.

How can I change the position of the Navbar from left to right on a set array of pages?
I already inserted the code to change text direction to RTL on the pages I want. Can I add something to the same code to adjust the position of the Navbar?

Cheers

[ChristopherModerator]

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

[hkayaliParticipant]

Thanks for your reply. I will try to be more clear.

In the theme customization my Navbar Position is set to ‘Fixed Right’. I would like to change it to ‘Fixed Left’ on some pages. Is that possible?

[ZeshanMember]

Hi there,

You can achieve it by assigning a unique CSS class of fixed-right-sidebar to each of your page on which you want to show fixed right sidebar. Then, add following CSS code under Custom > CSS in the Customizer:

@media (min-width: 1200px) {
    body.fixed-right-sidebar.x-sidebar-content-active, body[class*="page-template-template-blank"].fixed-right-sidebar.x-sidebar-content-active.x-blank-template-sidebar-active {
        padding-right: 295px;
        padding-left: 0;
    }
    .fixed-right-sidebar .x-sidebar {
        right: 0;
        left: auto !important;
        border-left: 1px solid #dfdfdf;
        border-left: 1px solid rgba(0,0,0,0.075);
    }
}

Thanks!

[hkayaliParticipant]

This reply has been marked as private.

[Paul RModerator]

Hi,

Thank you for providing your login credentials.

To achieve that, you can add this under Custom > CSS in the Customizer.

body.page-id-6.x-navbar-fixed-left-active {
  padding-right: 168px;
  padding-left: 0;
}

body.page-id-6.x-navbar-fixed-left {
  left: auto;
  right: 0;
}

where 6 is the page id of the page where you want your navbar to appear on the right.

Please refer to the link below on how to locate your page id.

https://community.theme.co//kb/how-to-locate-post-ids/

Hope that helps.

[hkayaliParticipant]

Thanks a lot. It worked

I have already included code in functions.php to apply RTL formatting for an array of pages.
This array is the same one where I want the navbar to appear on the right.
Can I add code to do that instead of applying custom css for each page ID as suggested.

The code I have is

function rtl_on_specific_entries() {

  GLOBAL $wp_locale, $wp_styles;

  $ids = array(320,338,345,349);

  if ( is_page( $ids ) || is_single( $ids ) ) {
    $wp_locale->text_direction = 'rtl';
 $wp_styles->text_direction = 'rtl';

  }

}

add_action( 'wp', 'rtl_on_specific_entries' );

[ZeshanMember]

Hi there,

Yes, you can use your code instead of custom CSS to achieve RTL formatting on certain pages.

Thanks!

[hkayaliParticipant]

How can I apply the following CSS in my functions.php so it’s applied to an array of pages?

body.page-id-6.x-navbar-fixed-left-active {
  padding-right: 168px;
  padding-left: 0;
}

body.page-id-6.x-navbar-fixed-left {
  left: auto;
  right: 0;
}

Cheers

[Author]

Posts