Tạo bảng responsive trong wordpress
Tạo bảng responsive cho WordPress với plugin TablePress. Nói đến việc tạo bảng trong blog/ website WordPress, người ta không thể không nhắc tới plugin TablePress. Với gần 2 triệu lượt download và hơn 500.000 site đang active, đây là plugin tạo bảng được sử dụng nhiều nhất tính tới thời điểm hiện tại. Sở dĩ TablePress được nhiều người tin dùng như vậy là bởi vì nó dễ sử dụng, đáp ứng được các nhu cầu từ đơn giản đến phức tạp. Tuy nhiên, bảng được tạo bởi plugin TablePress có một nhược điểm là không có khả năng responsive. Tham khảo thêm:
Điều này đồng nghĩa với việc sẽ xuất hiện tình trạng tràn bảng ra khỏi giới hạn chiều ngang của giao diện khi blog/ website hiển thị trên các màn hình có kích thước nhỏ và số lượng cột trong bảng quá nhiều. Vậy làm thế nào để khắc phục tình trạng kể trên? Bài viết hôm nay sẽ hướng dẫn các bạn cách để làm điều đó. Có vẻ nhóm tác giả của TablePress cũng đã nhận ra được vấn đề này và phát triển thêm một tiện ích mở rộng mang tên Responsive Tables. 1. Tất cả những gì các bạn cần làm là download tiện ích đó tại đây, cài đặt (thông qua việc upload) và kích hoạt giống như những plugin bình thường khác. 2. Tiếp theo, mở trình soạn thảo của những trang hoặc bài viết mà bạn đã chèn shortcode của plugin TablePress trước đó. Shortcode của nó có dạng như thế này: Hãy sửa nó thành dạng: Thay mode bằng flip, scroll hoặc collapse. Trong đó:
Demo chi tiết của các mode (chế độ) này, các bạn có thể xem tại đây. Riêng với flip, các bạn còn có thể thiết lập kích thước màn hình cụ thể khi chế độ này được kích hoạt. Sử dụng cấu trúc shortcode sau đây: Thay device bằng phone, tablet, desktop, all. Trong đó:
Thật đơn giản phải không nào? Hoàn toàn không cần can thiệp gì vào mã nguồn của blog/ website cả. Chúc các bạn thành công! Bạn đang sử dụng plugin nào để tạo bảng responsive trong WordPress? Hãy chia sẻ nó với chúng tôi trong khung bình luận bên dưới. Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :) Một người con của xứ Nghệ, hiện đang sinh sống tại Hà Nội. Theo dõi tôi trên Facebook để cập nhật những tin tức mới nhất liên quan đến WordPress nhé. Reader InteractionsMột trong những phương pháp phổ biến nhất để xây dựng bảng là sử dụng HTML. Chúng có thể được mã hóa bằng tay hoặc bằng các plugin như TinyMCE Advanced hoặc các plugin tương tự. TinyMCE Advanced có thể tạo bảng HTML dễ dàng. Chỉ cần đánh dấu số cột và hàng bạn muốn và điền vào thông tin của bạn. Các bảng nhỏ, chỉ có một vài cột, thường trông đẹp trên hầu hết các thiết bị và kích thước màn hình. Tuy nhiên nhược điểm của phương pháp này là đôi khi những màn hình nhỏ như điện thoại chúng sẽ không hiển thị được hết mà phải kéo sang để xem hình ảnh cho rõ. 2. Cách tạo bảng ResponsiveSử dụng CSS:Dán mã này vào vị trí CSS của bạn:
Điều chỉnh chiều rộng tối đa (tôi đã chọn 840px) để chọn kích thước màn hình cho điểm ngắt. * Sử dụng pluginTablePress: TablePress là một trong những plugin bảng phổ biến nhất với hơn 500.000 lượt cài đặt đang hoạt động. Ngoài ra, TablePress không phản hồi. May mắn thay, có một giải pháp dễ dàng. TablePress là một trong những plugin bảng phổ biến nhất với hơn 500.000 lượt cài đặt đang hoạt động. Easy Table
Table Maker: Table Maker là một công cụ tạo bảng cho phép bạn chọn giữa việc xếp chồng các hàng hoặc cột. Các bảng được tạo riêng biệt và được đặt trong nội dung của bạn bằng cách sử dụng mã ngắn. |