{"id":32278,"date":"2021-07-15T19:53:36","date_gmt":"2021-07-15T19:53:36","guid":{"rendered":"https:\/\/www.globalizationpartners.com\/?p=32278"},"modified":"2021-07-16T16:48:57","modified_gmt":"2021-07-16T16:48:57","slug":"dealing-with-localization-in-laravel","status":"publish","type":"post","link":"https:\/\/www.globalizationpartners.com\/2021\/07\/15\/dealing-with-localization-in-laravel\/","title":{"rendered":"Dealing with localization in Laravel"},"content":{"rendered":"<p>Laravel is one of the most famous frameworks in PHP. Taylor Otwell built it as one of the most popular open-source PHP development frameworks for quickly and easily creating customizable online web applications. Laravel is more advanced than the CodeIgniter framework and is built based on Symfony-based architectural patterns. Laravel is an MVC framework with bundles, migrations, and Artisan CLI. Developers like Laravel because it has many features and one of these features is localization.<\/p>\n<p>&nbsp;<\/p>\n<h2>How to Set Up a Multilingual Websites and Localization in Laravel<\/h2>\n<h3>Installing Laravel<\/h3>\n<p>First of all, before installing Laravel, we need to prepare the environment by installing <a href=\"https:\/\/www.wampserver.com\/en\/\">WAMP<\/a> server or <a href=\"https:\/\/www.apachefriends.org\/download.html\">XAMPP<\/a> server. After finishing the installation and ensuring that PHP and MYSQL are working fine, it\u2019s time to install <a href=\"https:\/\/getcomposer.org\/\">COMPOSER<\/a>.<\/p>\n<p>Let\u2019s dig into <a href=\"https:\/\/laravel.com\/docs\/7.x\/installation#installing-laravel\">Laravel<\/a>. If you are using WAMP, open the terminal and go to the following path \u201cpath-to-folder-wamp\\wamp64\\www\u201d. Alternatively, if you are using XAMPP, go to \u201cpath-to-folder-xampp\\xampp\\htdocs\u201d and run this command: composer create-project &#8211;prefer-dist laravel\/laravel:^7.0 your-project-name. After downloading Laravel project in the terminal, type \u201ccd your-project-name\u201d then run php artisan serve. After that, open your preferred browser and type <a href=\"https:\/\/localhost:8000\">https:\/\/localhost:8000<\/a>.<\/p>\n<p>&nbsp;<\/p>\n<h3>Localization Setup<\/h3>\n<p>To perform localization in Laravel, we need to work with Strings. This is how Laravel handles the internationalization(i18n) of any site that is designed to deal with multiple languages.<\/p>\n<p>So, all we need to do is store all Strings in a file in &#8220;resources\\lang&#8221; directory.<\/p>\n<p>Once Laravel is installed in your machine, your default language will be English; navigate to config directory and open file app.php. You will find &#8216;locale&#8217; =&gt; &#8216;en&#8217;, this is the default app language.<\/p>\n<p>&nbsp;<\/p>\n<h3>Adding Multiple Languages<\/h3>\n<p>1- Navigate to &#8220;resources\\lang&#8221; directory, by default, you will find a folder called en, create a new folder for your target language (example:es), then create a file called lang.php<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/lang-directory-164x300.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"175\" height=\"320\" srcset=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/lang-directory-164x300.png 164w, https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/lang-directory.png 246w\" sizes=\"(max-width: 175px) 100vw, 175px\" \/><\/div>\n<div align=\"center\"><\/div>\n<p>&nbsp;<\/p>\n<p>2-As we see from the above figure, we can set up as many languages as needed (es, de, fr, ar, in \u2026etc.), each language must have a separate directory.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/001-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"537\" height=\"155\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>3-To get languages to work, we will navigate to welcome.blade.php in views subdirectory and replace HTML code in the illustrated figure with the below block of HTML code.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/laravel.png\" alt=\"Subdirectory - Laravel\" width=\"501\" height=\"199\" \/><\/div>\n<div align=\"center\"><\/div>\n<p>&nbsp;<\/p>\n<p>with<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/002-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"574\" height=\"69\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>In Laravel, {{(\u2018filename.key\u2019)}} is used to show the translations. We can also use inside php tags:<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/003-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"574\" height=\"69\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>And in blade engine, we can use @lang directive to achieve the same result.<br \/>\n@lang(&#8216;lang.title&#8217;)<\/p>\n<p>&nbsp;<\/p>\n<p>4-Now let\u2019s create url to handle locales, so we will navigate to routes directory and open web.php. Then we need to add routing:<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/004-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"574\" height=\"69\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>Finally, navigate to the browser and type https:\/\/localhost:8000\/es<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/res-1.png\" alt=\"Browser Navigation - Laravel\" width=\"501\" height=\"199\" \/><\/div>\n<div align=\"center\"><\/div>\n<p>&nbsp;<\/p>\n<p>As a result, we used short keys as a reference point in prior procedures. Assume you are working on a project that requires a lot of translation when you must reference them in the views, employing short keys in such an application can be highly confusing. Laravel advises using the default translation as the key to avoiding this. And to accomplish this, you will need to build JSON files.<\/p>\n<p>Let\u2019s create JSON file for languages.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/langresource.png\" alt=\"JSON File for Languages - Laravel\" width=\"501\" height=\"199\" \/><\/div>\n<div align=\"center\"><\/div>\n<p>&nbsp;<\/p>\n<p>es.json file:<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/005-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"574\" height=\"69\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>Let\u2019s run again and the result will be the same.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/res-2.png\" alt=\"Laravel Website Localization\" width=\"501\" height=\"199\" \/><\/div>\n<div align=\"center\"><\/div>\n<div align=\"center\"><\/div>\n<h3>Create a Language Switcher<\/h3>\n<p>So, what steps do we need to create a language switcher: let\u2019s start step by step:<\/p>\n<p>1-Create controller: we will call it LocalizationController in App\/Http\/Controllers. This controller will be used to record language in session and be able to retrieve it using the middleware that we create in the next step.<br \/>\nCommand: php artisan make:controller LocalizationController type this command in terminal under project path<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/006-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"603\" height=\"226\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>2-Create middleware that retrieves our current language from session<br \/>\nCommand: php artisan make:middleware Localization type this command in terminal under project path<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/007-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"653\" height=\"223\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>3-Assign middleware in kernel under app\/http\/Kernel.php<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/008-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"661\" height=\"174\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>4-Finally create a root for this.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/009-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"1091\" height=\"38\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>5-Wherever you save images, create a folder called flag and add images related to languages there.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" style=\"padding: 20px;\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/res-3.png\" alt=\"Flag Folder - Laravel\" width=\"501\" height=\"199\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>6-You can create a language switcher as shown below.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/010-1.png\" alt=\"Adding Multiple Languages - Laravel\" width=\"644\" height=\"183\" \/><\/div>\n<p>&nbsp;<\/p>\n<p>7-Finally, you will get a drop-down menu for languages.<\/p>\n<div align=\"center\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-32279\" style=\"padding: 20px;\" src=\"https:\/\/www.globalizationpartners.com\/wp-content\/uploads\/2021\/07\/res-4.png\" alt=\"Language Drop-Down Menu - Laravel\" width=\"501\" height=\"199\" \/><\/div>\n<p>&nbsp;<\/p>\n<h4>Conclusion<\/h4>\n<p>Laravel can easily handle localization. Laravel allows you to construct multilingual applications. You may set up numerous languages in your application in a few different methods.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Laravel is one of the most famous frameworks in PHP. Taylor Otwell built it as one of the most popular open-source PHP development frameworks for quickly and easily creating customizable online web applications. Laravel is more advanced than the CodeIgniter framework and is built based on Symfony-based architectural patterns. Laravel is an MVC framework with [&hellip;]<\/p>\n","protected":false},"author":30,"featured_media":32389,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[1782,104,1783,25],"_links":{"self":[{"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/posts\/32278"}],"collection":[{"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/users\/30"}],"replies":[{"embeddable":true,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/comments?post=32278"}],"version-history":[{"count":80,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/posts\/32278\/revisions"}],"predecessor-version":[{"id":32458,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/posts\/32278\/revisions\/32458"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/media\/32389"}],"wp:attachment":[{"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/media?parent=32278"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/categories?post=32278"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.globalizationpartners.com\/wp-json\/wp\/v2\/tags?post=32278"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}