Multilingual Web Application with Laravel:
Static Content

Let's start with the basics. Learn how to change your application locale, write localization files and use translations in your Laravel application.



Introduction

Greetings!
You are about to embark on a great journey.

If English is not your mother language, chances are that at some point in your career you will be tasked with creating a multilingual application/website. Lately, that is all that I have been doing. Creating a multilingual application complicates things and your code gets complex.

This course will guide you through the whole process of creating a multilingual application.

We will cover:

  • static content / localization
  • language switcher / routing (SEO)
  • model translations / database

In the first part of this course aka this tutorial aka Static Content, you will learn how to change your application locale dynamically and statically, write localization file and use translations in your views.

Btw. You will also learn some Croatian ;)

This if the starting point for this tutorial 8ae5aedfde3ce53af160e3127e761523be90d2ae;

Changing Locale

There are two ways of changing your application locale: statically (changing the locale in the config file) and dynamically (setting the locale during code execution).

In config/app.php under Application Locale Configuration you will find your current application locale en. This value gets loaded into your application at application start.

The application locale determines the default locale that will be used
by the translation service provider. You are free to set this value
to any of the locales which will be supported by the application.

Bellow it you will see Application Fallback Locale. This value tells your application to look for a translation in this locale if a translation in current locale is not found.

The fallback locale determines the locale to use when the current one
is not available. You may change the value to correspond to any of
the language folders that are provided through your application.

To statically change your application locale change the value under Application Locale Configuration to anything you want. For now, we will leave it be (en).

To change your application locale during code execution (dynamically) type \App::setLocale('hr');. You can replace hr with the locale that you want.

Writing localization files

Your application localization files are located under resources/lang/{locale}. By default, Laravel comes with en locale directory with localization files for auth, pagination, passwords and validation.

If you start our application with php artisan serve and visit / in your browser, you will see:

Welcome page

We want to localize words Documentation and News.

Let's create a new file inside resources/lang/en called app.php. Paste this code inside:

<?php

return [
    // key => value, goes here
    'documentation' => 'Documentation',
    'news' => 'News'
];

We now have English translations for documentation and news. Let's create Croatian translation for the same words. In resources/lang create a new folder called hr. Inside it create a new file app.php and paste this code inside:

<?php

return [
    // key => value, goes here
    'documentation' => 'Dokumentacija',
    'news' => 'Novosti'
];

As you may have noticed, everything is the same as in the English localization file, except the right side (value). This is how you create localization files for different languages.

Using translations in views

There are two main ways of using a translation in your view:

  • Blade directive @lang('app.documentation')
  • function {{ trans('app.documentation') }}

To localize the words in our view, go to resources/views/welcome.blade.php and replace these lines:

<div class="links">
    <a href="https://laravel.com/docs">Documentation</a>
    <a href="https://laracasts.com">Laracasts</a>
    <a href="https://laravel-news.com">News</a>
    <a href="https://forge.laravel.com">Forge</a>
    <a href="https://github.com/laravel/laravel">GitHub</a>
</div>

with:

<div class="links">
    <a href="https://laravel.com/docs">@lang('app.documentation')</a>
    <a href="https://laravel-news.com">@lang('app.news')</a>
</div>

If you visit our application on /, you will see that it still says Documentation and News. That is because our application locale is set to en. If you change it to hr, the words will change. Let's do that now. Go to config/app.php and change locale to hr. View the site:

Welcome translated

Great! This completes this tutorial. You now have the basic knowledge of localization that comes with Laravel out-of-the-box.

You can also dynamically change the locale in routes/web.php. Before the return view statement, type \App::setLocale('hr');.

This is the current state of the repository at this moment ef81e57d780211d52e324cf3218041e28e4405f6.

In the next tutorial, we will create a language switcher so that our users can choose the language that they want. Also, there will be talk about search engine optimization and routes. Happy Easter!

Comments