Plugin TOC (hay gọi là plugin tạo mục lục bài viết tự động), mục lục là một trong những thành phần không thể thiếu trong những website chuyên nghiệp chuẩn ux trải nghiệm người dùng, nếu bạn có mục lục bài viết google sẽ ưu ái tăng điểm seo cho bạn đặc biệt người dùng dễ dàng đọc bài viết bạn hơn và ghi nhớ tốt hơn.
Hôm nay mình sẽ chia sẻ lựa chọn plugin toc nhanh nhất và tùy biến lại nay đã nhanh lại còn nhanh hơn và chỉnh sửa chuẩn thiết kế ux.
nếu được tùy biến lại theo cách của mình hoạt động sẽ hiệu quả hơn và nhanh hơn khoảng 100ms đến 200ms, cải thiện cũng kha khá.
Trên thị trường hiện tại thì có 3 plugin tạo toc nổi bật nhất.
- fix toc (trả phí)
- Easy Table of Contents (miễn phí)
- Table Of Contents Plus (miễn phí)
Lựa chọn plugin để tùy biến
Tôi sẽ chọn Table Of Contents Plus, mình cảm thấy Table Of Contents Plus được google ưu ái index chỉ mục mục lục tốt hơn Easy Table of Contents, tuy nhiên cảm không được google index không nhanh bằng fix toc.
Fix toc là plugin trả phí tuy nhiên mình thấy css và javascript rất nhiều làm nặng website nên mình không thích cho lắm, còn là plugin trả phí nhiều anh em còn chơi null mình khuyên là không nên chơi kiểu vậy website rất dễ bị dính mã độc lắm.
Easy Table of Contents và Table Of Contents Plus là 2 plugin mình ấn tượng và khá thích nên mình đo lường còn fix toc thì thôi không phù hợp với phong cách của mình.
Table Of Contents Plus nếu được tùy biến lại theo cách của mình hoạt động sẽ hiệu quả hơn và nhanh hơn khoảng 100ms đến 200ms, đối với nhiều bạn thì thời gian cũng không đáng tuy viên với trong tăng tốc độ load website thì tích tiểu thành đại, tối ưu được 10ms cũng thấy xung sướng rồi.
Không liên quan cho lắm nhiều cao thủ seo Việt Nam vẫn yêu thích plugin Table Of Contents Plus, mình xin phép không nói tên họ và plugin này vẫn đang dẫn đầu về số lượt kích hoạt về plugin tạo mục lục.
Table Of Contents Plus ít khi được cập nhật thường xuyên chỉ cập nhật những bản quan trọng nên cũng khá ổn định so với với các plugin tạo mục lục khác, mod tùy biến thì cũng ổn áp hơn chút.
Table Of Contents Plus năm 2021 vẫn đang là lựa chọn plugin tạo mục lục tốt nhất, có tùy biến nữa thì sẽ càng yêu thương hơn.
Hướng dẫn tùy biến mod plugin tạo mục lục
Bạn cần phải tải plugin Table Of Contents Plus
#toc_container li,#toc_container ul{margin:0;padding:0}#toc_container.no_bullets li,#toc_container.no_bullets ul,#toc_container.no_bullets ul li,.toc_widget_list.no_bullets,.toc_widget_list.no_bullets li{background:0 0;list-style-type:none;list-style:none}#toc_container.have_bullets li{padding-left:12px}#toc_container ul ul{margin-left:1.5em}#toc_container{background:#f1f1f1;padding:5% 3%;width:auto;display:table;border-radius:10px;margin:5% auto}#toc_container p.toc_title{text-align:center;font-weight:700}#toc_container span.toc_toggle{font-weight:400;font-size:90%}#toc_container p.toc_title+ul.toc_list{margin-top:1em}#toc_container a:hover{text-decoration:underline}.toc_sitemap_posts_letter{font-size:1.5em;font-style:italic}span.toc_number.toc_depth_1,.toc_depth_2,.toc_depth_3,.toc_depth_4{color:#333;margin-right:5px}
Bạn hãy đưa đoạn code này vào file style.css của bạn
Bạn tiếp tục chặn css của plugin Table Of Contents Plus, không cần code gì vì Table Of Contents Plus họ tính hợp sẵn nút chặn css để cho mình dễ dàng chỉnh sửa, rất ngon
Bạn chỉ cần vào cài đặt nâng cao ( advanced) xong tích vào exclude css file ( tắt file css của họ), như hình ảnh bên dưới.
Như vậy là sử lý xong css, giờ đến sử lý jaavscript nhé.
Nếu như bạn thích chuyển cả smooth đẹp đẹp khi ấn vào link mục lục thì bạn hãy bất nó lên giống mình nhé.
Nếu như bạn không sử dụng smooth thì không cần phải làm bước dưới, nếu như bạn muốn smooth giống mình thì bạn có thể tối ưu như sau
add_action( 'wp_print_scripts', 'wptangtoc_dieu_kien_javascript_toc', 100 ); function wptangtoc_dieu_kien_javascript_toc() { if(! is_single()){ wp_deregister_script( 'toc-front' ); } }
Đoạn này bạn hãy cho vào file functions.php
Đoạn code này mục đích là tải điều kiện chỉ tải ở những bài post (bài viết). vì bài viết thì mới cần sử dụng nhiều đến cài này ( phù hợp với 98% của mọi người).
Nếu như bạn có nhu cầu đặc biệt thì bạn có thể tự chỉnh sửa theo nhu cầu của mình nhé.
Nếu bạn muốn xóa luôn javascript smooth front.min.js
add_action( 'wp_print_scripts', 'wptangtoc_dieu_kien_javascript_toc_xoa', 100 ); function wptangtoc_dieu_kien_javascript_toc_xoa() { wp_deregister_script( 'toc-front' ); }
Tóm tắt:
Plugin thì bạn cập nhật bình thường sẽ không có vấn đề gì xảy ra.
Khi làm xong nhớ clear cache trình duyệt đi và clear cache toàn bộ để tận hưởng thành quả nhé, nếu như bạn không biết cache trình duyệt là gì bạn có thể tham khảo bài viết: cache trình duyệt để biết thêm kiến thức khi chỉnh sửa css và javascript để tránh không bị lỗi.
Để lại một bình luận