Top

RTL layout


For the RTL page, just you have to add rtl class to body tag and also add dir="rtl" attribute in your html tag

<html dir="rtl">
  <body class="rtl">
  </body>
</html> 

We have provided a bunch of page layouts and menu layouts that can be implemented with just a options change to "body" ! Please refer the below details.

If you want to change layout type for the all pages you have to set value in onClick settings

setLayoutType: (state) => {
  if (state.layoutType) {
    Config.layout_type = "rtl";
    document.body.classList.add("rtl");
    document.querySelector(".rtl-setting")?.classList.add("rtl");
  } else {
    Config.layout_type = "";
    document.body.classList.remove("rtl");
    document.querySelector(".rtl-setting")?.classList.remove("rtl");
  }
  state.layoutType = !state.layoutType;
}

find TemplateCustomizer folder and change above value rtl

RTL layout page

RTL