Thursday, February 25, 2021

Cách thêm bảng trong bài đăng trên Blogger

 Nhiều khi bạn viết một bài cho blog của mình, bạn cần phải chèn một bảng trên bài đăng của mình để hiển thị nội dung hiệu quả hơn. Trong WordPress, có nhiều plugin có thể tạo bảng chỉ trong vài cú nhấp chuột. Nhưng nếu blog của bạn được lưu trữ trên Blogger (Blogspot) thì không có sẵn plugin bên ngoài để tạo bảng cho bài đăng của bạn.

Vì vậy, trong bài đăng này, tôi sẽ chia sẻ với bạn hai phương pháp hữu ích nhất để chèn bảng trên bài đăng blog Blogger của bạn.

Cách thêm bảng trong bài đăng trên Blogger

Cách thêm Bảng trong Blogger (Blogspot)

Dưới đây, tôi đã chia sẻ hai phương pháp khả thi mà qua đó bạn có thể dễ dàng tạo và chèn bảng trong bài đăng blog của mình được lưu trữ trên Blogger (Blogspot).

Phương pháp 1

Nếu bạn có một chút kiến thức về HTML và CSS thì bạn có thể dễ dàng tạo một bảng cho bài viết trên blogger của mình. Nhưng nếu bạn không biết cách viết mã HTML và CSS cho một bảng thì có một giải pháp cho bạn. Trong bài đăng này, tôi sẽ trình bày cách bạn có thể viết mã bảng cho bài đăng trên Blogger của mình và cách chèn mã vào bài đăng.

Mã HTML đơn giản cho bảng

<table>

 <style>

 table {width:100%}

 table,th,td {border: 1px solid black;}

th,td{text-align:center;}

 </style>

<tr>

<th> A</th>

<th> B </th>

<th> C </th>

<th> D </th>

</tr>

<td> 001</td>

<td> 002</td>

<td> 003</td>

<td> 004</td>

</tr>

</table>

Cách chèn mã HTML vào bài đăng

Sao chép tất cả các mã được đưa ra ở trên, sau đó mở bảng điều khiển Blogger, sau đó Đăng> Tất cả, sau đó nhấp vào Chỉnh sửa bài đăng mà bạn muốn chèn Bảng.

Chọn HTML ở góc trên cùng bên trái. Bây giờ, giả sử bạn muốn chèn bảng sau văn bản được đánh dấu hiển thị trong ảnh chụp màn hình, sau đó dán mã bảng HTML giữa các thẻ <br/> đầu tiên. (Xem ảnh chụp màn hình thứ 2)


Giờ đây, bạn có thể thay đổi văn bản tiêu đề A, B, C, D và cả dữ liệu của riêng bạn. Sau tất cả, bạn đã tạo một bảng cho bài đăng trên Blogger của mình. Bảng của bạn sẽ được hiển thị như
Table Color
Nếu bạn muốn thay đổi màu nền tiêu đề của bảng thì bạn phải chèn mã CSS này vào giữa thẻ <style> và </style>.
th{background-color: #4CAF50; color:Black;}

Hoverable Table

Nếu bạn muốn đánh dấu các hàng trong bảng khi di chuột qua thì bạn phải chèn mã CSS này vào giữa thẻ <style> và </style>

tr: hover {background-color: # f5f5f5;}

Striped Table

Nếu bạn muốn sử dụng sọc ngựa vằn trên các hàng chẵn (hoặc lẻ) của bảng thì bạn phải chèn mã CSS này vào giữa thẻ <style> và </style>

tr: nth-child (even) {background-color: # f2f2f2;} 

Phương pháp 2

Bạn cũng có thể chèn một bảng dưới dạng hình ảnh vào bài đăng trên Blogger của mình mà không cần viết dòng mã. Đối với điều này trước tiên, bạn phải tạo một bảng trên Microsoft PowerPoint và lưu nó dưới dạng định dạng hình ảnh, sau đó tải hình ảnh này lên máy chủ Blogger.

1. Mở bất kỳ phiên bản PowerPoint nào có bản trình bày trống

2. Nhấp vào CHÈN> Bảng, sau đó chọn các ô theo nhu cầu của bảng của bạn 

No comments:

Post a Comment