Cách tạo và chèn Bảng vào WordPress (04/2019)

Cập nhật: 18/06/2019

WordPress 4.x cung cấp rất nhiều tính năng khi viết bài, tuy nhiên vẫn bị hạn chế một số. Trong đó phải nhắc đến việc chèn hoặc tạo bảng.

Từ WordPress 5.0 trở đi, bảng đã được thêm vào trở thành tính năng mặc định, mà không cần xài thêm Plugin.

Cách 1. Tạo bảng trong WordPress 4.x

Bước 1. Cài đặt và kích hoạt Plugin TablePress

TablePress là plugin tạo bảng trong WordPress với hơn 700 nghìn lượt cài đặt, có thể nói là plugin tạo bảng được sử dụng nhiều nhất tới thời điểm hiện tại.

Hướng dẫn cài đặt Plugin cho WordPress

plugin-tablepress

Bước 2. Tạo bảng

Vào trang quản lý WordPress –> TablePress –> Add New Table

  • Table Name: Tên bảng, có dấu hay không dấu đều được
  • Description: Mô tả bảng, không bắt buộc điền
  • Number of Rows: Số hàng
  • Number of Columns: Số cột

Rồi chọn Add Table

chen-bang-wordpress-1-min

Bước 3. Viết nội dung cho bảng

Sau khi nhấn Add Table, một trang mới sẽ hiện ra với rất nhiều tùy chọn:

chen-bang-wordpress-2-min

0. Preview: Xem trước – Save Changes: Lưu thay đổi

1.Table Information

  • Table ID: Điền gì cũng được.
  • Shortcode: Đoạn mã dùng để chèn vào bài viết hoặc trang. Chỉ cần chèn đoạn mã này, bảng sẽ được hiển thị. Lưu ý shortcode đi liền với Table ID. Nếu Table ID thay đổi, thì toàn bộ bảng đã chèn với shortcode trước đó sẽ bị mất.
  • Table Name và Description: Đã thực hiện ở Bước 2

2.Table Content

Đây chính là nội dung của từng ô trong bảng. Bạn điền vào theo ý muốn nhé.

3. Table Manipulation

Đặt con trỏ chuột tại ô bất kỳ ở Table Content, sau đó chọn:

  • Insert Link: Nếu bạn muốn chèn liên kết. Hoặc bôi đen đoạn chữ muốn chèn link rồi chọn Insert Link nhé
  • Insert Image: chèn hình ảnh
  • Advanced Editor: Bật trình soạn thảo với nhiều chức năng hơn
  • Selected Rows: Đánh dấu vào ô vuông nhỏ ở Table Content rồi nhấn Hide, nếu muốn ẩn HÀNG đó. Nhấn DUPLICATE nếu muốn nhân đôi. INSERT nếu muốn chèn thêm một hàng. Hoặc DELETE nếu muốn xóa.
  • Selected Columns: Tương tự Selected Rows, nhưng là thực hiện với CỘT
  • Add (1) row (s)/Add (1) column(s): Thêm vào hàng/cột. Gõ số bất kỳ rồi nhấn Add, nó sẽ thêm 1 hàng/cột ở cuối bảng.
  • Combine cells: Bấm vào dấu chấm hỏi bên phải, sẽ có hướng dẫn

4. Table Options

  • Table Head/Foot Rows: Hàng nào được thiết lập là Head/Foot thì sẽ có màu sắc khác biệt so với hàng khác
  • Alternating Row Colors: Chịu 😀
  • Row Hover Highlighting: Màu sắc của hàng khi di chuột đến
  • Print Table Name/Table Description: Tên/Mô tả của bảng sẽ hiển thị bên trên (above) hoặc dưới (below) bảng
  • Extra CSS Classes: Điền tên Class CSS. Tên Class thôi, không điền CSS trực tiếp vào đây

chen-bang-wordpress-3-min

Đó là các tùy chọn cơ bản nhất khi tạo bảng trong WordPress với TablePress. Cuối cùng chọn Save Changes.

Bước 4. Chèn bảng vào bài viết hoặc trang

Mở bài viết, và bấm vào biểu tượng như hình:chen-bang-wordpress-1

Bấm vào Insert Shortcode

chen-bang-wordpress-4-min

Và lưu lại bài viết rồi xem kết quả thôi.

chen-bang-wordpress-5-min

Hoặc đơn giản hơn, chỉ cần sao chép Shortcode đã có ở BƯỚC 3 rồi dán vào vị trí cần chèn bảng trong bài viết hoặc trang thôi.

chen-bang-wordpress-6-min

Cách 2. Tạo bảng trong WordPress 5.x

Mở bài viết cần tạo bảng. Bấm vào biểu tượng dấu cộng (góc trên bên trái) > Gõ bảng > Bấm vào Bảng

Nhập số cộtsố hàng cho bảng rồi bấm Tạo

Bảng sẽ được tạo

Điền nội dung cho bảng thôi. Độ rộng từng cột sẽ ăn theo nội dung của từng cột. Nếu nội dung dài thì độ rộng dài, và ngược lại.

Nếu bạn muốn các cột có độ rộng như nhau, nhìn bên phải và bấm Cố định chiều dài ô

Nếu bạn muốn tạo màu sắc cho các ô như này, thì bấm vào Phong cách hiển thị > Stripes

Xong. Lưu lại bảng thôi!

Để chèn thêm cột vào bảng, hoặc chèn thêm hàng vào bản. Bạn chỉ cần đặt con chuột tại một ô bất kỳ và chọn như ảnh.

wp-5x-tao-bang7-min

Để chèn liên kết, bôi đậm, in nghiêng cho chữ trong bảng. Bạn chỉ cần bôi đen, sau đó làm như hình.

wp-5x-tao-bang8-min

Để căn lề cho bảng, tức là cho bảng vào giữa, qua phải, sang trái…. chỉ cần bấm vào như hình

wp-5x-tao-bang9-min