 Well, good morning. You brave souls Who set your alarm clock and got organized early to be here for the first? Session there are two actually there in word camps. Is this the first word camp for anyone? Okay, welcome. Okay. Yes So there are coveted spot speaker spots in WordPress and then there are the ones where you're like Oh, I hope my audience is awake The first session of the morning the session directly after lunch and the last session of the day are usually when folks are the most Fatigued so thank you for being bright-eyed and here this morning. So So we're talking about internationalizing code this morning in just as a as a start Here at work in Europe, I'm sure there are more than one language represented in the room Would anyone like to volunteer just to say hello? my name is Whatever your name is. I love word camps and your language a non-English language Thank you. What language? Turkish. Okay. Anybody else and language Check check, okay Toby ah, okay. Thank you So as y'all have brilliantly demonstrated for me wordpress is a global phenomenon It it will we'll talk more about some some interesting stats here right I think you're interesting stats here in a second, but just to get started. How many of you have ever seen a bit of code PHP or maybe some JavaScript that looks like This some that double underscore Followed by some text or maybe you see it presented with the slug of a theme or a plug-in Here's maybe a more realistic example in the context. This is a function that registers a custom post type And as part of the arguments for that custom post type We have the label and again you see that double underscore function Containing a string followed by the plug-ins slug. So have you ever written code that looked like that? Perfect, and you don't have to raise your hand, but if you have copy and pasted a snippet you found on the internet And maybe it had this but you weren't sure what that actually was No shame in that I've copy and pasted a lot of code Well, if you didn't know I'll tell you that is a translation function The double underscore is one of the most commonly used translation functions Excuse me, so it's entirely possible. You've already been working with translation functions and didn't even know it So before we go any further. This is a link to the slide deck. I'm using you're welcome to Whatever learning style is best for you. Pardon me. I've got my cough drops, but and it's not cooties. It's just Okay, everybody good Perfect. So before we get started, I just wanted to give you a quick overview of what we'll talk about in our time together We're keeping this fairly high level even though it's a workshop 50 minutes is not a real long time Excuse me. So first what is in our internationalization? Why should we care about it? What is localization and also what is it not a quick introduction to something called get text? And then a big picture overview of what this whole internationalization and localization Process looks like we'll look at some common translation functions. I'll show you how it works and then we'll wrap it up By actually loading in some translations and showing you some resources So if that doesn't sound exciting you're not a developer or maybe if well, yeah, we're nerdy here So that's okay So internationalization sometimes abbreviated I 18 in 18 being the number of letters between the I and the N This is what makes a WordPress accessible for users who don't speak English or Yeah, we'll just leave it at that for for a moment So some fun facts for you. This is may not surprise anyone but WordPress currently powers over 40% of the web I think at last glance. It was about 43% Less than 5% of the world and these are links if you're following along the slides There's sources to where this data comes from Less than 5% of the world speaks English as a first language Less than 13% of the world speaks English period and Then if we look at the number of WordPress install so think about 43% of the web. That's a lot That's millions of websites of those Over 55% are not in English So I hope that just kind of underscores the importance and the need for writing code Excuse me in a way that's translatable So localization so if internationalization is the process of writing code so that it can be translated Localization is the process of actually breaking that down and Translating it into different locales It's got a similar abbreviation L 10 in where 10 is the number of letters between the L and the in Wordpress has WordPress is open source software and One of the teams that makes WordPress are the polyglots and they are responsible for translating WordPress Into over 200 locales. I think somewhere around 70 are fully fully complete And that's just WordPress core and then maybe some Some of the themes Implugins that are created by automatic so like the 20 or the wordpress organization. So like the 23 22 themes those themes So localization is not this is a common misconception But this is not the process of translating your website content for their languages These will be the strings That are actually appearing in and the code So if you think about the law if you go to WP admin, you see the log log in screen It's got username password a little link that says lost your password If you go look in the WordPress code base. Those are hard-coded strings in English so Theoretically if you wanted to Translate that into a different language you would have to go edit the source file and we all know that that is a big no-no So back in the day Sun Microsystems created this system called get text, which is a kind of universal standard for Writing code in a way that makes it easy to extract those strings for translation Without having to necessarily copy the code base over Now WordPress has its own special functions that serve as a wrapper for get text So you'll never actually use the get text function, but just as a bit of history and just get text works in conjunction with something called a text domain and This probably looks familiar if you've ever looked at the header of a plug-in or a theme and The text domain is basically what designates all translatable strings that belong to that code package so that later on when it comes to the time to Pull out those strings. I like to think of the text domain is like a vacuum cleaner They just all the all the strings that belong to a particular theme or plug-in package Okay, I'm about to lay on you the most impressive slide of The presentation, so I hope you're you're ready for it Okay, so let's say we have a string of text. Hello world And that is written into my theme or plug-in And I wrap it in a translation function what that means is that again that vacuum cleaner. I Really am sorry for all the noises All of those strings that can be translated are translated into something called a pot or portable object template file from there we kick over to the localization side and Translators like maybe some of the folks in this room take that Translate it into the locale of their choice. This ends up in a PO or portable objects file And then and that's a human readable file And then at runtime based on whether we're working with PHP or JavaScript Those are parsed out into machine readable files machine object machine object file for PHP translations and JSON files for JavaScript translations and then The user would see Whatever language They have their WordPress locale set to use So I hope you're all duly impressed with that slide. I'll thank you. Thank you. I Might even show you again Okay, so we talked about that double underscore Is a the most commonly used translation function and that returns a translated string and Then we've got it sister function the underscore e that echoes a translated string. So For example based on what your your use case was For the double underscore, maybe you're setting that to a variable Then you would need to echo that if you actually wanted to print it to the screen Whereas the underscore e Would these to do the identical thing it actually would print that word log in to the page Then if we get into talking about escaping data, we've got special translation functions just for that And there's a link in the slide if you're not familiar with what it means to escape data You can read a little bit more about that But the corresponding so we got the double underscore escape HTML double underscore That would return an escaped value And then the same thing it's counterpoint counterpoint with the underscore e for echoing add to that We get a couple more. So think about if you're looking at strings that might appear in a code base Let's take it comments or something that might commonly appear on WordPress So think about a translation for one comment. There are or there is one comment versus there are two comments So the language changes based on the number present there might be other instances where a Language the Senate structure varies so when you you want translators to have the flexibility to add a translation That makes sense in their language. So we've got translation functions that cover a number of use cases So like the underscore in That's if we're dealing with numeric values like the comment the one comment versus two comments We've got the underscore x which Toby. I'm are you gonna talk about this one tomorrow? Oh He's got a session tomorrow if you want to deeper dive on on this That's 11 and I think it has the word internationalization or I 18 in and in the title. So look look out for that So the underscore x returns a string with context. So imagine The word lead in English That could mean I am leading you in this session It could mean I it's a leash for my dog There's different different Translations for a single word and the underscore X allows you to provide context for the person that's on the translating end Yes Yes, exactly and you might not I don't I'm trying to think of a use case when you might have crocodile tears in your code But I want you to write the plug-in that uses that and Yeah, but yes, if there are idioms or It's a way to let translators know what it is that you're trying to communicate If you are writing about crocodile tears, then probably you would rather use the Translators comment, but you have that later on I guess I'm saving that for your session Yes when you have word that can have different meanings so typically when they have very short strings Where there is a risk that there may be Well, I mean you may have different cases all already in your code because the exact source string you have in your code becomes the Database key to find the right translation and if you have lead lead lead The way you can distinguish this is that with whatever you put as this extra X key Becomes a second part of that translation key and that way you can say okay lead As in work as in dog or lead as in something else Thank you So again a number of use cases where you might need a specialized translation function the most common ones I mean Many of those I've written code for WordPress for a decade, and I've never used Quite a few of those so but just as an example when it comes to PHP You do have a variety of functions at your translation functions at your disposal Now JavaScript on the other hand Translations in JavaScript only became available in WordPress I think about five years ago Okay, so it's a It's it's new ish, so when we talk about JavaScript translation functions We shrink the list sort of down to the essentials, but they work the exact same way as their PHP counterparts Okay, so go and think about that very amazing slide that I showed you earlier We've written our code or we've written our theme or a plug-in. We've used translation functions like we should now the next step in that process is to Generate a pot file so that portable objects template file that'll be used as the basis for translators There are a number of ways to generate this file depending on what your preferred workflow is If you're a command line person There's a CLI command for that if you use grunt or gulp if you want a UI there's software like poetic These are not listing favorites or anything these excuse me just a sampling And then if you actually have a theme or plug-in that's part of the org repository There's a way to generate a pop up a pop file directly from your admin, which is cool. And That's Okay, you don't actually have to read what that is. I know it's tiny. Sorry. Oh I Don't know how to make it bigger, but anyways, that's what a pop file looks like so basically some header information and then this this the various strings for translation the original and then a Space where the translator can go in and generate a po file, which is basically you could just Make a duplicate of this Translate those Strings and save them out into a po file So the naming convention, let me see if I can I don't have this one. Hold up. That was so that Absolutely see it lost in translation Okay, it's okay But each There's a po file generated for each locale And the locale the naming convention is the the country code plus a specific locale code So some languages say Spanish There are many countries that speak Spanish So you would have the country code then Followed by the locale so each each profile gets that Sorry, I didn't have that one at the ready Okay, so then yes, yes So going back to generating the po file Again several ways of doing that whether it's just duplicating the pop file or there are various plugins or software that you can use to do that Okay, and then the next step in that puzzle is So think of the The pop file is something the original developer does the po file is something the individual translators do Now when it comes to translate or to Compiling, I don't know if you'll talk about this tomorrow Toby, but general best practice is The original developer should compile their own Files Hopefully translators have good intentions But the whole point of translations as you probably as the developer don't speak all the languages that you're receiving translations for And so just to make sure that there's no malicious strings that sort of thing You would want to generate your own files that are actually going to be presented to a user and There are again multiple ways to Generate that based on your preferred workflow still we're still here still still with me. Okay Perfect so moving on the Last piece of the puzzle so to speak so we've got the developer involved The original the og developer We've got the translators involved And then it's the job of the developer to then load these translations excuse me and based on whether you're using PHP or JavaScript there are different functions you do for that So mo files those contain our PHP translations There is load plugin text domain load theme text domain and Load child theme text domain that you would use Respectively if you're working with a plug-in a theme or a child theme and Then for the JSON files There is a set script translations. I'm so glad you asked So this is a plug-in Not a theme but the way that plug-in works We are loading. There's that load plug-in text domain and On if I need to update this code, so I reference the actual code base or excuse me the function reference for these But it takes a variety of parameters And we're basically pointing it to in this case a Directory in the plug-in where language files live and here I just have a sample and this particular one in Mexican Spanish and You would hook that to a knit and I only know that you hook it to a knit because I've read the documentation Thirdly, and that's that's the recommended spot Yep, exactly from VP content forward slash It's a different directory Yeah Languages forward slash themes or plugins and then your exact plug-in or Things like so it's important that you for your Um Text domain sorry it's early in the morning For for the text domain only use exactly your slide that you have been appointed because it that is the one you have to use for this If you're coding a theme Kind of for your own use you would need to use a function You can make a declaration in the top of the plug-in at least Where it says Don't bother trying to look for updates or translations and so on because You bring up a really great point about if you are creating bespoke themes for clients that's different from Distributing themes or plugins for mass use Actually ran a poll on on Twitter a couple of weeks ago Do you use translation functions in bespoke bespitting? In bespoke code And the the general consensus was yes Because it's just muscle memory like you that double underscore function Maybe you will never ever be translating strings in a say a theme that you're building for a client But just as a best practice of something that you're in the habit of doing Do it now do you actually need to include translations generate a pop file load them? again based on your clients use case maybe but Maybe most of the time not So it really just depends on what the the final delivery is for for that code base So I just showed was showing you a github repo here's the URL to that and if you would like to Submit a PR to that repository with a translation just to practice the Process of generating a profile and if you want to go ahead and compile the mo or the json's Files you're welcome to do that too. Although. I'll double-check your homework to make sure you're not sneaking in something something sneaky Just thank you. I spit on stage and now I just snorted I am a delight people Yes, so this is just a it's this is about as simple of a plug-in as it gets I Created this for a LinkedIn learning course that I did on this topic and basically it adds a to the top link At the bottom of a page and one of those links is is Generated or output by javas with javascript. The other one is is with PHP Just so I could demonstrate what it was to use To the top copy that's classy right there But just to demonstrate what it would look like to use a translation function. There's that double underscore and PHP and what it might look like to use a translation function and Javascript there's that double underscore again, so if you want to look at this is just like the most Basic basic example you're how all the pieces fit together You're welcome to use that as a resource Or even do a pull request our session may be coming to an end, but your learning doesn't have to So that there's several resources. I wanted to point out the best ones are going to be directly on wordpress.org If you go to Based on whether you're interested in plugins or themes The plug-in developer handbook and then look for the section on internationalization Likewise the theme developer handbook look for the section on internationalization Personally, I find the documentation is a little more robust under the plug-in section so even if you're not Doing plug-ins. I would still reference that particular handbook and Then yours truly does have a course available on LinkedIn learning where I get into a little more detail on on all of these goodies and then when it comes to actually Doing if you're super inspired to to translate wordpress into other languages Go to make wordpress.org slash polyglots Not polyglollies or however. I spelled it earlier when I couldn't quite see what I was doing that is That is the team that is responsible for translating wordpress And it would be if you're a multilingual that would be a really great no-code way To participate in giving back to this open-source community and then translate.wordpress.org is where the Translation magic actually happens So we've got a handful of minutes left. I know I appreciate that we've asked questions along the way Does anybody have others they want to throw out there? No burning questions Okay, in that case I Will give you the gift of your time to run get some coffee or do what you need to do. Oh Fantastic. Thank you. I Really appreciate that Well, thank you guys. I appreciate your your attention and your Participation and happy word camping. I am Headed on the slides. I don't know if it's tiny enough to see Mostly on Twitter at C Dills So feel free to hit me up or connect with me there. So thank you guys