Hướng dẫn thiết kế website đa ngôn ngữ với PHP

0 31

Thiết kế một website đa ngôn ngữ là một cách hay để có thể thu hút thêm nhiều người đến với website của bạn. Để tạo được một website đa ngôn ngữ thì có nhiều vấn đề mà bạn cần quan tâm như: Code thế nào? Database cấu trúc thế nào? Đường dẫn ra sao …. có nhiều lắm, nhưng trong khuôn khổ bài này mình sẽ hướng dẫn các bạn một các cơ bản để tạo một website đa ngôn ngữ với PHP và MySQL.

1 1. Xác định hằng số

Như các bạn biết trong giao diện của một website thì có nhiều câu từ sẽ được viết thẳng vào giao diện html và nó không thay đổi, vậy bạn tập hợp các từ không đổi đó vào 1 file ngôn ngữ. Mỗi một ngôn ngữ bạn muốn thiết kế cho website của mình thì bạn tạo 1 file ngôn ngữ riêng biệt nhé, VD: lang_en.php hoặc lang_vi.php

Ví dụ:

Trong ví dụ này mình tạo 2 file: lang_en.php để chứa các hằng số bằng tiếng Anh, lang_vi.php để chứa các hằng số bằng tiếng Việt.

lang_en.php

<?php

define("_REGISTER", "Register");
define("_NAME", "Name");
define("_USERNAME", "Username");
define("_EMAIL", "Email");
define("_ADDRESS", "Address");
define("_SUBMIT", "Submit");

lang_vi.php

<?php

define("_REGISTER", "Đăng ký");
define("_NAME", "Họ Tên");
define("_USERNAME", "Tên đăng nhập");
define("_EMAIL", "Email");
define("_ADDRESS", "Địa chỉ");
define("_SUBMIT", "Gửi");

Thêm thẻ <meta> để đặt bộ ký tự thành utf8 trong html.

Tạo một <select> với các tùy chọn là các ngôn ngữ và tạo một <form> cho tùy chọn thay đổi này.

Khởi tạo $ _SESSION [‘lang’] với giá trị ngôn ngữ đã gửi và inlclude tệp ngôn ngữ đã tạo ở trên.

index.php

<?php
session_start();

// Đặt biến ngôn ngữ
if(isset($_GET['lang']) && !empty($_GET['lang'])){
 $_SESSION['lang'] = $_GET['lang'];
 if(isset($_SESSION['lang']) && $_SESSION['lang'] != $_GET['lang']){
  echo "<script type='text/javascript'> location.reload(); </script>";
 }
}

// Chèn vào tệp tin ngôn ngữ, ngôn ngữ mặc định là tiếng Anh
if(isset($_SESSION['lang'])){
 include "lang_".$_SESSION['lang'].".php";
}else{
 include "lang_en.php";
}
?>

<!doctype html>
<html>
 <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
 <body >
 <script>
 // Hàm thay đổi ngôn ngữ bằng JS
 function changeLang(){
  document.getElementById('form_lang').submit();
 }
 </script>

 <!-- Ngôn ngữ -->
 <form method='get' action='' id='form_lang' >
   Select Language : <select name='lang' onchange='changeLang();' >
   <option value='en' <?php if(isset($_SESSION['lang']) && $_SESSION['lang'] == 'en'){ echo "selected"; } ?> >English</option>
   <option value='vi' <?php if(isset($_SESSION['lang']) && $_SESSION['lang'] == 'vi'){ echo "selected"; } ?> >Vietnamese</option>
  </select>
 </form>

<!-- Form -->
 <h1><?= _REGISTER ?></h1>
 <form method='post' action=''>
  <?= _NAME ?> : <input type='text' name='name' /><br>
  <?= _USERNAME ?> : <input type='text' name='username' /><br>
  <?= _EMAIL ?> : <input type='text' name='email' /><br>
  <?= _ADDRESS ?> : <input type='text' name='address' /><br>
  <input type='submit' value='<?= _SUBMIT ?>'>
 </form>
 </body>
</html>

2 2. MySQL

Để xử lý đa ngôn ngữ trong cấu trúc cơ sở dữ liệu thì bạn có thể tạo các cột cho ngôn ngữ riêng biệt hoặc các bảng riêng biệt để lưu trữ theo từng ngôn ngữ.

Trong ví dụ này mình tạo cột để lưu trữ tiếng Anh và cột để lưu trữ tiếng Việt.

Nhớ đặt Collation của bảng và các trường lưu trữ ngôn ngữ như title_vi, content_vi thành utf8_general_ci .

CREATE TABLE IF NOT EXISTS `posts` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `title` varchar(100) CHARACTER SET latin1 NOT NULL,
 `title_vi` varchar(100) NOT NULL,
 `content` text CHARACTER SET latin1 NOT NULL,
 `content_vi` text NOT NULL,
 `link` varchar(255) CHARACTER SET latin1 NOT NULL,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

config.php

<?php
session_start();

$host = "localhost"; /* Host name */
$user = "root"; /* Tên đăng nhập */
$password = ""; /* Mật khẩu */
$dbname = "tutorial"; /* Tên Database */

$con = mysqli_connect($host, $user, $password,$dbname);
// Kiểm tra kết nối
if (!$con) {
 die("Connection failed: " . mysqli_connect_error());
}
mysqli_set_charset( $con, 'utf8');

CHÚ Ý – Chắc chắn rằng bạn đã thêm mysqli_set_charset( $connection-variable, ‘utf8’).


$connection-variable: biến kết nối

lang_en.php

<?php

define("_POSTS", "POSTS");
define("_MORE", "More");

lang_vi.php

<?php

define("_POSTS", "Bài viết");
define("_MORE", "Xem thêm");

index.php

<?php
session_start();
include "config.php";
// Đặt biến ngôn ngữ
if(isset($_GET['lang']) && !empty($_GET['lang'])){
 $_SESSION['lang'] = $_GET['lang'];
 if(isset($_SESSION['lang']) && $_SESSION['lang'] != $_GET['lang']){
  echo "<script type='text/javascript'> location.reload(); </script>";
 }
}

// Chèn vào tệp tin ngôn ngữ, ngôn ngữ mặc định là tiếng Anh
if(isset($_SESSION['lang'])){
 include "lang_".$_SESSION['lang'].".php";
}else{
 include "lang_en.php";
}
?>

<!doctype html>
<html>
 <head>
  <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
  <link href="style.css" type="text/css" rel="stylesheet">
 </head>
 <body >
 <script>
 // Hàm thay đổi ngôn ngữ bằng JS
 function changeLang(){
  document.getElementById('form_lang').submit();
 }
 </script>

 <!-- Ngôn ngữ -->
 <form method='get' action='' id='form_lang' >
   Select Language : <select name='lang' onchange='changeLang();' >
   <option value='en' <?php if(isset($_SESSION['lang']) && $_SESSION['lang'] == 'en'){ echo "selected"; } ?> >English</option>
   <option value='vi' <?php if(isset($_SESSION['lang']) && $_SESSION['lang'] == 'vi'){ echo "selected"; } ?> >Vietnamese</option>
  </select>
 </form>

 <!-- Danh sách bài viết -->
 <h1><?= _POSTS ?></h1>
 <div class="container">

 <?php
 $query = "select * from posts";
 $result = mysqli_query($con,$query);

 while($row = mysqli_fetch_array($result)){

  // Chọn trường hiển thị
  $title_field = "title";
  $content_field = "content";
  if(isset($_SESSION['lang']) && $_SESSION['lang'] == 'vi'){
   $title_field = "title_vi";
   $content_field = "content_vi";
  }
  $id = $row['id'];
  $title = $row[$title_field];
  $content = $row[$content_field];
  $shortcontent = substr($content, 0, 160)."...";
  $link = $row['link'];
?>
 <!-- Post -->
 <div class="post" id="post_<?php echo $id; ?>">
 <h1><?php echo $title; ?></h1>
 <p>
 <?php echo $shortcontent; ?>
 </p>
 <a href="<?php echo $link; ?>" class="more" target="_blank"><?= _MORE ?></a>
 </div>

 <?php
 }
 ?>
 </div>
 </body>
</html>

3 3. Kết luận

Chú ý đặt thẻ <meta> vào trong phần giao diện html

<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>

Đặt Collation của bảng cơ sở dữ liệu là utf8_general_ci

  • Bài viết này có hữu ích không?
  •    không
Loading...

Để lại một trả lời

Địa chỉ email của bạn sẽ không được công bố.