3 cách để dán snippet vào WordPress đơn giản, nhanh chóng

Lượt xem
Home

Cách sao chép và dán snippet từ web vào WordPress nhanh nhất? Vietnix đã đăng nhiều hướng dẫn WordPress yêu cầu người dùng thêm các đoạn snippet vào trang web. Dù việc sao chép và dán snippet vào các file theme của WordPress có thể dễ dàng đối với người dùng có kinh nghiệm, nhưng có thể trở nên khó khăn và đáng sợ đối với những người mới bắt đầu. Trong bài viết này, Vietnix sẽ hướng dẫn bạn cách sao chép và dán snippet vào WordPress mà không gây hỏng trang web.

Tại sao cần thêm snippet vào website WordPress?

WordPress đã trở thành công cụ xây dựng trang web hàng đầu trên thế giới nhờ tính linh hoạt vượt trội mà chúng mang lại. Việc thêm tính năng và chức năng mới vào trang web trở nên dễ dàng và WordPress có thể hỗ trợ xây dựng gần như bất kỳ loại trang web nào.

Vietnix rất vui lòng khi được chia sẻ các mẹo và thủ thuật đa dạng giúp nâng cao trang web. Một số mẹo này sẽ yêu cầu bạn thêm snippet vào WordPress.

Tại sao cần thêm Snippet vào website WordPress?
Tại sao cần thêm Snippet vào website WordPress?

Mặc dù việc thêm custom snippet vào trang web là tùy chọn và thường có thể tìm được plugin để thực hiện cùng công việc, đôi khi sử dụng snippet ngắn gọn có thể hiệu quả hơn.

Thường xuyên, việc thêm các đoạn snippet có thể là một cách đơn giản để khắc phục nhiều lỗi phổ biến trong WordPress, nâng cao bảo mật trang web và thêm tính năng mới. Vì vậy, hãy cùng tìm hiểu cách thêm snippet vào website WordPress một cách an toàn.

Cách tốt nhất để thêm snippet trong WordPress là gì?

Trước khi thêm snippet vào trang web WordPress, hãy đảm bảo cài đặt và sử dụng plugin backup WordPress để bảo vệ dữ liệu của bạn.

Hướng dẫn cách cài đặt plugin WordPress đơn giản, nhanh chóng

Khi thêm snippet, bạn có thể nhận thấy rằng hướng dẫn yêu cầu thêm vào các file template theme của WordPress như index.php, single.php và nhiều file khác. Tuy nhiên, phần lớn snippet sẽ được thêm vào file functions.php của theme WordPress. Hãy sử dụng phương pháp này để đảm bảo tính linh hoạt và tránh mất đi các chức năng tùy chỉnh khi thay đổi theme.

Có nhiều cách khác nhau để chỉnh sửa các file trong WordPress, tùy thuộc vào phương pháp bạn chọn để thêm custom snippet vào trang web hoặc blog WordPress.

1. Thêm custom snippet bằng Plugin WPCode

Plugin WPCode cho phép bạn dễ dàng thêm và quản lý các đoạn mã tùy chỉnh trên trang web mà không cần chỉnh sửa các file theme.

Plugin WPCode
Plugin WPCode

Plugin này cung cấp snippet thông minh để ngăn chặn lỗi snippet thông thường và bảo vệ trang web. WPCode cũng có một thư viện mã tích hợp, giúp bạn dễ dàng tìm kiếm các đoạn mã phổ biến trong WordPress. Bạn có thể thêm snippet chỉ trong vài cú nhấp chuột. Phần tuyệt vời là WPCode cho phép bạn quản lý tất cả các snippet từ một màn hình trung tâm và sắp xếp chúng bằng cách sử dụng các tag.

Lưu ý: Sử dụng WPCode rất hữu ích cho snippet cần được thêm vào file functions.php. Tuy nhiên, nếu bạn nhận được yêu cầu thêm snippet vào các file theme khác, thì cách này sẽ không phù hợp.

Cách chỉnh sửa và dán snippet vào WordPress bằng WPCode

Khi sử dụng plugin WPCode để dán snippet vào WordPress, bạn có thể thêm snippet trực tiếp trong WordPress dashboard. Đầu tiên, cài đặt và kích hoạt plugin WPCode miễn phí. Sau đó, vào Code Snippets > + Add Snippet trong WordPress dashboard. Nhấp vào button “Add New” để thêm snippet mới.

Chọn thêm snippet mới
Chọn thêm snippet mới

Sau đó, chọn snippet từ thư viện sẵn có hoặc thêm custom snippet của riêng bạn. Để thêm custom snippet, nhấp vào button “Use snippet” dưới tùy chọn “Add Your Custom Code (New Snippet)”.

image 1165
Thêm custom snippet

Trên màn hình tiếp theo, hãy bắt đầu bằng việc đặt tên cho snippet. Sau đó, dán snippet vào ô văn bản. Hãy chắc chắn chọn loại code đúng từ menu thả xuống bên phải.

Thêm code snippet mới
Thêm code snippet mới

Tiếp theo, cuộn xuống phần “Insertion” và chọn sử dụng đoạn snippet như một shortcode để sao chép và dán bằng tay vào bất kỳ vị trí nào trên trang web. Hoặc, chọn phương pháp “Auto Insert” để lựa chọn một vị trí (hàm WordPress) mà code snippet sẽ được chèn tự động.

Ngoài nội dung phía trên, bạn cũng có thể quan tâm về:

Chọn Insertion
Chọn Insertion

Phần tuyệt vời nhất về WPCode là ngoài các tùy chọn Auto-Insert đa dạng, còn có tùy chọn logic điều kiện thân thiện với người mới. Điều này cho phép bạn lựa chọn khi nào code nên được tải.

WPCode Logic
WPCode Logic

Sau khi dán snippet, chuyển công tắc từ “Inactive” sang “Active” ở góc trên bên phải. Sau đó, nhấp vào button “Save Snippet” để lưu snippet.

Kích hoạt và lưu Snippet
Kích hoạt và lưu Snippet

Khi snippet đã được kích hoạt, sẽ được tự động thêm vào hoặc hiển thị dưới dạng shortcode, tùy thuộc vào phương pháp chèn bạn đã chọn.

Cách thêm code vào phần Header và Footer trong WordPress

Chỉ cần thêm code vào file header.php hoặc footer.php của theme. Plugin WPCode sẽ giúp bạn thực hiện điều này dễ dàng. Bên cạnh đó, WPCode cho phép quản lý tất cả mã header và footer tại một nơi, ngăn ngừa các lỗi thủ công và mang lại linh hoạt khi nâng cấp hoặc thay đổi theme.

Lưu ý: Cách này đặc biệt phù hợp cho việc thêm code theo dõi, custom CSS và JavaScript code.

Để thực hiện, hãy truy cập vào Code Snippets > Header and Footer, sau đó nhập snippet vào phần header, body hoặc footer của trang web.

Thêm code vào Header và Footer
Thêm code vào Header và Footer

Nhấp vào button “Save changes” để các code snippet sẽ được áp dụng trực tiếp trên trang web.

2. Thêm custom snippet vào plugin WordPress dành riêng cho trang web

Một lựa chọn linh hoạt khác là sử dụng một plugin WordPress đặc thù cho trang web. Đây là một plugin tùy chỉnh mà bạn có thể tạo riêng cho trang web và sử dụng để lưu trữ tất cả custom code. Ưu điểm của phương pháp này là code không phụ thuộc vào theme, và vẫn hoạt động ngay cả khi bạn thay đổi theme. Đồng thời cũng không bị ảnh hưởng bởi bất kỳ cập nhật WordPress nào trên trang web.

Tạo plugin đặc thù
Tạo plugin đặc thù

Lưu ý: Cách này chỉ áp dụng cho các code snippet cần được thêm vào file functions.php.

Nếu đang sử dụng một plugin đặc thù cho trang web, bạn có thể sử dụng trình chỉnh sửa plugin tích hợp sẵn trong WordPress để thêm custom code.

Đầu tiên, truy cập vào Plugins > Plugin Editor và sau đó chọn plugin từ “Select plugin to edit“. Trình chỉnh sửa sẽ tải plugin đặc thù cho trang web. Sau đó, bạn chỉ cần thêm code vào trang.

Thêm code vào các plugin đặc thù
Thêm code vào các plugin đặc thù

Sau khi hoàn thành, nhấp vào button “Update File” để lưu thay đổi. Nếu có sai sót trong code hoặc có thể gây hỏng trang web, trình chỉnh sửa plugin sẽ tự động hoàn tác thay đổi. Cách khác để thêm custom code vào plugin đặc thù cho trang web là sử dụng FTP. Mở trang web bằng FTP, sau đó nhấp chuột phải vào file plugin và chọn “View/Edit“.

FTP trong trình chỉnh sửa của WordPress
FTP trong trình chỉnh sửa của WordPress

Điều này sẽ mở file để bạn có thể dán custome code. Khi lưu và tải lên file mới, thay đổi sẽ tự động hiển thị.

3. Thêm custom snippet vào Functions.php hoặc các theme template khác

Mặc dù bạn có thể thêm code snippet trực tiếp vào file functions.php của theme, tuy nhiên Vietnix khuyên bạn nên sử dụng các cách đã được đề cập ở trên, vì chúng có một số nhược điểm.

Thêm code vào functions.php
Thêm code vào functions.php

Trước tiên, khi cập nhật theme WordPress, tất cả những thay đổi bạn đã thực hiện sẽ bị mất đi. Ngoài ra, code thêm vào chỉ có tác dụng khi sử dụng theme cụ thể đó. Vì vậy, chúng ta hãy tìm hiểu cách sao chép và dán snippet một cách đúng đắn nhằm tránh gây hỏng trang web.

Nếu bạn muốn thêm snippet trực tiếp vào tệp functions.php của theme, hãy truy cập Appearance > Theme Editor trong WordPress dashboard. Tiếp theo, chọn file từ cột bên phải, và trình soạn thảo sẽ mở lên để bạn thêm code vào.

Thêm code vào các template khác
Thêm code vào các template khác

Hướng dẫn mà bạn đang làm theo sẽ chỉ rõ vị trí để thêm đoạn code, nhưng nếu không có hướng dẫn, thì chỉ cần thêm code vào cuối file, dưới tất cả các đoạn code hiện có.

Cách khác là sử dụng FTP hoặc quản lý file của dịch vụ hosting WordPress để thêm custom code vào các file theme. Đơn giản kết nối với FTP và truy cập vào thư mục wp-content > themes > your-theme-folder, sau đó nhấp chuột phải vào file cần chỉnh sửa.

Edit file theme qua FTP
Edit file theme qua FTP

Sau đó, nhấp vào tùy chọn ‘View/Edit‘ để mở file trong trình soạn thảo văn bản và thêm code snippet.

Cách khắc phục sự cố lỗi PHP khi thêm custom code

Khi thêm custome code vào trang web WordPress, nhiều người thường mắc phải một số lỗi phổ biến. Tuy nhiên, may mắn thay, hầu hết các lỗi này có thể được tránh và khắc phục dễ dàng. Hãy xem qua những lỗi này và các phương pháp tốt nhất để khắc phục chúng.

1. Sử dụng sai tag bắt đầu và kết thúc của PHP

WordPress chủ yếu được viết bằng ngôn ngữ lập trình PHP, với cú pháp đặc biệt để thông báo cho máy chủ rằng đoạn code sau đó sẽ được xử lý bởi PHP. Dưới đây là một ví dụ về đoạn mã PHP thông thường:

// PHP Begin Tag
<?php
  
// Rest of the code goes here
  
// PHP End Tag
?>

Tất cả code PHP cần được đặt trong <?php and ?>. Tag kết thúc PHP là rất quan trọng trong các file mà chuyển đổi giữa PHP và HTML. Điều này đặc biệt áp dụng cho hầu hết các file theme WordPress sử dụng tag PHP cùng với HTML.

Hãy đảm bảo rằng khi dán code vào một vị trí mà tag mở PHP chưa được đóng, bạn cần thêm code mà không có tag PHP mở đầu.

<?php
// Some pre-existing code
  
// your custom code
  
?>

Nếu bạn dán custom code bên ngoài hoặc sau tag kết thúc PHP, thì bạn cần thêm cả tag bắt đầu PHP.

<?php
// Some pre-existing code
?> 
  
// Your custom code snippet
<?php 
  
?>

Khoảng 90% lỗi xảy ra do đặt sai vị trí tag bắt đầu hoặc kết thúc PHP. Kiểm tra code sẽ giúp xác định xem liệu bạn cần thêm tag bắt đầu hoặc kết thúc PHP vào custom code hay không.

Tuy nhiên, trong một số file theme WordPress như functions.php, có thể không có tag kết thúc PHP. Điều này cho phép bạn thêm code vào cuối file mà không cần tag bắt đầu hoặc kết thúc PHP.

Dưới đây là một ví dụ:

<?php
// Lots of code in your theme's functions.php file
//
//
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

Hãy nhớ rằng một số hướng dẫn có thể cho rằng bạn đã biết cách sử dụng các tag bắt đầu và kết thúc PHP. Do đó, chúng có thể chỉ hiển thị một đoạn code mà không bao gồm các tag đó.

function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

Khi thêm đoạn code vào các file theme, đôi khi không cần thêm tag bắt đầu và kết thúc PHP nếu đoạn code đã được cung cấp. Tuy nhiên, bạn cần đảm bảo rằng đoạn code đó vẫn nằm trong các tag PHP.

2. Lỗi lồng nhau không chính xác

PHP có cú pháp đặc biệt cho các hàm, logic điều kiện và vòng lặp. Cú pháp này phụ thuộc vào dấu ngoặc nhọn để chỉ ra khi một hàm bắt đầu và kết thúc.

Ví dụ, đây là một hàm PHP đơn giản:

<?php
function wpbeginner_tutorial() {
echo "Hello World!";
}
?>

Khi muốn thêm một đoạn custom code không liên quan đến hàm này, thì bạn cần đặt code bên ngoài hàm như sau:

// Pre-existing code in your theme file
<?php
function wpbeginner_tutorial() {
echo "Hello World!";
}
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
?>

Nếu bỏ sót dấu ngoặc nhọn mở đầu hoặc kết thúc, thì điều này sẽ làm hỏng code dẫn đến lỗi trang.

Hiểu lỗi PHP trong WordPress

Khi thêm custom code vào WordPress, lỗi thường sẽ xuất hiện với thông báo chi tiết. Thông thường, đó là các lỗi cú pháp, lỗi phân tích cú pháp hoặc lỗi nghiêm trọng do ký tự không mong đợi.

Tin tốt là những lỗi này sẽ chỉ ra dòng code nào đã gây ra vấn đề.

Ví dụ lỗi PHP
Ví dụ lỗi PHP

Sau đó, bạn có thể đi đến dòng chính xác để xem lại code và tìm hiểu những lỗi sai.

Phải làm gì khi trang web WordPress không thể truy cập được?

Đầu tiên, kết nối với trang web qua FTP hoặc cPanel. Tìm và mở file chứa code gây lỗi để chỉnh sửa. Sửa các vấn đề trong code snippet. Nếu không thể sửa, xóa code snippet và lưu thay đổi. Kiểm tra lại trang web, nếu vẫn có lỗi thì tải xuống bản sao mới của theme WordPress và ghi đè lên file cũ.

Đối với những người đang tìm kiếm một giải pháp hosting vượt trội để xây dựng và nuôi dưỡng website hoặc blog cá nhân dựa trên WordPress, Vietnix mang đến dịch vụ WordPress Hosting – một lựa chọn hàng đầu trong ngành. Dịch vụ WordPress Hosting của Vietnix, được thiết kế tối ưu đặc biệt cho WordPress, cung cấp một loạt các tính năng vượt trội nhằm tăng cường hiệu suất và đảm bảo an toàn cho trang web của bạn, bao gồm:

  • Tải trang nhanh chóng, chỉ dưới 1 giây, nhờ ổ cứng NVMe cực nhanh và công nghệ LiteSpeed Enterprise.
  • Hỗ trợ tư vấn tăng tốc độ trang web bởi các chuyên gia WordPress 24/7.
  • An toàn dữ liệu đảm bảo với hệ thống backup tự động 4 lần mỗi ngày và khả năng phục hồi nhanh.
  • Sự ổn định của website được bảo đảm bởi cơ sở hạ tầng tiên tiến và công nghệ Firewall anti DDoS do Vietnix phát triển.
  • Tạo website WordPress dễ dàng chỉ với một cú click chuột qua WordPress Toolkit.
  • Tặng kèm bộ sưu tập theme và plugin WordPress cao cấp, với giá trị lên đến 50.000.000 VND/Năm, bao gồm Rank Math SEO Pro, Elementor Pro, Divi,…

Để biết thêm thông tin và lựa chọn gói WordPress Hosting phù hợp, hãy liên hệ Vietnix ngay hôm nay!

  • Địa chỉ: 265 Hồng Lạc, Phường 10, Quận Tân Bình, Thành Phố Hồ Chí Minh.
  • Hotline: 1800 1093.
  • Email: sales@vietnix.com.vn.

Lời kết

Vietnix hy vọng bài viết này đã giúp bạn hiểu cách dán snippet vào WordPress. Bạn cũng có thể muốn xem hướng dẫn của Vietnix về cách cho phép PHP vào posts và pages trong WordPress hay 2 loại code web phổ biến nhất hiện nay. Vietnix chúc bạn thành công!

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (92 bình chọn)

Hoàng Vui

Kết nối với mình qua

Icon Quote
Icon Quote
Đăng ký nhận tin
Để không bỏ sót bất kỳ tin tức hoặc chương trình khuyến mãi từ Vietnix

Bình luận