Presented at the first Belgian meetup of Fronteers (http://fronteers.be) these slides delve into web design for right-to-left languages like Arabic and Hebrew. Focussing on all aspects like layout, implementation (HTML, CSS, images, ...) and even content.
Presented at the first Belgian meetup of Fronteers (http://fronteers.be) these slides delve into web design for right-to-left languages like Arabic and Hebrew. Focussing on all aspects like layout, implementation (HTML, CSS, images, ...) and even content.
Gender-fair WordPress: Fixing translation inequality at the coreYoav Farhi
Slides from the presentation given at WordCamp US 2017, arguing for the ability for translators to add gender-variable translations to WordPress.
Video: https://wordpress.tv/2017/12/08/yoav-farhi-gender-fair-wordpress-fixing-translation-inequality-at-the-core/
Right To Left Languages Support – The Right WayYoav Farhi
Adding Right to left (RTL) languages support to your themes and plugins doesn’t have to be a chore. This short talk introduces the basics of RTL support and demonstrate how to use automated tools to simplify the process.
From WC Europe 2015 - Video available at http://wordpress.tv/2015/07/14/yoav-farhi-localization-beyond-translation/
When we think about making our site, theme, or plugin welcoming to users around the world, we often focus on translation. While very important, there’s more to localization (l10n) and internationalization (i18n) than just that.
This talk covers some of the many cultural and practical differences that should affect our design choices, our code, and how we reach out to our global base of users and customers.
WordPress in NOT English - WordCamp Hamburg 2014Yoav Farhi
Presentation from WC Hamburg about how using WordPress in languages other than English can sometimes be frustrating, and what the community is doing about this.
From Antispambot to Zeroize, WordPress has all sorts of lesser known or used functions. This presentation given at WordCamp Jerusalem 2013 goes over 10 such functions.
A company without offices? Employees from all around the world? Working without pants? This surely must be The Future, and Automattic - the company behind WordPress.com - has been living it since 2005. Learn how more than 140 employees from over 27 countries collaborate to make the web a better place. This talk was given at the Reversim Summit in February 2013, and covered communication tools and methods, hiring and onboarding process, continuous deployment, and the general awesomeness of the distributed company.
https://www.youtube.com/watch?v=rH7foZ2WiwY
CC-BY-NC
מצגת ממפגש WP TLV
מה זה וורדפרס.קום, ומה ההבדל בין וורדפרס.קום להתקנה עצמאית של וורדפרס.
איך אפשר לנצל את היתרונות של וורדפרס.קום בהתקנה עצמאית באמצעות ג'טפק
Things developers tend to do wrong with WordPress. Based on amazing presentations from many great WordPress developers across the world.
Slides mostly in English, presentation was in Hebrew at WordCamp Jerusalem (September 2011).
הערות והפניות בבלוג בכתובת http://wp.me/pD4bk-Jn
Gender-fair WordPress: Fixing translation inequality at the coreYoav Farhi
Slides from the presentation given at WordCamp US 2017, arguing for the ability for translators to add gender-variable translations to WordPress.
Video: https://wordpress.tv/2017/12/08/yoav-farhi-gender-fair-wordpress-fixing-translation-inequality-at-the-core/
Right To Left Languages Support – The Right WayYoav Farhi
Adding Right to left (RTL) languages support to your themes and plugins doesn’t have to be a chore. This short talk introduces the basics of RTL support and demonstrate how to use automated tools to simplify the process.
From WC Europe 2015 - Video available at http://wordpress.tv/2015/07/14/yoav-farhi-localization-beyond-translation/
When we think about making our site, theme, or plugin welcoming to users around the world, we often focus on translation. While very important, there’s more to localization (l10n) and internationalization (i18n) than just that.
This talk covers some of the many cultural and practical differences that should affect our design choices, our code, and how we reach out to our global base of users and customers.
WordPress in NOT English - WordCamp Hamburg 2014Yoav Farhi
Presentation from WC Hamburg about how using WordPress in languages other than English can sometimes be frustrating, and what the community is doing about this.
From Antispambot to Zeroize, WordPress has all sorts of lesser known or used functions. This presentation given at WordCamp Jerusalem 2013 goes over 10 such functions.
A company without offices? Employees from all around the world? Working without pants? This surely must be The Future, and Automattic - the company behind WordPress.com - has been living it since 2005. Learn how more than 140 employees from over 27 countries collaborate to make the web a better place. This talk was given at the Reversim Summit in February 2013, and covered communication tools and methods, hiring and onboarding process, continuous deployment, and the general awesomeness of the distributed company.
https://www.youtube.com/watch?v=rH7foZ2WiwY
CC-BY-NC
מצגת ממפגש WP TLV
מה זה וורדפרס.קום, ומה ההבדל בין וורדפרס.קום להתקנה עצמאית של וורדפרס.
איך אפשר לנצל את היתרונות של וורדפרס.קום בהתקנה עצמאית באמצעות ג'טפק
Things developers tend to do wrong with WordPress. Based on amazing presentations from many great WordPress developers across the world.
Slides mostly in English, presentation was in Hebrew at WordCamp Jerusalem (September 2011).
הערות והפניות בבלוג בכתובת http://wp.me/pD4bk-Jn
My name is Yoav Farhi, I come from Israel, and I ’ m an Happiness Engineer at Automattic. In the next few minutes I ’ m going to talk about support for right to left languages in WordPress themes and plugins
So - You probably know Arabic, Hebrew and Farsi - the language spoken in Iran - but there are quite a few other languages that are written from right to left: for example Urdu (in pakistan), and Uyghur (weegur) which is mostly used in a western province of China.
Here ’ s an approximate map showing the areas around the world where a Right to left language is an official language.
All and all, around half a billion people uses right to left languages
WordPress probably has the best built in right to left language support, compared to any other content management system - largely thanks to the contribution by the persian-farsi localization team a couple of years ago. They did a great job and we ’ re all building on top of it now.
That ’ s means that the whole admin interface and the default theme are RTL compatible - and that ’ s really good! However, we can do better in terms of rtl support in themes and plugins.
So - lets look at an example with the new Twenty Ten theme from WordPress 3.0- here ’ s how it looks in English - pretty awesome, right?
And here ’ s how it *should* look in Hebrew - notice how everything is mirrored - including the sidebar, which is now on the right . (let ’ s see that again) So this theme has proper RTL support - Now, without proper RTL support...
... That ’ s how the theme would look: You can see that the sidebar is back in the wrong place, the site title and tagline are both to the right side and post titles are aligned to the left.
It ’ s all backwards! Unfortunately that ’ s how most of the themes in the theme repository look like when used in an RTL blog.
In fact out of more than a thousand themes currently in the repository, only about 10 have proper RTL support.
There ’ s still hope though - let ’ s see how we all can fix that Now I ’ ll show you how!
In WordPress, the only thing you need to do to make your theme RTL compatible is create an RTL.css file In a right to left blog, that file will automatically be loaded after your style.css file, which means that if you use the same CSS selectors, the style rules in this file will take precedence.
Here ’ s a list of what that file should take care of - we ’ ll now go briefly over theses with some examples
The body should get two rules - direction should be set to rtl (that ’ s similar to the ‘ dir ’ attribute in the HTML) bidi in the unicode-bidi property stands for BiDirectional - and you ’ ll want that in your file as well.
Note that inputs that are always written in from left to right should get a ‘ ltr ’ value on that proprety - That applies to the URL or the Email field in the comment form for example
Text alignment is a no brainer (note that the default in RTL mode is ‘ right ’ , of course)
Same here with floats and clears, no problem with that;
Positioning: that ’ s where it gets just a little bit more tricky. You can ’ t set both the right and left property for an element - that ’ s why you need to use the ‘ Auto ’ value for left before you can set the value for ‘ right ’ .
So margins - paddings - borders - The first proprety is margin-left - to mirror that we first need to set it to 0 and then set margin-right to the same value. For the padding - we basically do the same by switching the values for left and right. Same for the border, where we use the ‘ none ’ value on the left border
Backgrounds: In most cases you ’ ll simply mirror the percentage value for the horizontal pos. so 100% becomes 00 and 10% becomes 90%. * You may also need to use a mirrored image, depending on the context.
Note that you cannot mirror a pixel-positioned background, so avoid those as much as possible
Fonts: Those are the basic guidelines - While an rtl language typography can be very elaborate and complex, both italic text and serif fonts are not natively used.
here ’ s an example
Last thing: don ’ t ever think of mirroring the default .alignleft and .alignright classes, or ‘ the sky will fall on your head ’
Please don ’ t use inline css!
Just use an ‘ if ’ to load the proper rtl css...
That ’ s about it - if you want to test your theme or plugin with RTL mode without messing around to much, just download the RTL tester plugin from the repository.Also - there ’ s a nice tool called CSS Janus - google it up ->it *will* make your life much easier. One last thing - all the information presented here today is available in the codex!