1. Hiện tại có một số member mạo danh BQT để giao dịch trên diễn đàn và đã LỪA ĐẢO khá nhiều tại chuyên mục Adwords... Mọi người cảnh giác và đọc bài: Giới thiệu giao dịch đảm bảo bởi @Admin

Sử dụng Google Tag Manager để tự động tạo ra các thẻ Schema.org/JSON-LD

Thảo luận trong 'Onpage Seo - Tối ưu các yếu tố trên trang web' bắt đầu bởi thegioiseo, 21/6/16.

Lượt xem: 17,676
  1. thegioiseo

    thegioiseo Điều Hành Viên

    Gia nhập:
    22/5/11
    Bài viết:
    1,206
    Đã được thích:
    2,687
    (Thegioiseo) - Một trong những chủ đề lớn nhất từ SearchFest ở Portland vào đầu năm nay là tầm quan trọng của tìm kiếm ngữ nghĩa và cấu trúc dữ liệu - đặc biệt Schema.org. Và trong khi Schema được sử dụng để đánh dấu trang web của bạn thì định dạng JSON-LD đã tạo ra một sự thay thế tuyệt vời để thêm microdata cho một trang với minimal code.

    Ý tưởng là bạn có thể sử dụng Google Tag Manager để chèn JSON-LD vào một trang, cho phép bạn thêm đánh dấu Schema đến trang web của bạn mà không cần phải chạm vào code của trang web trực tiếp.

    Tag Manager sẽ cho phép bạn chèn một đoạn JSON-LD trên trang, nó đã không xuất hiện để có thể sử dụng các tính năng Tag Manager khác để tự động tạo ra đoạn mã đó. Tag Manager cho phép bạn tạo ra sự biến đổi bằng cách trích xuất nội dung từ trang bằng cách sử dụng bộ chọn CSS hay một số mã JavaScript cơ bản. Sau đó, các biến số này có thể được sử dụng tự động trong thẻ của bạn.

    Vì vậy nếu chúng ta muốn lấy URL và tự động đi qua nó đến snippet JSON-LD, chúng ta có thể đã cố gắng một điều gì đó như này:

    slide

    Nhưng điều đó không làm việc. Có nghĩa là nếu bạn muốn sử dụng GTM để thêm loại BlogPosting Schema vào mỗi bài viết trên blog của bạn, bạn sẽ phải tạo ra một thẻ khác và kích hoạt (dựa trên URL) cho mỗi bài viết.

    Nhưng với một thử nghiệm, tôi đã tìm ra phép thuật để làm cho JavaScript có thể trích xuất dữ liệu từ các nội dung hiện có trên trang web và tự động tạo ra một snippet JSON-LD hợp lệ.

    Tự động tạo ra JSON-LD

    Lý do tại sao ví dụ đầu tiên của chúng tôi không làm việc là vì Tag Manager thay thế mỗi một biến với một phần nhỏ của JavaScript để gọi một hàm - trả về giá trị của biến được gọi. Chúng ta có thể thấy lỗi này trong Google Structured Data Testing Tool:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema

    Lỗi này là kết quả khi Tag Manager chèn JavaScript vào một thẻ JSON - điều này là không hợp lệ và vì vậy các thẻ bị lỗi. Tuy nhiên, chúng ta có thể sử dụng Tag Manager để chèn một thẻ JavaScript.
    Su dung Google Tag Manager de tu dong tao ra cac the Schema 2
    Nếu bạn không quen với JavaScript, điều này có thể khá phức tạp nhưng nó hoạt động một cách chính xác giống như nhiều thẻ khác mà bạn có thể đã sử dụng (như Google Analytics hoặc Tag Manager).

    Ở đây, dữ liệu Schema được chứa trong đối tượng "data" JavaScript mà chúng ta có thể tự động di chuyển với các biến từ Tag Manager. Sau đó, snippet tạo ra một thẻ script trên trang với loại (application/ld+json) và thao tác trên thẻ với dữ liệu của chúng tôi, chúng tôi chuyển sang JSON bằng cách sử dụng chức năng JSON.stringify.

    Mục đích của ví dụ này chỉ đơn giản là để chứng minh kịch bản này làm việc như thế nào. Vì vậy, chúng ta hãy xem nó được sử dụng trong thế giới thực như thế nào.

    Tự động tạo ra thẻ Schema.org với các bài viết

    Bắt đầu với một mẫu Schema hợp lệ. Đầu tiên, xây dựng một snippet JSON/LD hoàn thiện với một bài duy nhất dựa trên các đặc điểm kỹ thuật schema.org/BlogPosting.

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 3

    Xác định các biến động cần thiết

    Có một biến sẽ giống nhau giữa các bài viết, ví dụ như thông tin nhà xuất bản. Tương tự như vậy, hình ảnh chính cho mỗi bài viết có kích thước cụ thể được tạo ra bởi WordPress sẽ luôn luôn giống nhau giữa các bài viết, vì vậy chúng tôi có thể giữ cho chiều cao và chiều rộng của biến.

    Trong trường hợp của chúng tôi, chúng tôi đã xác định được 7 biến thay đổi giữa các bài viết mà chúng tôi muốn di chuyển:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 4

    Tạo các biến trong Google Tag Manager

    - ID Entity chính: URL page

    - Headline: Chúng tôi sẽ làm cho nó trở nên đơn giản và sử dụng tiêu đề trang

    - Date Published và Modified: Blog của chúng tôi là trên WordPress, vì vậy chúng tôi đã có thẻ meta cho "article:published_time" và "article:modified_time". Modified_time thường không được tính (trừ khi bài viết được sửa đổi sau khi xuất bản), nhưng Schema khuyến cáo nên đưa nó vào, vì vậy chúng tôi phải thiết lập dateModified vào published date nếu nó không có một modified date. Trong một số trường hợp, chúng tôi có thể cần phải định dạng lại ngày - rất may là, trong trường hợp này, nó đã có định dạng ISO 860, điều này là rất tốt.

    - Author Name: Trong một số trường hợp chúng tôi sẽ cần phải trích xuất nội dung từ trang này. Blog của chúng tôi liệt kê author và published date.
    Su dung Google Tag Manager de tu dong tao ra cac the Schema 5
    - Article Image: Blog của chúng tôi đã cài đặt Yoast, trong đó đã xác định hình ảnh trên Twitter và Open Graph.

    - Article Description: Chúng tôi sẽ sử dụng meta description

    Đây là kịch bản chèn của chúng tôi, một lần nữa, chúng tôi sẽ sử dụng trong thẻ của chúng tôi, thời gian này với các tính chất hoán đổi cho các biến, chúng tôi sẽ cần phải tạo ra:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 6

    Rút những giá trị meta

    Rất may là, Tag Manager làm cho việc rút những giá trị từ phần tử DOM thực sự dễ dàng - đặc biệt là bởi vì, với các thuộc tính meta, giá trị chính xác chúng tôi cần sẽ ở trong các thuộc tính của phần tử. Để trích xuất tiêu đề trang, chúng tôi có thể nhận được giá trị của thẻ <title>. Chúng tôi không cần phải chỉ định một tên thuộc tính cho điều này:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 7

    Với thuộc tính meta, chúng tôi có thể trích xuất giá trị từ thuộc tính nội dung:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 8

    Tag Manager cũng có một vài biến tích hợp hữu ích mà chúng ta có thể tận dụng - trong trường hợp này là Page URL:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 9

    Xử lý các phần tử trang

    Để trích xuất tên tác giả, chúng tôi sẽ cần phải sử dụng một số tùy chỉnh JavaScript để lấy văn bản mà chúng tôi muốn và bóc tách 3 ký tự cuối cùng (" | ") để nhận được tên tác giả.

    Trong trường hợp có một vấn đề với selector này, tôi cũng đã đưa vào một dự phòng (chỉ tên công ty của chúng tôi), để đảm bảo rằng nếu selector của chúng tôi bị lỗi giá trị trả về.

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 10

    Testing

    Tag Manager có một tính năng tuyệt vời cho phép bạn thử nghiệm trước khi triển khai chúng:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 11

    Khi chúng tôi có các biến của chúng tôi, chúng tôi có thể vào chế độ Preview và đi đến một trong các bài viết của chúng tôi:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 12

    Ở đây chúng tôi có thể kiểm tra các giá trị của tất cả các biến của chúng tôi để đảm bảo rằng các giá trị chính xác được thông qua.

    Cuối cùng, chúng tôi thiết lập thẻ của chúng tôi và cấu hình nó theo như những gì chúng tôi muốn. Trong trường hợp này, chúng tôi chỉ cần đưa các thẻ này vào bài viết blog:

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 13

    Và đây là phiên bản cuối cùng của thẻ.

    Đối với tham số dateModified của chúng tôi, chúng tôi đã thêm một vài dòng code để kiểm tra xem biến của chúng tôi có được thiết lập hay không và nếu nó chưa được thiết lập, chúng tôi sẽ đặt biến JSON-LD "dateModified" ở đây.

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 14

    Bây giờ chúng ta có thể lưu thẻ, triển khai các phiên bản hiện tại và sau đó sử dụng Google Structured Data Testing Tool để xác nhận công việc của chúng tôi:
    Su dung Google Tag Manager de tu dong tao ra cac the Schema 15
    Đây chỉ là một phiên bản đầu tiên của mã này, nó được sử dụng để kiểm tra ý tưởng chúng ta có thể sử dụng Google Tag Manager để tự động chèn thẻ JSON-LD/Schema.org. Tuy nhiên chỉ sau một vài ngày, chúng tôi đã kiểm tra với Google Search Console và nó khẳng định Schema BlogPosting đã thành công trên tất cả các bài viết blog của chúng tôi, vì vậy tôi nghĩ rằng đây là một phương pháp hữu hiệu để thực hiện với các dữ liệu có cấu trúc.

    Su dung Google Tag Manager de tu dong tao ra cac the Schema 16

    Dữ liệu có cấu trúc đang trở thành một phần quan trọng trong công việc của một SEO và với các kỹ thuật như thế này, chúng tôi có thể cải thiện đáng kể khả năng của chúng tôi để thực hiện dữ liệu có cấu trúc một cách hiệu quả và với chi phí kỹ thuật tối thiểu.

    Lưu ý rằng: Đây là một bài viết khó cần người đọc kỹ nội dung, hình ảnh... để hiểu cốt lõi vấn đề mà bài viết muốn truyền tải.

    Ghi nguồn www.thegioiseo.com khi đăng tải lại bài viết này.
    Bài viết có tham khảo và sử dụng nội dung từ Moz.
    Link: Sử dụng Google Tag Manager để tự động tạo ra các thẻ Schema.org/JSON-LD.

    Last edited by a moderator: 21/6/16
    taizalovn thích bài này.
  2. Vinaseo.edu.vn

    Vinaseo.edu.vn Top 9

    Gia nhập:
    8/6/16
    Bài viết:
    42
    Đã được thích:
    8
    Em thường vào thẳng trang Schema.org luôn. Trong đó có cái document hướng dẫn chi tiết chỉ cần thay đổi 1 số cái theo mẫu định dạng là ok rồi à :D
  3. nguyenhuutinh1992

    nguyenhuutinh1992 Top 7

    Gia nhập:
    26/9/13
    Bài viết:
    1,778
    Đã được thích:
    165
    Web:
    Bên em xây dựng site mới dùng thể Tag để gom lại những nhóm sản phẩm cùng chủ đề, cùng công dụng để seo một lượt nhiều sp luôn, nhưng mà làm thẻ Tag này bằng tay chứ không dùng tự động, em nghĩ nếu tự động thì khó có thể kiểm soát và kiểm tra được hiệu quả.
  4. vantuan88291

    vantuan88291 Top 9

    Gia nhập:
    25/8/13
    Bài viết:
    295
    Đã được thích:
    14
    Web:
    cái này có lợi gì trong seo ko vậy ae
  5. gamehayst

    gamehayst Top 9

    Gia nhập:
    19/3/13
    Bài viết:
    461
    Đã được thích:
    24
    Nơi ở:
    Hà Nội
    Web:
    Cái này hơi khó đấy, vì đơn giản SEOer khó biết nhiều như thế này về code lắm. Có lẽ sẽ nhờ bên kĩ thuật sẽ tốt hơn nhiều đấy
  6. tiwenger

    tiwenger Top 9

    Gia nhập:
    19/5/14
    Bài viết:
    210
    Đã được thích:
    8
    Nơi ở:
    http://khudothikingbay.vn/
    Web:
    phải nghiên cứu thêm các bác ah.
  7. epcocbetongpro

    epcocbetongpro Top 10

    Gia nhập:
    27/11/15
    Bài viết:
    25
    Đã được thích:
    1
    Nơi ở:
    Cầu giấy hà nội
    Web:
    nhìn loàng ngoàng quá , khó hiểu ghê luông, có bạn nào giải thích chi tiết được chứ
  8. thienlyma90

    thienlyma90 Top 7

    Gia nhập:
    7/6/13
    Bài viết:
    1,329
    Đã được thích:
    86
    Nơi ở:
    HN
    Web:
    Nếu dùng tay được như bạn thì tốt nhất. Còn nếu quá nhiều thì nên tự động hóa sẽ là điều lựa chọn chính xác!
  9. linhsq

    linhsq Top 9

    Gia nhập:
    29/2/16
    Bài viết:
    277
    Đã được thích:
    13
    Nơi ở:
    Hà Nội
    Web:
    Cái này liên quan đến code nhiều quá, đối với seoer thì rất khó để thực hiện cái này. Nếu là trang sản phẩm lớn thì nên bảo bộ phận code thêm vào cho dễ quản lí.
  10. Duchaiplus

    Duchaiplus Top 9

    Gia nhập:
    22/6/16
    Bài viết:
    69
    Đã được thích:
    11
    Nơi ở:
    https://www.modmienphi.com
    Loàng ngoàng quá, đối vs nhũng site nhỏ thì vấn đề này không quá quan trọng. Theo mình là như vậy
  11. thienbao

    thienbao Top 9

    Gia nhập:
    24/8/15
    Bài viết:
    444
    Đã được thích:
    14
    code là thua rồi, cái này chắc chỉ có pro mới hiểu được thôi :(
  12. blogbaomoi88

    blogbaomoi88 Seo Newbie

    Gia nhập:
    27/6/16
    Bài viết:
    1
    Đã được thích:
    0
    Web:
    Đang tìm hiểu về cái tag manager này. Mới dùng cho GA còn chưa thử JSON-LD. Thanks thớt, ngâm cứu phát :D
  13. phuongnguyen1707

    phuongnguyen1707 Top 9

    Gia nhập:
    16/12/15
    Bài viết:
    41
    Đã được thích:
    0
    Web:
  14. tienguyen28

    tienguyen28 Top 9

    Gia nhập:
    23/4/15
    Bài viết:
    92
    Đã được thích:
    2
    Web:
    đoc xong bài này mình chả hiểu gì luôn @@
  15. simon285

    simon285 Top 9

    Gia nhập:
    10/3/16
    Bài viết:
    60
    Đã được thích:
    6
    Web:
    sao em cứ thấy khó hiểu thế nào ý nhỉ @@
  16. Tien Viet

    Tien Viet Top 9

    Gia nhập:
    25/7/16
    Bài viết:
    134
    Đã được thích:
    12
    Web:
    em làm nó bị lỗi này là thế nào mấy bác "Có loại không hợp lệ trong JSON-LD của bạn."
  17. tuanti886

    tuanti886 Top 9

    Gia nhập:
    8/7/16
    Bài viết:
    95
    Đã được thích:
    11
    Đang nghiên cứu cái Dynamic remaketing bằng GTM mà thấy loằng ngoằng quá bác nói rành cái này có tài liệu nào dễ hiểu chút không share mình với.

Nội quy khi thảo luận:

Dù bạn có cố tình spam bằng cách nào khi BQT diễn đàn phát hiện sẽ lập tức banned nick và xoá toàn bộ bài viết của bạn. Ngoài ra khi phát hiện ra Spam hãy gửi thông báo cho BQT diễn đàn. Hãy suy nghĩ trước khi hành động..!
✓ Khi muốn trả lời ai đó, bạn gõ @ cộng thêm nick diễn đàn của người đó phía sau @, giống như tag tên trên Facebook.
✓ Yêu cầu khi bình luận, bạn phải gõ chữ rõ ràng, không viết tắt, gõ tiếng Việt đầy đủ dấu câu.
✓ Nên dùng font chữ mặc định của diễn đàn, không tô màu lòe loẹt hay dùng size chữ quá lớn khi bình luận.
✓ Bài viết, comment... không được phép quảng cáo dịch vụ, rao vặt, pr... Loại trừ ở chuyên mục Rao vặt đã cho phép.
✓ Nghiêm cấm các chủ đề dạng: Cứu em với, help me, giật tít, câu view... dưới mọi hình thức.
✓ Tất cả các thành viên tham gia diễn đàn cần đọc kỹ Nội quy chung và nghiêm túc tuân thủ.


Chia sẻ trang này

Đang tải...