آموزش طراحی سایت چند زبانه با فریم ورک لاراول

دسته بندی: آموزش
زمان مطالعه: 26 دقیقه
۳۰ خرداد ۱۳۹۹

در این مقاله به آموزش طراحی سایت چند زبانه با لاراول و ترجمه سایت توسط فریم ورک لاراول خواهیم پرداخت. هم ‌چنین از سیستم trans در فریم ورک لاراول، فایل‌های ترجمه‌ی مستقیم و بدون استفاده از کلید‌های واسط و سیستم config لاراول برای ذخیره‌سازی زبان‌های پشتیبانی شده استفاده می‌کنیم. نکته‌ی قابل توجه در پیاده سازی این وب سایت‌های چند‌زبانه قابل توسعه بودن زبان‌های پشتیبانی شده در وب سایت می‌باشد.

فهرست محتوای این مقاله

چند زبانه بودن برنامه‌های وب

چند زبانه بودن وب سایت یعنی پیاده‌سازی امکانی که کاربر بتواند بر اساس زبان کشوری که در آن زندگی می‌کند یا زبان مادری خود از خدمات وب اپلیکیشن یا وب سایت ما استفاده کند و این مورد اهمیت بسیار بالایی دارد.

Multi Language

سایت‌های چند‌زبانه در دنیای امروز کاربران و مشتریان بیشتری از سایت‌های تک‌زبانه خواهند داشت و پیاده سازی این ویژگی می‌تواند یک قابلیت مهم برای وب سایت به شمار آید و بسیاری از کسانی که به شما سفارش ایجاد وب اپلیکیشن و وب سایت می‌دهند از شما می‌خواهند این مورد را پیاده سازی کنید.

تکنیک‌های زیادی برای پیاده سازی قابلیت چند زبانه وجود دارد که هر کدام مزایا و معایب خاص خود را دارند و ما در این آموزش سعی می‌کنیم یکی از بهترین روش‌های موجود را برای فریم ‌ورک Laravel و وب اپلیکیشن هایی که با آن ساخته می‌شود پیاده سازی کنیم.

یکی از امکانات جالب و آسان در فریم ورک لاراول استفاده از خدمات ترجمه برای پیاده سازی سایت‌های چند زبانه می‌باشد. این بخش به شما به عنوان توسعه دهنده این امکان را می‌دهد که به تعداد دلخواه، هر زبانی را که می‌خواهید به وب سایت خود اضافه کنید.

امکان استفاده ترجمه‌ها در API موبایل

یکی از قابلیت‌های خوب لاراول امکان ترکیب این بخش چند زبانه با بخش‌های دیگر وب سایت برای ارائه به صورت API موبایل می‌باشد که به راحتی قابل استفاده است.

طراحی سایت چند زبانه با فریم ورک لاراول

همان‌طور که گفتیم، برای پیاده‌سازی یک سایت چندزبانه راه‌های مختلفی وجود دارد که با توجه به نوع سایت می‌توانیم یک راه را انتخاب کنیم. اما راهی که در این ‌‌‌آموزش به آن می‌پردازیم یک راه ساده، کاربردی و در عین حال انعطاف‌پذیر است که به‌طور معمول برای تمام سایت‌ها قابل اجرا و کاملا مناسب است.

ابتدا در پوشه‌ برنامه لاراول و قسمت config یک فایل PHP با نام translation یا نامی دلخواه ایجاد می‌کنیم. یک نکته‌‌ی مهم درباره‌ی فایل‌هایی که در پوشه config می‌سازیم این است که تمام این فایل‌ها باید یک ‌‌آرایه را مانند زیر برگرداند.

<?php

return [
    
];

حال می‌خواهیم یک آرایه که زبان‌های سایت ما را مشخص می‌کند به‌شکل زیر برگردانیم.

<?php
return [
    'languages'=>[
        'fa'=>'Persian',
        'ar'=>'Arabic',
        'en'=>'English'
    ]
];

اگر به url سایت‌های چند‌زبانه توجه کرده باشید، به‌طور مثال، زمانی که بخواهید مطالب یک سایتی که قابلیت Multi-Language دارد، به زبان انگلیسی نمایش داده شود، کافیست در ابتدا یا انتها url سایت keyword یا کلمه کلیدی en را قرار دهید.

ما در کد بالا en را برابر با English یا همان زبان انگلیسی قرار دادیم. البته توجه کنید که هنوز بر روی این زبان‌ها هیچ دستوری پیاده سازی نشده است و در ادامه‌ی آموزش طراحی سایت چند زبانه با فریم ورک لاراول ، به این کار خواهیم پرداخت.

حال فرض کنید که یک Blade برای ایجاد یک Post در صفحه‌ی سایت‌مان داریم و به طور مثال این Blade که نامش create.blade.php است در درون Contorller ما PostsController را مانند زیر برگردانده یا return می‌شود.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class PostsController extends Controller
{
    public function create()
    {
      return view('posts.create');  
    }
}

حال فرض کنید که می‌خواهید همین Controller که به return، create.blade.php می‌شود، صفحه‌ی مورد نظر ما یعنی همان create.blade را Multilanguage یا چندزبانه کند. برای این‌کار مانند دستور زیر عمل می‌کنیم.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class PostsController extends Controller
{
    public function create()
    {
      $languages=config('translation.languages');
      return view('posts.create',compact('languages'));
    }
}

ما در دستور بالا از پوشه‌ی config و فایل translation آرایه‌ی languages را گرفته و در متغیر languages$ قرار دادیم. سپس آن را توسط تابع compact به create.blade ارسال کردیم. حال در create.blade می‌توانیم آن را فراخوانی کنیم.

ما در کد زیر قسمتی از create.blade، که مربوط به tab‌ها است را به‌طور مثال آورده‌ایم و شما کافی است با پیاده‌سازی قابلیت Multilanguage آشنا شوید تا بتوانید این قابلیت را در کدهای خود آن‌گونه که می‌خواهید پیاده‌سازی کنید.

    <li class="nav-item">
        <a href="#persian" id="persian-tab" data-toggle="tab" role="tab" aria-controls="" class="nav-link active">Persian</a>
    </li>
    <li class="nav-item">
        <a href="#arabic" id="arabic-tab" data-toggle="tab" role="tab" aria-controls="" class="nav-link">Arabic</a>
    </li>
    <li class="nav-item">
        <a href="#english" id="english-tab" data-toggle="tab" role="tab" aria-controls="" class="nav-link">English</a>
    </li>

در کد بالا باید languages$ را فراخوانی کنیم و تغییرات زیر را بر روی Blade اعمال کنیم. توجه کنید که languages$ یک آرایه است و همچنین ما زبان فارسی را به‌صورت پیش‌فرض برای سایت‌مان active گذاشتیم.

@foreach($languages as $lang_code => $lang_title)
    <li class="nav-item">
        <a href="#{{ strtolower($lang_title) }}" id="{{ strtolower($lang_title) }}-tab" data-toggle="tab" role="tab" aria-controls="" class="nav-link @if($loop->first) active @endif">{{ $lang_title }}</a>
    </li>
@endforeach

با استفاده از دستور بالا کدمان را از حالت دستی وارد کردن در می‌آوریم و با استفاده از حلقه foreach آن را هوشمند و Dynamic می‌کنیم. هم‌چنین برای این‌که بگوییم اولین loop از foreach که همان زبان فارسی است به‌صورت active دربیاید از دستور [email protected] مانند بالا استفاده می‌کنیم.

ما از منطق کد بالا می‌توانیم در تمام برنامه‌ها استفاده کنیم، یعنی مانند دستوراتی که در بالا نوشته‌ایم، در هر کجا از کدمان که بخواهیم از حالت Multi-Language استفاده کنیم، می‌توانیم با استفاده از حلقه [email protected] آن را Dynamic کنیم.

حال فرض کنید که می‌خواهیم در صفحه‌ی سایت‌مان یک Post ایجاد کنیم، پس همان‌طور که گفتیم و مانند مکانیسم قبلی برای پیاده سازی سایت Multilanguage از کد زیر استفاده می‌کنیم.

<form action="" method="post">
    {{ csrf_field() }}
    <div class="tab-content" id="translation_tabs_contents">
        @foreach($languages as $lang_code => $lang_title)
           <div class="tab-panel fade @if($loop->first) show active @endif" id="{{ strtolower($lang_title) }}" role="tabpanel">
               <div class="form-group">
                   <label for="post_title_{{ $lang_code }}">Post Title</label>
                   <input type="text" class="form-control" id="post_title_{{ $lang_code }}" name="post_title_{{ $lang_code }}">
               </div>
               <div class="form-group">
                   <label for="post_content_{{ $lang_code }}">Post Content</label>
                   <textarea name="post_content_{{ $lang_code }}" class="form-control" id="post_content_{{ $lang_code }}" cols="30" rows="15"></textarea>
               </div>
           </div>
        @endforeach
    </div>
    <button type="submit" class="btn btn-primary">Save Post</button>
</form>

تا به‌حال ما Tab و Content تشکیل پست سایت را تنها از نظر کد Dynamic کردیم و در ادامه‌ی آموزش طراحی سایت چند زبانه با فریم ورک لاراول ، باید از لحاظ منطقی و نوشتاری آن را Dynamic کنیم.

حال فرض کنید که یک Route برای PostsController و تابع Store مانند زیر داریم.

<?php

use Illuminate\Support\Facades\Route;
Route::get('/',"[email protected]");
// Route for PostsController & Create Function
Route::get('/',"[email protected]");
// Route for PostsController & Store Function
Route::post('/',"[email protected]");

در کد بالا همان‌طور که گفتیم یک Route برای PostsController و تابع Store ساختیم و حال باید این تابع را در PostsController ایجاد کنیم. پس از ایجاد تابع Store، دستورات زیر را در آن وارد می‌کنیم.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class PostsController extends Controller
{
    public function create()
    {
      $languages=config('translation.languages');
      return view('posts.create',compact('languages'));
    }

    public function store(Request $request)
    {
        $params = $request->all();
        $languages=config('translation.languages');
        $translation= [];
        foreach($languages as $lang_code => $lang_title){
            if ($this->checkTranslation($lang_code,$params))
            {
                $translation[]=[
                 'title' => $params['post_title_'.$lang_code],
                 'content' => $params['post_content_'.$lang_code]

                ];
            }
        }
    }
    private function checkTranslation($lang_code,$params){
        return isset($params['post_title_'.$lang_code]) && !empty($params['post_title_'.$lang_code]) &&
        isset($params['post_content_'.$lang_code]) && !empty($params['post_content_'.$lang_code]);
    }
}

ما در ابتدا تمام درخواست‌های ارسال شده را در داخل متغیر params$ ذخیره می‌کنیم. سپس مانند تابع create تمام language‌های موجود در فایل translation در پوشه config را می‌گیریم و در languages$ ذخیره می‌کنیم. حال یک آرایه‌ی خالی یا تهی به ‌نام translation$ ایجاد می‌کنیم تا در حلقه‌ی foreach از آن استفاده کنیم.

در حلقه‌ی foreach تمام languages‌ها را گرفته و توسط تابع checkTranslation که در Class تعریف کردیم و برای چک کردن Set شدن و خالی نبودن Field‌های content و title بود، بررسی می‌کنیم. در این صورت اگر بررسی ما درست بود در آرایه translation$، داده ‌های title و content را قرار می‌دهیم. حال برای ذخیره‌سازی آن‌ها باید یک Model ایجاد کنیم، پس به ساخت یک Model و پیاده‌سازی آن می‌پردازیم.

$ php artisan make:model Post -m
$ php artisan make:model Translation -m

توسط دستور بالا دو model با نام‌های Post و Translation و migration مرتبط با آن‌ها، ایجاد می‌کنیم.

حال در Post, migration یک جدول می‌سازیم. برای این‌کار به Post, migration می‌رویم و دستورات زیر را وارد می‌کنیم.

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreatePostsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('user_id');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('posts');
    }
}

سپس برای Translate کردن به migration و Translate می‌رویم و در آن دستورات زیر را وارد می‌کنیم.

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateTranslationsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('translations', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('post_id');
            $table->string('lang',10);
            $table->string('title',100);
            $table->text('content');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('translations');
    }
}

حال که کدنویسی migration‌ها تمام شد آن‌ها را توسط دستور زیر اجرا می‌کنیم.

$ php artisan migrate

حالا Model هایی که ساختیم را Setup می‌کنیم.

برای Post:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    protected $guarded = ['id'];
}

برای Translation:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Translation extends Model
{
    protected $guarded = ['id'];
}

همان‌طور که احتمالا می‌دانید، Post و Translation با هم ارتباط دارند. برای این‌کار باید از Post به Translation و بالعکس یک رابطه ایجاد کنیم.

برای ایجاد ارتباط از Post به Translation:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    protected $guarded = ['id'];

    public function translations()
    {
        return $this->hasMany(Translation::class,'post_id');
    }
}

برای ایجاد ارتباط از Translation به Post:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Translation extends Model
{
    protected $guarded = ['id'];

    public function post()
    {
        return $this->belongsTo(Post::class,'post_id');
    }
}

حال به PostsController برمی‌گردیم و برای ذخیره‌سازی داده‌ها، ابتدا آن‌ها را در Database توسط Model ایجاد می‌کنیم.

<?php

namespace App\Http\Controllers;

use App\Post;
use Illuminate\Http\Request;

class PostsController extends Controller
{
    public function create()
    {
      $languages=config('translation.languages');
      return view('posts.create',compact('languages'));
    }

    public function store(Request $request)
    {
        $params = $request->all();

        $newpost = Post::create([
            'user_id' => 1
        ]);
        if ($newpost) {
            $languages=config('translation.languages');
            $translation= [];
            foreach ($languages as $lang_code => $lang_title) {
                if ($this->checkTranslation($lang_code, $params)) {
                    $translation[] = [
                        'lang' => $lang_code,
                        'title' => $params['post_title_' . $lang_code],
                        'content' => $params['post_content_' . $lang_code]
                    ];
                }
            }
            $newpost->translations()->createMany($translation);
            return back();
        }
    }
    private function checkTranslation($lang_code,$params){
        return isset($params['post_title_'.$lang_code]) && !empty($params['post_title_'.$lang_code]) &&
        isset($params['post_content_'.$lang_code]) && !empty($params['post_content_'.$lang_code]);
    }
}

ما در دستورات بالا از طریق relation بین Post و ‌Translation، بعد از ساخت یک  Translation ,Post مربوط به ‌آن را در Database و جدول Translation ایجاد می‌کنیم.

حال به‌طور مثال برای Post، یک بار به زبان عربی، یک بار فارسی و بار دیگر متنی انگلیسی وارد می‌کنیم، سپس Post کرده تا توسط تابع Store در PostsController در Database ذخیره شود.

  • متن آزمایشی فارسی: لورم ایپسوم یا طرح‌نما (به انگلیسی: Lorem ipsum) به متنی آزمایشی و بی‌معنی در صنعت چاپ، صفحه‌آرایی و طراحی گرافیک گفته می‌شود. طراح گرافیک از این متن به عنوان عنصری از ترکیب بندی برای پر کردن صفحه و ارایه اولیه شکل ظاهری و کلی طرح سفارش گرفته شده استفاده می‌نماید، تا از نظر گرافیکی نشانگر چگونگی نوع و اندازه فونت و ظاهر متن باشد. معمولا طراحان گرافیک برای صفحه‌آرایی، نخست از متن‌های آزمایشی و بی‌معنی استفاده می‌کنند تا صرفا به مشتری یا صاحب کار خود نشان دهند که صفحه طراحی یا صفحه بندی شده بعد از اینکه متن در آن قرار گیرد چگونه به نظر می‌رسد و قلم‌ها و اندازه‌بندی‌ها چگونه در نظر گرفته شده‌است. از آنجایی که طراحان عموما نویسنده متن نیستند و وظیفه رعایت حق تکثیر متون را ندارند و در همان حال کار آنها به نوعی وابسته به متن می‌باشد آنها با استفاده از محتویات ساختگی، صفحه گرافیکی خود را صفحه‌آرایی می‌کنند تا مرحله طراحی و صفحه‌بندی را به پایان برند.
  • متن آزمایشی عربی:
    لکن لا بد أن أوضح لک أن کل هذه الأفکار المغلوطه حول استنکار  النشوه وتمجید الألم نشأت بالفعل، وسأعرض لک التفاصیل لتکتشف حقیقه وأساس تلک السعاده البشریه، فلا أحد یرفض أو یکره أو یتجنب الشعور بالسعاده، ولکن بفضل هؤلاء الأشخاص الذین لا یدرکون بأن السعاده لا بد أن نستشعرها بصوره أکثر عقلانیه ومنطقیه فیعرضهم هذا لمواجهه الظروف الألیمه، وأکرر بأنه لا یوجد من یرغب فی الحب ونیل المنال ویتلذذ بالآلام، الألم هو الألم ولکن نتیجه لظروف ما قد تکمن السعاده فیما نتحمله من کد وأسی.
    و سأعرض مثال حی لهذا، من منا لم یتحمل جهد بدنی شاق إلا من أجل الحصول على میزه أو فائده؟ ولکن من لدیه الحق أن ینتقد شخص ما أراد أن یشعر بالسعاده التی لا تشوبها عواقب ألیمه أو آخر أراد أن یتجنب الألم الذی ربما تنجم عنه بعض المتعه.
  • متن آزمایش انگلیسی:

    The quick, brown fox jumps over a lazy dog. DJs flock by when MTV ax quiz prog. Junk MTV quiz graced by fox whelps. Bawds jog, flick quartz, vex nymphs. Waltz, bad nymph, for quick jigs vex! Fox nymphs grab quick-jived waltz. Brick quiz whangs jumpy veldt fox. Bright vixens jump; dozy fowl quack. Quick wafting zephyrs vex bold Jim. Quick zephyrs blow, vexing daft Jim. Sex-charged fop blew my junk TV quiz. How quickly daft jumping zebras vex. Two driven jocks help fax my big quiz. Quick, Baz, get my woven flax jodhpurs! "Now fax quiz Jack!" my brave ghost pled. Five quacking zephyrs jolt my wax bed. Flummoxed by job, kvetching W. zaps Iraq. Cozy sphinx waves quart jug of bad milk. A very bad quack might jinx zippy fowls. Few quips galvanized the mock jury box. Quick brown dogs jump over the lazy fox. The jay, pig, fox, zebra, and my wolves quack! Blowzy red vixens fight for a quick jump. Joaquin Phoenix was gazed by MTV for luck. A wizard’s job is to vex chumps quickly in fog

حال ما Post خود را ایجاد کرده ایم و می‌خواهیم آن را نمایش دهیم. قطعا برای نمایش Post به یک Controller به‌طور مثال با نام HomeController و کد زیر:

<?php

namespace App\Http\Controllers;

use App\User;

class HomeController extends Controller
{
    public function index()
    {
        $posts = [];
        return view('home',compact('posts')) ;
    }
}

و یک Blade یا همان View با نامی مانند home.blade با کدی مانند کد زیر نیازمندیم.

<!doctype html>
<html lang="en">
<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>Document</title>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-12">
            <civ class="card">
                <div class="card-body">
                    <h5 class="card-title">
                        <div class="post-content">
                             Post Content
                        </div>
                    </h5>
                </div>
            </civ>
        </div>
    </div>
</div>
<script src="/js/app.js"></script>
</body>
</html>

کد بالا حالت Dynamic ندارد، پس باید آن را Dynamic کنیم.

برای  Dynamic کردن کد‌ها باید ابتدا آن‌ها را در Controller دریافت کنیم و سپس آن را به View توسط تابع Compact ارسال کنیم.

<?php

namespace App\Http\Controllers;

use App\Post;
use App\User;

class HomeController extends Controller
{
    public function index()
    {
        $posts = Post::with('Translation')->get();
        return view('home',compact('posts')) ;
    }
}

توسط دستورات بالا ما متن Post را به تمام زبان‌های سایت یعنی فارسی، عربی و انگلیسی نمایش می‌دهیم. اما ما می‌خواهیم تنها متن Post را با یک زبان یعنی زبانی که کاربر برای سایت انتخاب کرده است نمایش دهیم. پس یک تابع دیگر مانند currentTranslation باید ایجاد کنیم تا به‌جای رابطه hasMany یک رابطه ۱ به ۱ بین Post و Translation ایجاد کند.

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    protected $guarded = ['id'];

    public function translations()
    {
        return $this->hasMany(Translation::class,'post_id');
    }

    public function currentTranslation()
    {
        return $this->hasOne(Translation::class,'post_id')->where('lang','fa');
    }
}

در تابع currentTranslation در بالا ما تنها یک داده به‌خاطر رابطه hasOne برمی‌گردانیم و توسط where, Collection مشخص کردیم که به‌طور مثال تنها داده‌ای از Database را برگرداند که lang آن برابر با fa است.

سپس از HomeController عملیات with را به‌جای Translation به currentTranslation، مرتبط یا related می‌کنیم.

<?php

namespace App\Http\Controllers;

use App\Post;
use App\User;

class HomeController extends Controller
{
    public function index()
    {
        $posts = Post::with('currentTranslation')->get();
        return view('home',compact('posts')) ;
    }
}

بعد از نوشتن دستورات بالا می‌توانیم home.blade را Dynamic کنیم. برای این‌کار ابتدا مانند همان دستور بالا posts$ را توسط compact به home ارسال می‌کنیم. سپس تغییرات زیر را در home.blade اعمال می‌کنیم.

<!doctype html>
<html lang="en">
<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>Document</title>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-12">
            <civ class="card">
                <div class="card-body">
                    @foreach ($posts as $post)
                        <h5 class="card-title">{{ $post->currentTranslation->title }}</h5>
                        <div class="post-content">
                            {{ $post->currentTranslation->content }}
                        </div>
                    @endforeach
                </div>
            </civ>
        </div>
    </div>
</div>
<script src="/js/app.js"></script>
</body>
</html>

اگر دقت کرده باشید، ما در مدل Post زبان را به‌ شکل زیر و دستی, 'fa' وارد کردیم.

public function currentTranslation() {
return $this->hasOne(Translation::class,'post_id')->where('lang','fa'); 
}

به‌جای کد بالا می‌توانیم زبانمان را از app و locale دریافت کنیم و آن را به‌جای 'fa' قرار دهیم.

$lang=app()->getLocale();
return $this->hasOne(Translation::class,'post_id')->where('lang',$lang);

برای دیدن زبان locale سایت خود یا تغییر آن باید به پوشه‌ی config و فایل app.php، قسمت locale بروید و آن را می‌توانید به زبان مورد نظر خود تعییر دهید.

/*
    |--------------------------------------------------------------------------
    | Application Locale Configuration
    |--------------------------------------------------------------------------
    |
    | 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.
    |
    */

    'locale' => 'en'

هم‌چنین می‌توانیم زبان را در پوشه resources و lang انتخاب کنیم که به‌صورت پیش‌فرض، تنها پوشه en برای زبان انگلیسی ساخته شده است.

اما حال می‌خواهیم روشی بهتر را آموزش دهیم و برای این‌کار، باید در همان پوشه lang یک فایل برای زبان فارسی و با فرمت JSON به‌نام fa.json ایجاد کنیم.

این فایل در همه ‌جای صفحه کاربرد دارد، به‌طور مثال کد JSON زیر را زمانی استفاده می‌کنیم که زبان سایت و دکمه‌ی Save Post فارسی باشد.

کد JSON :

{
    "Save Post": "ذخیره مطلب"
}

سپس صفحه‌‌ی create.blade و Save Post را به شکل زیر تغییر می‌دهیم.

<form action="" method="post">
    {{ csrf_field() }}
    <div class="tab-content" id="translation_tabs_contents">
        @foreach($languages as $lang_code => $lang_title)
           <div class="tab-panel fade @if($loop->first) show active @endif" id="{{ strtolower($lang_title) }}" role="tabpanel">
               <div class="form-group">
                   <label for="post_title_{{ $lang_code }}">Post Title</label>
                   <input type="text" class="form-control" id="post_title_{{ $lang_code }}" name="post_title_{{ $lang_code }}">
               </div>
               <div class="form-group">
                   <label for="post_content_{{ $lang_code }}">Post Content</label>
                   <textarea name="post_content_{{ $lang_code }}" class="form-control" id="post_content_{{ $lang_code }}" cols="30" rows="15"></textarea>
               </div>
           </div>
        @endforeach
    </div>
    <button type="submit" class="btn btn-primary">{{ __('Save Post') }}</button>
</form>

در فایل JSON ما می‌توانیم ترجمه‌های دیگری هم با زبان‌های مختلف، که در این سایت زبان انگلیسی، فارسی و عربی است به‌صورت fa.json و ar.json ایجاد کنیم. توجه کنید که دیگر لازم نیست فایل en.json بسازیم، زیرا خود مطالب را به‌طور مثال با زبان انگلیسی وارد می‌کنیم.

کد JSON کامل‌تر :

{
    "Save Post": "ذخیره مطلب",
    "Post Title": "عنوان مطلب",
    "Post Content": "متن اصلی"
}

صفحه create.blade :

<form action="" method="post">
    {{ csrf_field() }}
    <div class="tab-content" id="translation_tabs_contents">
        @foreach($languages as $lang_code => $lang_title)
           <div class="tab-panel fade @if($loop->first) show active @endif" id="{{ strtolower($lang_title) }}" role="tabpanel">
               <div class="form-group">
                   <label for="post_title_{{ $lang_code }}">{{ __('Post Title') }}</label>
                   <input type="text" class="form-control" id="post_title_{{ $lang_code }}" name="post_title_{{ $lang_code }}">
               </div>
               <div class="form-group">
                   <label for="post_content_{{ $lang_code }}">{{ __('Post Content') }}</label>
                   <textarea name="post_content_{{ $lang_code }}" class="form-control" id="post_content_{{ $lang_code }}" cols="30" rows="15"></textarea>
               </div>
           </div>
        @endforeach
    </div>
    <button type="submit" class="btn btn-primary">{{ __('Save Post') }}</button>
</form>

ویدیو آموزش طراحی سایت چند زبانه با لاراول

در آموزش ویدیویی زیر به شما خواهیم آموخت چگونه با ساختار مدل‌ها و دیتابیس لاراول امکان پیاده سازی سایت‌های چند زبانه را فراهم کنید. نکته قابل توجه در پیاده سازی این وب سایت‌های چند زبانه قابل توسعه بودن تعداد زبان‌های پشتیبانی شده در وب سایت می‌باشد که به طور کامل در ویدیو آموزش داده شده است.

در آموزش پیاده سازی سایت چند زبانه موارد زیر را بررسی خواهیم کرد

  • سیستم trans در فریمورک لاراول
  • پیاده سازی مدل‌های Post و Translation و استفاده از رابطه‌های لاراول
  • استفاده از فایل‌های ترجمه مستقیم و بدون استفاده از کلید‌های واسط
  • ذخیره سازی زبان‌های پشتیبانی شده در وب سایت توسط سیستم config لاراول

جمع‌بندی:

امروزه با پیشرفت چشم‌گیر علم و تکنولوژی، دیگر بسیاری از سایت‌های بزرگ و کوچک خدمات خود را جهانی کرده‌اند و قطعا برای پاسخگویی به نیاز تمام کاربران با زبان‌های مختلف در سطح وب، داشتن یک سایت چند‌زبانه امری بسیار ضروریست به همین منظور در این مقاله به آموزش طراحی سایت چند زبانه با لاراول یا Multilanguage پرداختیم. قطعا برای ساخت این نوع وب ‌سایت‌ها روش‌های مختلفی وجود دارد که ما تنها یکی از این روش‌ها را آموزش دادیم.

اگر به یادگیری بیشتر لاراول علاقه داری می‌تونی در دوره آموزشی لاراول کاربردی (بسته پروژه محور) شرکت کنی، این دوره شامل ۱۲ پروژه کاربردی و پر استفاده در دنیای واقعی است، که تمامی پروژه‌ها به صورت کامل برنامه‌ نویسی خواهند شد، تا دانشجو بتواند با روند ایجاد و تکمیل پروژه به صورت کامل آشنا شود.

چه امتیازی به این مقاله می دید؟
نویسنده کیوان علی محمدی
یادگیرنده ی همیشگی،برنامه نویس،نویسنده،عاشق خلق چیزهای عجیب،عاشق تحلیل داده ها، مسئول بخش فنی و هم بنیان گذار در سون لرن.

نظرات کاربران

علیرضا

بابت این آموزش تشکر میکنم
من تمام مراحل رو انجام دادم اما برای updateمشکل دارم و نمیتونم داده خودم رو update کنم.ممنون میم یک مثال برای update داده ها ارئه بدید

فائقه نامور

سلام ممنون از توجه شما
موردی که اشاره فرمودید به تیم تولید محتوا انتقال داده می شود

mehrzad

سلام مهندس
خواستم تشکر کنم از تون بابت آموزش بسیار عالی تون.
خداوند خیر برکت عطا بنماید 🙂

حمید غیاثی

ممنون از این آموزش خوب دو تا سوال داشتم اولین سوالم اینه که برای داینامیک کردن ترجمه های هر بخش نیاز به یه تیبل ترنسلیت جداگونه هست؟ و اینکه کوکی با انتخاب لینک زبان مقدارش عوض نمیشه و باید صفخه رو رفرش کرد این چطور حل میشه؟

محمد

سلام و سپاس از این آموزش مفید شما

متین رحمانیان

سلام. جناب علی محمدی خسته نباشید، تشکر بابت آموزش فوق‌العاده‌تون. در این آموزش و برای ادیتورتون، از چه فونتی استفاده کرده‌اید؟ ممنون می‌شوم لینکش را ارسال کنید.

علی رضوی

سلام خیلی ممنونم بابت این اموزش عالی و درجه یک دستتون درد نکنه ببخشید اقای علیمحمدی نسخه گنو لینوکس استفاده شده تون چیه؟

سئو

نسخه دبیان

ارسال دیدگاه
خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :