Cách tạo URL thân thiện với SEO trong laravel

Trong bài viết này tôi sẽ chia sẻ cho các bạn cách sinh 1 URL thân thiện đối với SEO trong Laravel 5.3.

Như chúng ta đã biết. SEO là 1 phần rất quan trọng đối của 1 website để gia tăng lượng người dùng truy cập vào website. Nếu website của bạn có URL thân thiện với SEO thì nó có thể giúp đỡ việc gia tăng rand website của bạn trên các công cụ tìm kiếm như Google, Yahoo, ... Vì vậy nếu bạn được yêu cầu sinh 1 URL thân thiện với SEO trong ứng dụng Laravel thì bạn có thể sử dụng package eloquent-sluggable. Nó được phát triển bởi cviebrock.

I. Slug là gì và tại sao lại dùng nó ?

1. Slug là gì ?

Chắc giờ bạn đang thắc mắc slug là gì đúng không nào ? slug hiểu đơn giản là 1 url thông thường mà đã loại bỏ hết các ký tự không thân thiện đối với URL như khoảng trắng, các ký tự có dấu, các ký hiệu ...

2. Tại sao lại dùng slug ?

Giả sử bạn có 1 bài viết với tiêu đề là My Dinner With André & François thì khi dùng url nó sẽ sinh ra như thế này http://example.com/post/My+Dinner+With+Andr%C3%A9+%26+Fran%C3%A7ois. Như bạn thấy đấy, đây rõ ràng là 1 URL không thân thiện với SEO tý nào cả. Nếu url được đổi thành như dưới đây thì sẽ cực kỳ thân thiện và tốt cho SEO lắm đấy (😄) http://example.com/post/my-dinner-with-andre-francois

Để làm được điều này bạn hãy dùng slug nhé.

II. Cách cài đặt

1. Cài đặt package bằng composer

    $ composer require cviebrock/eloquent-sluggable:4.1

2. Cập nhật vào file config/app.php

'providers' => [
    // ...
    Cviebrock\EloquentSluggable\ServiceProvider::class,
];

3. Public file cấu hình mặc định ra thư mục app/config

php artisan vendor:publish --provider="Cviebrock\EloquentSluggable\ServiceProvider"

III. Cách sử dụng

1. Cập nhật trong Model

  • Dùng Sluggable trait
  • implement phương thức sluggable.
  • Có 1 cột trong database để lưu giá trị của slug

Example

use Cviebrock\EloquentSluggable\Sluggable;

class Post extends Model
{
    use Sluggable;

    public function sluggable()
    {
        return [
            'slug' => [
                'source' => 'title'
            ]
        ];
    }

}

2. Save model

$post = new Post([
    'title' => 'My Awesome Blog Post',
]);

$post->save();

3. Hiển thị giá trị của slug

echo $post->slug;

IV. Giới thiệu các tham số

Eloquent sluggable được thiết kế để linh hoạt nhất có thể. Bạn có thể thiết lập mặc định cho tất cả các models và sau đó ghi đè các thiết lập này trong các models riêng biệt.

Mặc định các tham số được thiết lập trong file app/config/sluggable.php. Nếu bất kỳ 1 tham số không được thiết lập thì giá trị mặc định của package từ vendor/cviebrock/eloquent-sluggable/resources/config/sluggable.php sẽ được sử dụng. Dưới đây là ví dụ về các tham số và giá trị mặc định.

return [
    'source'          => null,
    'maxLength'       => null,
    'method'          => null,
    'separator'       => '-',
    'unique'          => true,
    'uniqueSuffix'    => null,
    'includeTrashed'  => false,
    'reserved'        => null,
];

Trong các models riêng biệt, các tham số cấu hình được xử lý trong phương thức sluggable(). Tại đây bạn có thể thiết lập các cấu hình cho cho các trường nơi lưu giữ các giá trị slug thông qua các key của mảng.

public function sluggable()
{
    return [
        'title-slug' => [
            'source' => 'title'
        ],
        'author-slug' => [
            'source' => ['author.firstname', 'author.lastname']
        ],
    ];
}

1. source

  • Đây là 1 trường hoặc 1 mảng các trường để xây dựng nên slug. Mỗi $model->field được nối với nhau bởi khoảng trắng để xây dựng 1 chuỗi slug.
  • Nó có thể là thuộc tính của model(trường trong database), thuộc tính quan hệ, hoặc 1 custom getters.
  • Note: Để tham chiếu đến trường từ model quan hệ thì dùng dấu chấm.
class Book extends Eloquent
{
    use Sluggable;

    protected $fillable = ['title'];

    public function sluggable() {
        return [
            'slug' => [
                'source' => ['author.name', 'title']
            ]
        ];
    }

    public function author() {
        return $this->belongsTo(Author::class);
    }
}
...
class Author extends Eloquent
{
    protected $fillable = ['name'];
}
  • Ví dụ về dùng custom getter
class Person extends Eloquent
{
    use Sluggable;

    public function sluggable()
    {
        return [
            'slug' => [
                'source' => 'fullname'
            ]
        ];
    }

    public function getFullnameAttribute() {
        return $this->firstname . ' ' . $this->lastname;
    }
}

2. maxLength

  • Thiết lập giá trị là 1 số nguyên dương để đảm bảo chắc chắn rằng slug được sinh ra không vượt quá chiều dài tối đa maf bạn đã quy định trong database.

3. separator

  • Xác định việc phân tách khi xấy dựng 1 slug. Giá trị mặc định là -.

4. unique

  • Nhận giá trị kiểu boolean.
  • Dùng để tạo ra các chuỗi slug duy nhất.
  • Nếu unique được set giá trị là true (giá trị mặc định) thì với các chuỗi giống nhau thì sẽ tự động thêm vào cuối chuỗi 1 giá trị tăng dần.

5. onUpdate

  • Giá trị mặc định là false tức là khi bạn cập nhật 1 model thì giá trị của chuỗi slug không bị thay đổi.
  • Nếu muốn thiết lập lại giá trị cho các trường slug trong modle thì bạn chỉ việc set lại giá trị của các trường đấy là null hay rỗng trước khi update
$post->slug = null;
$post->update(['title' => 'My New Title']);
  • Nếu bạn muốn sinh lại tất cả các giá trị của các trường slug trong tất cả các model thì chỉ việc set lại giá trị onUpdate là tru trong file cấu hình.

6. uniqueSuffix

  • Nếu bạn không muốn sử dụng các hậu tố được sinh ra tự động bằng unique thì bạn có thể tùy biến thông qua uniqueSuffix.
'uniqueSuffix' => function ($slug, $separator, Collection $list) {
    $size = count($list);

    return chr($size + 96);
}

Hy vọng bài viết này sẽ giúp ích cho bạn.

Tài liệu tham khảo Eloquent-Sluggable