Cập nhật thông tin chi tiết về Hướng Dẫn Tạo Bảng Chuyên Nghiệp Trong WordPress Với Plugin Tablepress mới nhất trên website Bothankankanhatban.com. Hy vọng nội dung bài viết sẽ đáp ứng được nhu cầu của bạn, chúng tôi sẽ thường xuyên cập nhật mới nội dung để bạn nhận được thông tin nhanh chóng và chính xác nhất.
Chào các bạn, mình thấy rất nhiều bạn đang lúng túng không biết tạo bảng trong WordPress. Chủ đề này rất cần cho mọi người nên mình đóng góp bài viết tạo bảng này tại NgocDenRoi.com
Bạn đang gặp khó khăn với việc tạo bảng trong WordPres? Trong bài viết này, chia sẻ với bạn một cách mà bất kỳ bạn nào cũng làm được. Đó là tạo bảng bằng plugin TablePress.
Trong tất cả những plugin tạo bảng miễn phí, TablePress là ứng cử viên sáng giá nhất.
TablePress cung cấp cho bạn khả năng tạo bạn một cách dễ dàng và chuyên nghiệp. Tuyệt vời hơn, plugin này hoàn toàn miễn phí. TablePress tích hợp khả năng tạo bảng và những hiệu ứng có sẵn rất tuyệt. Bạn có thể chèn chữ (text) và chèn nút (button)… Đặc biệt, nếu bạn biết thêm chút CSS thì mọi tuỳ biến trở nên linh hoạt và bắt mắt với bảng.
Không nói nhiều nữa, vào ngay vấn đề chính trong bài viết này.
Bước 1: Tìm và kích hoạt plugin
Tìm với từ khoá “tablepress” trong ô keyword. Bạn chọn plugin “TablePress” được đánh dấu ngay bên dưới. Tiến hành cài đặt và kích hoạt plugin.
Có ích cho bạn: Hướng dẫn cài đặt plugin cho WordPress với 3 cách!
Bước 2: Thêm bảng
Lưu ý: Plugin này cho phép bạn Import và Export dữ liệu từ một bảng đã tạo. Giúp bạn giảm bớt thời gian và công sức cấu hình bảng cho những bảng tương tự nội dung.
Bước 3: Cấu hình bảng
Trong đó:
Table Name: Tên bảng. Giúp bạn phân biệt các bảng đã tạo (Phần này không hiển thị trong bảng).
Description (optional): Mô tả về bảng (Phần này không hiển thị trong bảng).
Number of Rows: Số hàng hiển thị trong bảng.
Number of Columns: Số cột hiển thị trong bảng.
Bước 4: Thêm thông tin cho bảng
Có 2 cách thêm thông tin cho bảng.
Trong ví dụ này, mình demo bảng thông tin người nhận quà tặng Beginer Miễn Phí từ vothanhdien.com.
Gồm 5 cột và 5 hàng.
Bạn hoàn toàn có thể thêm cột hoặc hàng bất kỳ từ bước này mà không cần phải tạo bảng và thay số hàng, số cột như lúc ban đầu.
Bước 5: Thêm bảng vào trong bài viết.
Bạn để ý trong phần “Table Information”, copy shortcode “[table id=2 /]”.
Tạo một bài post mới. Sau đó paste shortcode đã copy bên trên vào trong bài viết, nơi mà bạn muốn hiển thị bảng.
Publish bài viết và thưởng thức thành quả đạt được.
Đây là thành quả đạt được sau khi đã làm quần quật 😀 Đùa vậy thôi, chỉ qua vài bước đơn giản, bất kỳ bạn nào cũng làm được phải không nào. Với những hiệu ứng được cung cấp sẵn, bạn hoàn toàn tạo được bảng chuyển nghiệp và khoa học. Nếu bạn không đòi hỏi cao về bảng thì như vậy bạn đã tạo được bảng thành công.
Bước 6: Tuỳ biến bảng bằng CSS
Như đã đề cập bên trên, nếu bạn có chút kiến thức về CSS, việc tuỳ biến bảng trong TablPress hoàn toàn đơn giản.
Bạn truy cập vào https://tablepress.org/faq/
Để biết thêm về tuỳ biến css trong plugin này.
Hơn nữa, truy cập vào https://www.w3schools.com/ để biết code CSS về text và border…
Đây là code CSS mà mình dùng để tuỳ biến bảng cho sinh động hơn. Bạn hoàn toàn có thể tuỳ biến theo cách của riêng bạn.
Đây là thành quả đã tuỳ biến với hàng và cột.
Tất nhiên rồi, bạn hoàn toàn có thể tuỳ biến CSS text với một ô bất kỳ để làm sinh động và nổi bật thông tin cần nhấn mạnh trong đoạn text.
Đây là thành quả tuỳ biến CSS text trong một ô bất kỳ trong bảng.
Thật đơn giản phải không nào. Mình chắc chắn rằng, dù bạn không biết tý tẹo nào về CSS, qua bài viết bạn cũng tuỳ biến được bảng theo ý thích.
Có ích cho bạn: Hướng dẫn bạn tạo bảng giá trong WordPress với plugin Easy Pricing Tables.
Lời kết
Tóm lại, bạn đang cần một giản pháp tối ưu và chuyên nghiệp cho việc tạo bảng nên chọn plugin TablePress. Với TablePres cho phép bạn tạo bảng nhanh chóng và ngoài ra còn cho phép blogger tuỳ biến CSS mạnh mẽ. Đặc biệt, plugin hoàn toàn miễn phí.
Theo mình, plugin này rất đáng để dùng. Còn chần chừ gì nữa mà không thử ngay.
Hy vọng, qua bài viết giúp giải đáp vấn đề tạo bảng trong WordPress.
Bài viết được đóng góp bởi Võ Thanh Điền. Người sáng lập và biên tập chính tại chúng tôi Là giáo viên. Thích nghề sư phạm và đam mê Affiliate Marketing, viết Blog.
0
0
votes
Đánh giá bài viết
Share
Telegram
1
Shares
Hướng Dẫn Tạo Bảng Trong WordPress 1 Cách Chuyên Nghiệp
Bạn ghé qua một Blog nào đó có sử dụng bảng để thống kê hay đánh giá sản phẩm trông rất chuyên nghiệp và tự hỏi họ dùng plugin nào để tạo bảng trong WordPress?.
Hiện nay, rất nhiều plugin có chức năng tạo bảng trong WordPress nhưng theo mình đánh giá thì plugin TablePress là một plugin có chức năng tạo bảng chuyên nghiệp, cụ thể là tính đến thời điểm này số lượng người đánh giá lên tới hơn 3 nghìn và hơn 700.000 website đang activate sử dụng. Bài viết này mình sẽ hướng dẫn chi tiết cho các bạn để có một bảng thống kê chuyên nghiệp.
Tạo bảng trong WordPress với plugin TablePress
Tổng quan plugin TablePress
Bạn có thể dễ dàng tạo và quản lý các bảng một cách đơn giản.
Sử dụng Shortcode (tương tự shortcode của Contact form 7) để nhúng bảng vào bài viết hoặc một trang bất kỳ.
Bạn có thể chèn công thức, hình ảnh vào trong bảng cũng như tạo một bảng giá trong đó.
Bổ sung các tính năng như sắp xếp, phân trang, lọc và nhiều tính năng khác cho khách truy cập Blog của bạn.
Các bảng có thể được Import và Export sang nhiều định dạng như: Excel, CSV, HTML và JSON,…
Cấu hình plugin TablePress
Đầu tiên, bạn cần phải tiến hành cài đặt và kích hoạt plugin TablePress.
Sau khi kích hoạt plugin bạn sẽ thấy một menu có tên TablePress trong Dashboard như hình dưới
Trong đó:
All Tables: liệt tất cả các bảng đã được tạo ra bao gồm Id bảng, tên bảng (Table Name), miêu tả bảng (description), tác giả, ngày tạo bảng.
Add New Table: tạo một bảng thống kê mới.
Import a Table: nhập bảng từ các định dạng dữ liệu như: Excel, CSV, HTML và JSON.
Exprot a Table: xuất dữ liệu bảng ra các định dạng: Excel, CSV, HTML và JSON.
Plugin Options: tùy chọn nâng cao của plugin.
About TablePress: giới thiệu về plugin TablePress.
Khi mới cài plugin thì trong mục All Tables sẽ không có dữ liệu do mình chưa có bảng mới nào được tạo ra. Do đó, mình sẽ hướng dẫn tạo một bảng mới bằng cách kích vào Add New Table. Giao diện hiện ra như hình
Trong đó:
Table Name: tên bảng cần tạo
Description: miêu tả bảng cần tạo
Number of Rows: số lượng dòng cần tạo (bạn có thể chỉnh sửa thêm, bớt sau này nên số lượng này chỉ cần tương đối)
Number of Columns: số lượng cột cần tạo (bạn có thể chỉnh sửa thêm, bớt sau này nên số lượng này chỉ cần tương đối)
Sau khi khai báo xong các thông số trên bạn nhấn Add Table sau đó được chuyển sang trang khai báo chi tiết hoặc chỉnh sửa các thông tin trong bảng bao gồm các Tab:
Table Information: bạn có thể sửa đổi tên bảng, mô tả bảng, Id bảng (cần kiểm tra các Id bảng khác tránh trường hợp bị ghi đè các Id bảng đã tạo)
Table Content: nhập các giá trị cần thiết
Table Manipulation: chỉnh sửa việc thêm, bớt, ẩn, xóa, chèn ảnh, chèn link…hàng, cột trong bảng
Table Options: tùy chọn hiển thị của bảng
Features of the DataTables JavaScript library: tùy chỉnh cấu hình cho người dùng
Freview & Save changes: xem trước bảng vừa tạo để chỉnh sửa cho phù hợp sau đó lưu lại
Other Actions: tùy chọn việc sao chép, nhập và xóa dữ liệu bảng
Mục Table Content: Đây là nơi bạn cần nhập các giá trị hay thông số vào trong bảng. Tuy nhiên, nếu bạn biết thêm về code thì có thể tùy biến thay đổi kích thước chữ, độ đậm nhạt hoặc thay đổi màu sắc cho font chữ như ví dụ hình dưới.
Mục Table Manipulation: Bạn có thể tùy chỉnh việc thêm, xóa, gộp ô, ẩn, chèn link, chèn ảnh vào bên trong hàng, cột hoặc có thể chèn mã giảm giá coupon thông qua Advanced Editor.
Trường hợp bạn muốn thêm 1 hàng vào giữa 2 hàng khác (vd: bạn có dòng 1,2,3,4 và muốn chèn 1 hàng vào giữa hàng 2 và hàng 3) thì bạn có thể vào insert trong select rows hoặc add một hàng đó. Nếu nó chưa đúng vị trí bạn có thể kéo thả hàng mới đó vào giữa hàng 2 và hàng 3.
Mục Table Options: Bạn chỉ cần quan tâm tới Table Head Row: Trường hợp bảng thống kê của bạn khá dài thì bạn có thể để dấu tích theo mặc định, người đọc có thể dễ dàng tùy biến hiển thị số hàng trong một trang, sort dữ liệu có trong bảng hoặc có thể dùng chức năng tìm kiếm nhanh một giá trị có trong bảng.
Để làm được điều đó bạn kéo xuống dưới tìm đến mục Features of the DataTables JavaScript library để có thể tùy biến các giá trị.
Ngược lại, bảng thông kê không quá dài bạn nên tắt nó đi để bảng trông đẹp hơn và tất cả các mục tùy biến trong Features of the DataTables JavaScript library sẽ bị mờ đi. Kết quả là trông bảng sẽ đẹp hơn.
Tùy chỉnh nâng cao plugin TablePress
Nếu bạn chưa biết gì về CSS thì có thể vào trang hướng dẫn viết mã CSS cơ bản của tác giả thông qua FAQ. Tuy nhiên, mình cũng hướng dẫn cụ thể cho các bạn để tạo bảng trong WordPress cho Blog mình.
Thay đổi độ rộng của bảng:
.tablepress { width: auto; }Trong đó: giá trị ” width: auto;” bạn có thể đặt auto để bảng có thể hiển thị tốt trên mọi loại thiết bị hoặc bất kỳ kích thước nào đó chẳng hạn ” width: 720px; “.
Lưu ý: giá trị độ rộng bảng ” width: auto; “là thông số chung cho tất cả các bảng của bạn.
Thay đổi màu nền cho hàng đầu tiên của bảng:
.tablepress thead th, .tablepress tfoot th { background-color: greenyellow; }Trong đó: bạn cần thay đổi giá trị màu trong background-color tùy ý. Ví dụ mình sử dụng mã màu “background-color: greenyellow;” (mình đặt giá trị là ” greenyellow ” còn bạn có thể thay bằng một mã hex bất kỳ như “#01c1a8” chẳng hạn).
Kết quả: Thay đổi màu nền của một hàng bất kỳ:
.tablepress-id-N .row-X td { background-color: #9bcd04; }Trong đó: N là Id của bảng cần thay đổi, X là hàng cần thay đổi màu nền, giá trị “#9bcd04 ” là mã màu tùy chọn của bạn.
Lưu ý: Khi bạn có nhiều bảng mà mỗi bảng bạn lại muốn tạo một màu nền cho hàng đầu tiên hoặc bất kỳ hàng nào đó mà không làm ảnh hưởng tới bất kỳ màu nền của một bảng khác ( mình khuyên bạn nên chọn phương pháp này). Bạn phải tắt tùy chọn mặc định trong ” Table Head Row ” thì thay đổi mới được thực hiện.
Trong ví dụ này mình chọn cho N=1 (Id bảng 1), X=1 (hàng đầu tiên của bảng), background-color: #9bcd04;.
Kết quả: Thay đổi font chữ, cỡ chữ và màu chữ:
.tablepress-id-N tbody td { font-family: Arial; font-size: 14px; color: #1515b5; }Trong đó: N là Id của bảng, font-family: font chữ cần thay đổi, font-size: cỡ chữ bạn tùy chỉnh, color: màu chữ bạn tùy chỉnh
Lưu ý: Bạn có thể tùy chỉnh thay đổi font chữ, cỡ chữ, màu chữ cho bất kỳ bảng nào mà không ảnh hưởng tới giá trị bảng khác
Tuy nhiên trong kết quả bên dưới do màu chữ không thay đổi là do mình đã cấu hình màu chữ trong từng cell của ” Table Content ” nên kết quả có khác so với mã CSS này còn các giá trị như font chữ, kích thước chữ đã thay đổi. Kết quả như hình:
Tạo thêm dòng kẻ phân cách giữa các hàng, cột:
Việc tạo thêm dòng kẻ phân cách giữa các hàng, cột nhìn sẽ chuyên nghiệp hơn rất nhiều so với các ví dụ bên trên mà bất cứ bảng nào bạn tạo ra sẽ cần đến.
.tablepress-id-2 .column-1 { border-style: solid; border-width: 1px; border-color: gray; } .tablepress-id-2 .column-2 { border-style: solid; border-width: 1px; border-color: gray; } .tablepress-id-2 .column-3 { border-style: solid; border-width: 1px; border-color: gray; } .tablepress-id-2 .column-4 { border-style: solid; border-width: 1px; border-color: gray; }Trong đó: N là Id của bảng, column-1 là giá trị cột thứ nhất (bạn có bao nhiêu cột thì cần thêm bấy nhiêu mã). Như ví dụ trên mình có 4 cột thì mình phải thêm 4 mã như hình trên
Kết quả trông rất đẹp như hình dưới:
Lưu ý: Plugin TablePress cũng có nhược điểm là nếu bạn sử dụng mã tùy chỉnh CSS thì khi tạo thêm mới một bảng nào đó bạn cần phải cấu hình mã CSS cho từng bảng đó. Do vậy với việc bạn sử dụng rất nhiều bảng thì danh sách mã CSS sẽ tăng theo số lượng bảng có trong Blog của bạn.
Lời kết: Vậy là bạn có thể tự tạo bảng trong WordPress cho Blog của mình rồi. Thật đơn giản phải không nào?. Hy vọng bạn có thể tùy biến bảng thống kê theo cách riêng của mình.
Hướng Dẫn Tạo Blog Với WordPress
Lời mở đầu:
Tôi là người dốt computer vì đã lớn tuổi, không có điều kiện để học “tử tế” từ đầu, nghĩa là “mất căn bản”. Những gì tôi biết là tôi tự tìm tòi, quá lắm thì hỏi “đệ tử”.
Làm 1 blog với wordpres cũng vậy. Tôi đọc tiếng Việt ở cộng đồng WordPress Việt Nam, muốn đâu cái điền ( điên cái đầu) vì bọn trẻ viết cho người khá giỏi computer chứ không phải cho người ngu như tôi.
Ráng dụ dỗ mình cứ đọc đi, đến bài 5 sẽ vỡ cái ngu của bài 1, thì tôi cũng qua cầu đoạn trường! Sau đó, tôi mò mẫm và tự làm. Cuối cùng blog hoàn thành. Mỗi ngày tôi mỗi tự tìm thêm những cái mới ( tôi hay nói là Mò) qua Help ( khi đã hiểu sơ sơ thì xem hay đọc Help rất hữu ích.).
Đến nay, tôi có thể tạo một blog với wordpress khá nhanh.
Vài vị đọc bài ” Dốt computer và học computer ” đã mail hỏi tôi cách làm blog với wordpress.
Dựa trên kinh nghiệm bản thân, viết lại cho cao niên, như tôi, nghĩa là những người không được học về database, về HTML…Tóm lại, chỉ nhắm mắt làm mà thôi, tôi viết loạt bài hướng dẫn này. Vị nào giỏi rồi, làm ơn đi chỗ khác chơi nghe. Tôi viết “chùa” là để giúp cao niên dốt như tôi mà thôi.
Tất nhiên tôi cũng không viết bài hướng dẫn tạo blog với wordpress dành cho cao niên quá i tờ rít. Cao niên, chớ cũng phải biết những cái tối thiểu về window, winword, lướt net, sử dụng mail thành thạo.
Quan trọng: hình chụp minh hoạ cho bài viết, tôi dùng Fire Fox. Ai muốn học, yêu cầu dùng giống tôi. Dùng browser khác, thấy khác rồi la làng là không thấy thì coi chừng bị ăn hèo! Tui “ghét” mấy vị cao niên hay la lên là sao tui hong giống bà?! Làm sao mà giống được? Ông cao niên …thì già, xấu, còn tui là bà cao niên, nhưng chưa già lắm, chưa xấu lắm!! Đùa thôi, tại mấy ông dùng Internet Explorer hay Google Chrome thì có khi nó hiện ra hong giống cái của tui ( Fire Fox)
Sau nữa, bài quan trọng nhất là 1 và 1 bis. Tui cũng “ghét” mấy ông cao niên … hay nhảy cóc, cứ muốn post bài ngay ( cho thiên hạ lé mắt văn như Siêu Quát, thơ như Bạch của mấy ông) nên không làm từng bước gì cả…
Lời khuyên: đọc sơ 13 bài. Để hiểu tổng quát, khái niệm. Gọi là bài chứ mỗi bài ngắn ngủn. Rồi đọc kỹ bài 1, 1 bis và thực tập đúng từng step. Nên in ra để coi cho đỡ mỏi mắt vì sẽ dùng đi dùng lại. Nên có 2 máy: 1 máy để làm, 1 máy chỉ để refresh trang blog của mình để xem nó thay đổi thế nào mỗi khi mình làm xong một điều gì mới.
Trong khi thực tập, trục trặc,thắc mắc thì mail cho tôi hoanglanchi@gmail.com. Nhưng tôi sẽ không trả lời nếu đã vội vã không chịu đọc hết một lượt mà đã đòi làm đó nghe.
Hướng Dẫn Cách Tạo Menu Trong Website WordPress
Cách tạo Menu trong website wordpress nằm trong series WordPress cơ bản. Giúp tự tạo menu website wordpress cơ bản và chi tiết. Sau khi đọc xong bài hướng dẫn này bạn có thể tự tạo được menu cho website của mình.
Menu là gì? Lợi ích của việc tạo menu
Menu là thanh trình đơn giúp hiển thị các liên kết của bài viết, các trang mà chúng ta cố định lên những vị trí cố định của theme, tùy vào mỗi theme khác nhau thì những vị trí của menu cũng khác nhau
Menu giúp điều hướng người dùng, khi người dùng truy cập vào website của bạn, và họ muốn đọc nội dung mà họ đang cần. Thanh menu hiển thị các chuyên mục, những liên kết giúp người dùng dễ dàng hơn trong việc tìm kiếm nội dung của họ
Việc tạo ra menu giúp cho quá trình tối ưu liên kết nội bộ trong SEO trở nên đơn giản hơn. Giúp điều hướng người dùng đến những liên kết, chuyên mục có những bài viết hay, hấp dẫn tăng thời gian onsite.
Cách tạo menu trong website WordPress
Tạo một menu mới
Sau khi tạo được Menu ta cần thêm các thành phần (category, page, link) vào để hiệu chỉnh.
Đối với Trang, Chuyên mục, Bài viết thì ta chỉ cần chọn liên kết muốn hiển thị bằng cách đánh dấu vào hộp chọn sau đó nhấn Thêm vào Menu. Nếu muốn hiển thị tất cả hãy chọn tab Xem tất cả. Nếu muốn tìm kiếm ta chọn tab Tìm kiếm
Sau đó nhấn Lưu Menu
Sau khi ta đã thêm các thành phần vào menu, ta sắp xếp lại vị trí cho phù hợp. Nhấn vào thành phần cần sắp xếp giữ chuột rồi kéo thả.
Chọn vị trí cho menu
Đây là bước chọn vị trí cho menu, số lượng vị trí tùy thuộc vào mỗi theme ví dụ theme của mình có: Primary Location, Secondary Location.
Xóa menu
Nếu bạn muốn thay đổi menu hoặc quá trình tạo menu bạn thấy không vừa ý thì có thể xóa bỏ bằng cách nhấn vào Xóa menu. Sau đó có một thông báo hiện lên bạn hãy nhấn OK là xong.
Bài viết nên xem: Cách sử dụng widget trong website wordpress
Bạn đang xem bài viết Hướng Dẫn Tạo Bảng Chuyên Nghiệp Trong WordPress Với Plugin Tablepress trên website Bothankankanhatban.com. Hy vọng những thông tin mà chúng tôi đã chia sẻ là hữu ích với bạn. Nếu nội dung hay, ý nghĩa bạn hãy chia sẻ với bạn bè của mình và luôn theo dõi, ủng hộ chúng tôi để cập nhật những thông tin mới nhất. Chúc bạn một ngày tốt lành!