Top code tùy chỉnh trang web WordPress của bạn

Code Snippets là gì?

Code Snippets là các đoạn mã nhỏ có thể dễ dàng tích hợp vào một trang web hoặc ứng dụng. Chúng cho phép thêm chức năng hoặc sửa đổi các tính năng hiện có một cách dễ dàng.

Các đoạn mã đóng một vai trò quan trọng trong quá trình phát triển, từ việc tùy chỉnh giao diện của trang web đến việc thêm các tính năng mới không có trong cài đặt mặc định.

Trong WordPress, các đoạn mã có thể được thêm bằng plugin hoặc chỉnh sửa tập tin functions.php của chủ đề (theme). Điều này cung cấp cho các nhà phát triển nhiều tùy chọn để tùy chỉnh trang web của họ. Bằng cách sử dụng các đoạn mã, nhà phát triển có thể nhanh chóng và dễ dàng thêm chức năng mới vào trang web của họ mà không cần viết mã phức tạp từ đầu.

7 ví dụ về đoạn mã hữu ích

Đoạn mã có thể được sử dụng theo nhiều cách. Dưới đây là một số ví dụ.

Bảo vệ trang web của bạn khỏi các cuộc tấn công

Thêm mã này vào tệp tin functions.php của bạn để từ chối các yêu cầu URL độc hại từ hacker:

global $user_ID; if($user_ID) {
if(!current_user_can('administrator')) {
if (strlen($_SERVER['REQUEST_URI']) > 255 ||
stripos($_SERVER['REQUEST_URI'], "eval(") ||
stripos($_SERVER['REQUEST_URI'], "CONCAT") ||
stripos($_SERVER['REQUEST_URI'], "UNION+SELECT") ||
stripos($_SERVER['REQUEST_URI'], "base64")) {
@header("HTTP/1.1 414 Request-URI Too Long");
@header("Status: 414 Request-URI Too Long");
@header("Connection: Close");
@exit;
}
}
}

Vô hiệu hóa tính năng tìm kiếm

Nếu bạn không cần tính năng tìm kiếm trên trang web WordPress của mình, bạn có thể xóa hoàn toàn tính năng này bằng đoạn mã này. Chức năng tùy chỉnh vô hiệu hóa tính năng tìm kiếm, bao gồm cả thanh tìm kiếm trong thanh bên và menu của bạn. Điều này có thể hữu ích nếu bạn có một máy chủ có thông số kỹ thuật thấp và trang web của bạn không yêu cầu tìm kiếm. Để thực hiện điều này, hãy thêm đoạn code bên dưới vào tệp tin functions.php

function vntips_filter_query( $query, $error = true ) {
if ( is_search() ) {
$query->is_search = false;
$query->query_vars[s] = false;
$query->query[s] = false;
// to error
if ( $error == true )
$query->is_404 = true;
}
}
add_action( 'parse_query', 'vntips_filter_query' );
add_filter( 'get_search_form', create_function( '$a', "return null;" ) );

Cho phép cộng tác viên tải lên hình ảnh

Theo mặc định, WordPress hạn chế tài khoản cộng tác viên tải lên hình ảnh. Để cho phép những người đóng góp tải lên hình ảnh mà không cần cấp thêm quyền, hãy thêm đoạn mã PHP sau vào tệp tin functions.php

if ( current_user_can('contributor') && !current_user_can('upload_files') )
add_action('admin_init', 'allow_contributor_uploads');
function allow_contributor_uploads() {
$contributor = get_role('contributor');
$contributor->add_cap('upload_files');
}

Ẩn thanh quản trị WordPress

Thanh quản trị WordPress là một tính năng hữu ích cung cấp quyền truy cập nhanh vào các chức năng chính, chẳng hạn như thêm các bài đăng và trang mới. Tuy nhiên, nếu bạn không cần và muốn xóa nó, bạn có thể thực hiện việc này bằng cách dán đoạn mã bên dưới vào tệp tin functions.php

// Remove the admin bar from the front end
add_filter( 'show_admin_bar', '__return_false' );

Hiển thị bài viết phổ biến

Nó có thể hữu ích để hiển thị bài viết phổ biến nhất của bạn. Nếu bất kỳ độc giả nào của bạn thích một loạt bài đăng nhất định của bạn, khách truy cập mới cũng có thể đánh giá cao việc xem chúng. Để đạt được điều này, hãy thêm mã PHP này vào tệp tin functions.php

function count_post_visits() {
if( is_single() ) {
global $post;
$views = get_post_meta( $post->ID, 'my_post_viewed', true );
if( $views == '' ) {
update_post_meta( $post->ID, 'my_post_viewed', '1' );
} else {
$views_no = intval( $views );
update_post_meta( $post->ID, 'my_post_viewed', ++$views_no );
}
}
}
add_action( 'wp_head', 'count_post_visits' );

Sau đó, bạn có thể chèn đoạn mã sau vào bất cứ nơi nào bạn muốn hiển thị các bài đăng phổ biến trong template của mình:

$popular_posts_args = array(
'posts_per_page' => 3,
'meta_key' => 'my_post_viewed',
'orderby' => 'meta_value_num',
'order'=> 'DESC'
);
$popular_posts_loop = new WP_Query( $popular_posts_args );
while( $popular_posts_loop->have_posts() ):
$popular_posts_loop->the_post();
// Loop continues
endwhile;
wp_reset_query();

Phân trang website của bạn

Phân trang tốt là một cách hữu ích để người dùng duyệt một trang web cảm thấy hữu ích. Thay vì sử dụng các liên kết “trước đó” và “tiếp theo”, bạn có thể thêm phân trang vào nội dung của mình bằng cách sử dụng một đoạn mã trong tệp tin functions.php của chủ đề WordPress.

global $wp_query;
$total = $wp_query->max_num_pages;
// only bother with the rest if we have more than 1 page!
if ( $total > 1 ) {
// get the current page
if ( !$current_page = get_query_var('paged') )
$current_page = 1;
// structure of "format" depends on whether we're using pretty permalinks
$format = empty( get_option('permalink_structure') ) ? '&page=%#%' : 'page/%#%/';
echo paginate_links(array(
'base' => get_pagenum_link(1) . '%_%',
'format' => $format,
'current' => $current_page,
'total' => $total,
'mid_size' => 4,
'type' => 'list'
));
}

Tạo shortcode để nhận donate qua cổng PayPal

Bạn có thể sử dụng đoạn mã để shortcode nhằm giúp khách truy cập trang web của bạn quyên góp dễ dàng hơn bằng chức năng PayPal Donate. Để thực hiện việc này, chỉ cần chèn đoạn mã sau vào tệp tin functions.php

function donate_shortcode( $atts, $content = null) {
global $post;extract(shortcode_atts(array(
'account' => 'your-paypal-email',
'for' => $post->post_title,
'onHover' => '',
), $atts));
return '<a href="<https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business='.$account.'&item_name=Donation> for '.$for.'" title="'.$onHover.'">'.$content.'</a>';
}
add_shortcode('donate', 'donate_shortcode');

Thay “your-paypal-email” bằng tài khoản email PayPal của bạn. Sau đó, bạn có thể đặt shortcode [donate] ở bất kỳ đâu trên trang web của mình, vi dụ như sau: [donate]Nội dung của bạn[/donate]

5 Plugins Code Snippets tốt nhất

Khi thêm các đoạn mã vào trang web WordPress của bạn, tốt hơn là sử dụng plugin thay vì chỉnh sửa trực tiếp tệp tin functions.php. Cách tiếp cận này an toàn hơn và dễ quản lý hơn nếu bạn thêm nhiều đoạn mã cho các chức năng khác nhau.

Mặc dù có sẵn nhiều plugin code snippets, nhưng một số plugin tốt hơn những plugin khác. Để giúp bạn tránh khỏi rắc rối khi duyệt qua tất cả chúng, tôi đã thu hẹp danh sách thành sáu plugin code snippets cho WordPress.

1. WPCode

Tốt nhất để thêm đoạn mã vào bất kỳ phần nào trên trang web của bạn.

WPCode là plugin WordPress phổ biến nhất để thêm đoạn mã, được sử dụng bởi hơn một triệu trang web. Plugin này cho phép bạn dễ dàng thêm các đoạn mã như Google Analytics, CSS tùy chỉnh và Facebook Pixel vào đầu trang và chân trang của trang web WordPress cũng như các khu vực khác trên trang web của bạn mà không phải chỉnh sửa tệp tin functions.php của chủ đề. Bạn cũng có thể sử dụng WPCode để chèn các đoạn mã PHP, JavaScript, CSS, HTML và văn bản tùy chỉnh với logic điều kiện đầy đủ và hỗ trợ ưu tiên mã.

Giá cả: Miễn phí, với phiên bản Premium bắt đầu từ $49 mỗi năm.

Các tính năng chính:

• Thư viện đoạn mã – đơn giản hóa trang web của bạn và giảm bớt sự cồng kềnh với các đoạn mã nâng cao được viết bởi các chuyên gia, đã được thử nghiệm trên nhiều thiết lập khác nhau.
• Logic có điều kiện thông minh cho phép các tùy chọn cá nhân hóa nâng cao sử dụng các quy tắc có điều kiện để giới hạn vị trí tải đoạn mã.
• Thư viện đám mây riêng để lưu các đoạn mã và sử dụng lại chúng trên tất cả các trang web của bạn bằng plugin WPCode.
• Sửa đổi mã nâng cao – theo dõi các thay đổi được thực hiện đối với mã của bạn với sự ghi công rõ ràng, vì vậy bạn có thể dễ dàng quay lại những gì hoạt động.
• Nhắm mục tiêu các trang web cụ thể với độ chính xác bằng cách sử dụng các vị trí và quy tắc được tạo sẵn.

Xếp hạng WordPress.org: 4,9 trên 5 sao – từ hơn 1.000 bài đánh giá.

Ưu điểm:

• Trọng lượng nhẹ.
• Chắc chắn.
• Cho phép bạn loại bỏ các plugin không cần thiết khác.
• Dễ sử dụng – ví dụ: bạn có thể dễ dàng chuyển đổi giữa các chức năng.
• Hỗ trợ tuyệt vời.

Nhược điểm:

• Phiên bản miễn phí không có tất cả các tính năng của phiên bản Premium, mặc dù nó vẫn rất tuyệt vời.

2. Header Footer Code Manager

Tốt nhất cho những người lo lắng rằng họ có thể đặt sai vị trí các đoạn mã.

Plugin Header Footer Code Manager cho phép bạn dễ dàng thêm các tập lệnh và kiểu vào bất kỳ trang hoặc bài đăng nào mà không bị giới hạn. Bạn có thể quản lý các trang hoặc bài đăng mà tập lệnh tải trên đó và nó cũng hỗ trợ các loại bài đăng tùy chỉnh. Plugin này cho phép bạn tải các tập lệnh trên các bài đăng hoặc trang cụ thể hoặc các bài đăng mới nhất.

Bạn có thể kiểm soát vị trí tải tập lệnh trên trang: đầu trang, chân trang, trước nội dung hoặc sau nội dung. Bạn thậm chí chỉ có thể tải tập lệnh trên máy tính để bàn hoặc thiết bị di động, bật hoặc tắt. Nếu bạn cần thêm mã theo cách thủ công ở bất cứ đâu, bạn có thể sử dụng mã ngắn. Ngoài ra, mỗi đoạn mã có thể được dán nhãn để dễ nhận biết.

Giá cả: Miễn phí, với phiên bản Premium bắt đầu từ $35 mỗi năm.

Các tính năng chính:

• Thêm tập lệnh và kiểu vào bất kỳ trang hoặc bài đăng nào không có giới hạn.
• Quản lý các trang hoặc bài đăng mà tập lệnh tải trên đó.
• Hỗ trợ các loại bài đăng tùy chỉnh.
• Tải tập lệnh trên các bài đăng hoặc trang cụ thể hoặc các bài đăng mới nhất.
• Kiểm soát vị trí tải tập lệnh trên trang: đầu trang, chân trang, trước nội dung hoặc sau nội dung.
• Chỉ tải tập lệnh trên máy tính để bàn hoặc thiết bị di động, bật hoặc tắt.
• Sử dụng mã ngắn để thêm mã theo cách thủ công ở mọi nơi.
• Dán nhãn cho từng đoạn mã để dễ nhận biết.
• Plugin ghi nhật ký người dùng đã thêm và chỉnh sửa lần cuối đoạn mã, cùng với ngày và giờ chỉnh sửa.

Xếp hạng WordPress.org: 4,9 trên 5 sao.

Ưu điểm:

• Plugin đơn giản và nhẹ.
• Dễ sử dụng.
• Ngăn bạn vô tình đặt các đoạn mã sai vị trí.

Nhược điểm:

• Một số tính năng tiện dụng chỉ có trong phiên bản Premium.

3. Simple Custom CSS

Tốt nhất để dễ dàng thêm mã CSS tùy chỉnh.

Plugin Simple Custom CSS thân thiện với người dùng và cho phép quản trị viên dễ dàng thêm các kiểu CSS tùy chỉnh ghi đè lên các kiểu mặc định của cả plugin và chủ đề. Nó được thiết kế để đáp ứng nhu cầu của những người muốn thêm CSS vào trang web WordPress của họ và các kiểu được tạo bằng plugin này sẽ vẫn còn ngay cả khi chủ đề được thay đổi.

Giá cả: Miễn phí.

Các tính năng chính:

• Hỗ trợ AMP.
• Cung cấp Kiểm soát tùy biến với bản xem trước trực tiếp.
• Cung cấp một công cụ đánh dấu cú pháp mã có giá trị.
• Bao gồm mã linting để kiểm tra lỗi.
• Không yêu cầu cấu hình.
• Có giao diện đơn giản được xây dựng trên giao diện người dùng WordPress gốc.
• Không yêu cầu truy vấn cơ sở dữ liệu phức tạp.
• Đi kèm với tài liệu kỹ lưỡng.
• Cho phép quyền truy cập của Quản trị viên trên Mạng WP (Đa trang).

Xếp hạng WordPress.org: 4,8 trên 5 sao.

Ưu điểm:

• Đơn giản và gọn nhẹ.
• Dễ sử dụng.
• Hoạt động tốt.

Nhược điểm:

• Một số người dùng đã báo cáo rằng nó làm chậm trang web của họ.

4. Head & Footer Code

Tốt nhất để thêm các đoạn mã HTML, CSS và JavaScript tùy chỉnh.

Plugin Head & Footer Code cho phép bạn thêm mã tùy chỉnh vào các phần đầu, nội dung và chân trang của trang web của bạn. Bạn có thể đặt nội dung tùy chỉnh trên toàn trang cho từng phần hoặc thêm mã tùy chỉnh dành riêng cho bài viết cho từng bài đăng. Ngoài ra, bạn có thể đặt mã tùy chỉnh theo danh mục cụ thể cho từng phần. Bạn có thể chọn loại bài đăng nào sẽ bật các trường tùy chỉnh dành riêng cho bài viết và quyết định xem mã dành riêng cho bài viết sẽ thay thế hay được thêm vào mã toàn trang.

Plugin này cũng cho phép bạn chọn mức độ ưu tiên của mã tùy chỉnh được in cho các phần đầu/nội dung/chân trang, xem liệu một bài viết đã xác định bất kỳ mã tùy chỉnh dành riêng cho bài viết nào hay chưa và xem các mục dành cho toàn bộ trang web và dành riêng cho bài viết trong mã nguồn trang được bao bọc thành nhận xét nếu bạn đã đặt hằng số WP_DEBUG thành true trong tệp wp-config.php của mình. Ngoài ra, plugin này được hỗ trợ bởi cài đặt nhiều trang và sẵn sàng cho PHP 8.

Giá cả: Miễn phí.

Các tính năng chính:

• Thêm nội dung tùy chỉnh vào phần đầu, phần thân và phần chân trang của trang web.
• Đặt mã tùy chỉnh dành riêng cho bài viết cho các phần đầu, nội dung và chân trang.
• Đặt mã tùy chỉnh dành riêng cho danh mục cho các phần đầu, nội dung và chân trang.
• Chọn mức độ ưu tiên của mã tùy chỉnh được in cho các phần đầu, nội dung và chân trang.
• Chọn loại bài đăng nào sẽ bật các trường phần đầu, phần thân và phần cuối dành riêng cho bài viết.
• Xem nếu một bài viết đã xác định bất kỳ mã tùy chỉnh dành riêng cho bài viết nào.
• PHP 8 đã sẵn sàng.

Xếp hạng WordPress.org: 5 trên 5 sao.

Ưu điểm:

• Rất dễ sử dụng.
• Hoạt động rất tốt.
• Hỗ trợ tuyệt vời.

Nhược điểm:

• Không tìm thấy ai than phiền về plugin này.

5. Post Snippets

Tốt nhất để tạo mã ngắn tùy chỉnh và nội dung có thể tái sử dụng.

Plugin Post Snippets cho phép bạn tạo một thư viện HTML, mã PHP hoặc các đoạn văn bản thường được sử dụng để có thể dễ dàng chèn vào các bài đăng và trang của bạn. Các biến được xác định trước có thể được sử dụng để thay thế các phần của đoạn mã khi được chèn vào. Tất cả các đoạn trích đều có thể truy cập thông qua một nút trong chế độ Trực quan của trình chỉnh sửa bài đăng. Đoạn mã có thể được chèn nguyên trạng hoặc dưới dạng mã ngắn để giúp cập nhật dễ dàng hơn. Nếu bạn chèn đoạn mã dưới dạng mã ngắn, mã PHP sẽ được hỗ trợ.

Giá cả: Miễn phí, với phiên bản Premium bắt đầu từ $29 mỗi năm.

Các tính năng chính:

• Có thể dễ dàng chèn đoạn trích từ một nút trong trình chỉnh sửa bài đăng.
• Mã ngắn tùy chỉnh có thể được tạo bằng plugin này.
• Các đoạn mã ngắn có thể được xử lý dưới dạng mã PHP nếu muốn.
• Có thể truy cập các đoạn mã thông qua các nút trong cả trình chỉnh sửa trực quan và HTML.
• Trang ‘Quản lý đoạn mã’ thân thiện với người dùng để thêm, chỉnh sửa và xóa đoạn mã.
• Đoạn mã có thể bao gồm các biến tùy chỉnh để chèn.
• Đoạn mã có thể được nhập và xuất giữa các trang web.
• Toàn bộ tài liệu có sẵn từ bảng trợ giúp của plugin.
• Dữ liệu được tạo bởi plugin sẽ tự động bị xóa khỏi cơ sở dữ liệu WordPress khi gỡ cài đặt.

Xếp hạng WordPress.org: 4,7 trên 5 sao.

Ưu điểm:

• Rất dễ sử dụng.
• Không làm chậm trang web của bạn.
• Hỗ trợ tuyệt vời.

Nhược điểm:

• Bạn không thể sắp xếp các đoạn mã.

Câu hỏi thường gặp