RTL (Right To Left) Theme For Bootstrap 4
File Size: | 134 KB |
---|---|
Views Total: | 1886 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Bootstrap RTL is a CSS extension to the latest Bootstrap 4 framework to create RTL-aware websites & web applications where the languages are written from right to left (Farsi, Arabic, Hebrew, etc).
Use it as a Bootstrap theme for your next RTL project. Supports all built-in components like Alert, Modal, Carousel, Dropdown, Navbar, etc.
See Also:
How to use it:
1. Download the package and insert the bootstrap-rtl.min.css
into your Bootstrap 4 project.
<!-- Bootstrap 4 Stylesheet --> <link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" /> <!-- Bootstrap 4 RTL Theme --> <link rel="stylesheet" href="/path/to/dist/bootstrap-rtl.min.css" /> <!-- jQuery Is Required For Components --> <script src="/path/to/cdn/jquery.slim.min.js"></script> <!-- Bootstrap 4 JavaScript --> <script src="/path/to/cdn/bootstrap.min.js"></script>
2. Add the dir="ltr"
attribute to the <html>
tag and determine the language your website uses.
<!doctype html> <html dir="ltr" lang="fa"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Bootstrap RTL</title> <!-- Bootstrap 4 Stylesheet --> <link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" /> <!-- Bootstrap 4 RTL Theme --> <link rel="stylesheet" href="/path/to/dist/bootstrap-rtl.min.css" /> </head> <body> Page Content Here <!-- jQuery Is Required For Components --> <script src="/path/to/cdn/jquery.slim.min.js"></script> <!-- Bootstrap 4 JavaScript --> <script src="/path/to/cdn/bootstrap.min.js"></script> </body> </html>
Changelog:
2020-06-22
- Bugfix
2020-06-21
- Bugfix
2020-06-10
- fixed offset class
This awesome jQuery plugin is developed by parsakafi. For more Advanced Usages, please check the demo page or visit the official website.