How to write RTL support in your theme of WordPress?

Home / News
How to write RTL support in your theme of WordPress?

How to write RTL support in your theme of WordPress? The very most important thing is that when you make a WordPress theme then you have to make two types of language support which are LTR(left to right) and RTL(right to left). Most languages supported LTR which English or max languages and RTL supported by (Arabic, Hebrew, Farsi, Urdu, and others).

Let’s start, How to support RTL in WordPress theme by the codex and graphical changes of WordPress dashboard options or using plugins.

Easy way to RTL support of WordPress theme.

  • Step1 :
define ('WPLANG', 'ar');
Go to the wp-config.php file, open it, and paste this code into the file. It is permanent RTL support of the WordPress theme.
  • Step2 :

Using this plugin. This plugin is easy to use because all options are visible on the WordPress top admin bar. You can just click and enable this feature.

How to write RTL support in your theme
How to write RTL support in your theme of WordPress
  • Step3 :

Go to the WordPress dashboard then Settings->General->Site-language. Select the language of Arabic. It will enable RTL supported language.

How to write RTL support in your themes
How to write RTL support in your theme of WordPress website

NOTE: Please apply anyone step then it will work perfectly.

Add RTL supported stylesheet and script in your theme:

We suppose the directory name CSS and in file name theme.css. When we support the RTL then the file name will be theme-rtl.css.

Enqueue stylesheets:

wp_enqueue_style('theme-style', get_parent_theme_file_uri('/css/theme.css'));
wp_style_add_data( 'theme-style', 'rtl', 'replace' );
“wp_enqueue_style” and “wp_style_add_data” handler name will be the same. like(‘theme-style’). Otherwise it can’t be worked properly. You can check the WordPress Official.

Enqueue Script:

Sometimes need to support the script data RTL supports. You can use this conditional function like this.
 if ( is_rtl() ) {
  wp_enqueue_script('theme-rtl', get_parent_theme_file_uri('/theme-assets/js/theme-rtl.js'), array(‘jQuery’), '', TRUE);       
}else{
   wp_enqueue_script('theme', get_parent_theme_file_uri('/theme-assets/js/theme.js'), array(‘jQuery’), '', TRUE);
}

If you want to write your theme fully RTL supported please knock us. How to write RTL support in your theme properly? 

RTL Product View
Leave a Comment