WordPress là nền tảng dễ sử dụng mà bạn không cần đụng đến dòng code nào. Nhưng nếu biết cách sửa code WordPress thì còn tốt hơn nữa, vì bạn sẽ kiểm soát mã nguồn này chặt chẽ hơn. Bạn cũng có thể khắc phục sự cố hoặc thực hiện tùy chỉnh nâng cao để cải thiện trang WordPress.

Bài viết này sẽ hướng dẫn nguyên do tại sao nên sửa code WordPress và hướng dẫn nó .

Tại sao cần phải biết cách sửa code WordPress?

WordPress là một nền tảng cực kỳ trực quan và thân thiện với người dùng. Có nhiều cách để tùy chỉnh và biến hóa website của bạn mà không cần chạm vào bất kể một dòng code nào nhờ các theme và plugin .

Về mặt kỹ thuật, bạn không cần phải truy cập vào bất kỳ file hoặc code của website để nó hoạt động đầy đủ. WordPress Dashboard, plugin và theme đều giúp việc điều chỉnh và cá nhân hóa trang web của bạn trở nên nhanh chóng và dễ dàng.

Tuy nhiên, đôi lúc bạn hoàn toàn có thể muốn tiến hành nhiều quyền trấn áp hơn và thực thi các tùy chỉnh nâng cao. Có lẽ biến hóa bạn đang muốn thực thi không phải là một tùy chọn với theme hoặc plugin .

Một khả năng khác là trang web của bạn gặp sự cố hoặc gặp một số lỗi khác khiến bạn không thể truy cập Admin Dashboard. Bạn có thể sẽ cần chỉnh sửa code trong WordPress của mình để khắc phục sự cố.

Trong những trường hợp như vậy, sẽ rất có ích nếu bạn biết cách sửa code trong WordPress. Cũng như cách truy vấn và sửa đổi source code khác một cách bảo đảm an toàn và hiệu suất cao. Bao gồm PHP, CSS và Javascript. Nói một cách đơn thuần, học một số ít vị trí mã hóa WordPress cơ bản để bạn trấn áp và linh động trong việc phong cách thiết kế, quản trị và duy trì WordPress .

Sửa code WordPress

Sẽ có nhiều cách để sửa code WordPress. Sau đây chúng tôi sẽ liệt kê hướng dẫn sửa code WordPress đơn thuần .

Cách chỉnh sửa code HTML trong WordPress

Lưu ý rằng việc sửa code WordPress hoàn toàn có thể mang lại một số ít rủi ro đáng tiếc. Việc chỉnh sửa HTML tương đối bảo đảm an toàn với các kỹ thuật khác mà tất cả chúng ta sẽ tìm hiểu thêm trong bài này, nhưng vẫn nên triển khai cẩn trọng và tạo các backup trước .

Chỉnh sửa code HTML trong WordPress với Classic Editor

Nếu bạn muốn thêm hoặc sửa HTML trong WordPress của trang hoặc bài đăng WordPress, bạn thực sự không cần truy vấn source code của website của mình. Trong Classic Editor, toàn bộ những gì bạn phải làm là chuyển từ Visual Editor sang Text Editor. Điều này sẽ hiển thị hoạt động giải trí của HTML .
chỉnh sửa code wordpressHướng dẫn cách chỉnh sửa code HTML trong bài viết
Từ Text editor, bạn hoàn toàn có thể truy vấn, biến hóa và update HTML trên bất kể trang hoặc bài đăng nào chỉ với một cú nhấp chuột. Bạn hoàn toàn có thể xem các biến hóa của mình bất kể khi nào bằng cách chuyển về Visual editor. Khi hoàn tất, hãy lưu lại bài đăng hoặc trang của bạn .

Chỉnh sửa code HTML WordPress với Block Editor

Nếu bạn đang sử dụng Block Editor ( Gutenberg ), việc chuyển từ Visual Editor sang Text Editor cần thêm một vài bước. Tuy nhiên, bạn cũng có nhiều tùy chọn có sẵn để sửa code WordPress của mình. Bao gồm thực thi các đổi khác so với hàng loạt trang hoặc bài đăng đối với các block riêng không liên quan gì đến nhau .
Để chỉnh sửa code WordPress của hàng loạt trang hoặc bài đăng, hãy nhấp vào ba chấm dọc nằm ở góc trên cùng bên phải, sau đó chọn Code Editor .
sửa codew wordpressChuyển sang code editor khi sử dụng Block Editor
Thao tác này sẽ mở WordPress HTML Editor. Để chuyển từ Visual Editor sang Text Editor ở một block đơn cử. Hãy nhấp vào ba chấm dọc trên block toolbar, sau đó chọn Edit as HTML :
sửa html trong wordpressChỉnh sửa HTML trong từng block
Một cách khác để thêm HTML vào trang hoặc bài đăng là sử dụng block Custom HTML :
cách sửa code trong wordpressCách khác, bạn có thể thao tác như trên hình
Bạn hoàn toàn có thể viết HTML code của mình trực tiếp vào trong khối, sau đó nhấp vào Preview trước khi xem code sẽ trông như thế nào trên giao diện người dùng :
code trong wordpressViết code trưc tiếp
Khi hoàn tất, hãy lưu các đổi khác vào bài đăng hoặc trang của bạn .

Chỉnh sửa HTML trang chủ trong WordPress

Trong một số ít theme, trang chủ hoạt động giải trí như một trang cá thể của riêng nó. Do đó, quy trình sửa code WordPress của nó giống như được diễn đạt ở trên. Chỉ cần chọn trang có tương quan từ list trong dashboard của bạn :
chỉnh sửa code wordpress với theme editorChỉnh sửa HTML trang chủ
Bạn cũng hoàn toàn có thể nhấp vào Edit Page trong thanh admin từ trang chủ của mình để truy vấn Classic hoặc Block Editor :
chỉnh sửa html trang chủChỉnh sửa trực tiếp trên thanh Admin WordPress
Nếu cả hai tùy chọn đó đều không hoạt động giải trí để sửa code WordPress trên trang chủ của bạn, bạn hoàn toàn có thể đang sử dụng Page Builder hoặc theme với homepage editor được tích hợp sẵn. Nếu đúng như vậy, bạn hoàn toàn có thể tìm hiểu thêm tài liệu về công cụ tương quan .

Chỉnh sửa HTML WordPress với Widget

Cuối cùng bạn hoàn toàn có thể muốn thêm HTML vào thanh thanh bên hoặc chân trang WordPress của mình. Nhiều theme WordPress cũng sử dụng widget để trấn áp nội dung trên trang chủ của website .

Bạn có thể thực hiện việc điều chỉnh trang chủ, header và footer này thông qua tiện ích Custom HTML widget.

chỉnh sửa code trong widgetChỉnh sửa HTML trong Widget

Chỉ cần điếu hướng đến “Appearance > Widgets“, thêm tiện ích Custom HTML widget vào thanh bên hoặc chân trang và chỉnh sửa nó theo ý muốn của bạn. Nhấp vào nút Save để publish nó trên trang của bạn.

Cách chỉnh CSS và PHP trong WordPress

Quá trình chỉnh sửa CSS trong WordPress của bạn khá giống với quy trình sửa đổi JavaScript. Có ba giải pháp bạn hoàn toàn có thể sửa code WordPress của mình như vậy :

  • Chỉnh sửa file CSS của bạn trong Theme Editor.
  • Sử dụng CSS Editor được tích hợp sẵn của theme trong WordPress Customizer.
  • Thêm CSS bằng plugin.

Phương pháp nào tương thích nhất với bạn sẽ nhờ vào vào mức độ chỉnh sửa mà bạn định triển khai cũng như tần suất bạn định triển khai đổi khác .

Chỉnh sửa CSS thông qua Theme Editor

Tất cả file CSS được sử dụng cho theme của trang web WordPress có thể được tìm thấy trong Theme Editor (Appearance > Theme Editor). Trong danh sách bên phải, hãy tìm các file kết thúc bằng phần mở rộng .css:

sửa css wordpressChỉnh CSS qua Theme Editor

Bạn có thể thực hiện các thay đổi mong muốn của mình trong editor. Khi bạn hoàn tất, hãy nhấp vào Update File để lưu các thay đổi của bạn.

Sửa CSS với WordPress Customize

Ngoài WordPress Theme Editor, bạn cũng có thể sửa code WordPress của mình bằng WordPress Customizer. Để truy cập nó, hãy điều hướng đến “Appearance > Customize” từ WordPress Dashboard

chỉnh sửa css wordpressTruy cập vào “Appearance > Customize”

Tiếp theo, nhấp vào Additional CSS ở cuối bảng bên trái:

code web wordpressChọn Additional CSS
Một code editor sẽ được mở ra nơi bạn hoàn toàn có thể thêm CSS tùy chỉnh vào đây .
code wordpressThêm css tùy chỉnh vào đây
Như bạn đã thấy, editor này khá nhỏ và hầu hết dành cho các sửa đổi nhỏ thay vì viết lại hàng loạt phong thái của website của bạn. Việc thực thi các đổi khác quy mô lớn Theme Editor hoặc sử dụng plugin sẽ thuận tiện hơn .

Khi hoàn tất việc thêm CSS vào Customizer, nhấp vào nút Publish để lưu các thay đổi của bạn.

Sử dụng plugin CSS Hero

CSS Hero là một công cụ trực quan được cho phép bạn chỉnh sửa các góc nhìn phong cách thiết kế và phong thái website của mình mà không cần sửa đổi các file theme .
sử dụng plugin hero css để chỉnh css wordpressSử dụng plugin Hero CSS
Đây là một WordPress Theme editor được cho phép bạn tàng trữ snapshot các đổi khác của mình, gồm có các phiên bản khác nhau và đưa chúng vào hoạt động giải trí. Nó tạo ra một CSS extra đi kèm với theme của bạn. Do đó, bạn sẽ không cần phải lo ngại về việc gây ra bất kể thiệt hại nào bằng cách chỉnh sửa trực tiếp file CSS của mình .

Các tính năng của CSS Hero bao gồm:

  • Các đoạn văn được tạo sẵn, có thể chỉnh sửa.
  • Tích hợp và hỗ trợ Google Font và TypeKit
  • Visual editor cho phép xem trước các thay đổi khi thực hiện chúng.

Sử dụng Theme Editor để sửa code WordPress

Trong trường hợp khác, WordPress phân phối editor thích hợp được cho phép bạn chỉnh sửa trực tuyến các file theme của mình. Trong Theme Editor, bạn hoàn toàn có thể truy vấn PHP, CSS, JavaScript và tổng thể các file tương quan để sửa code WordPress của mình .

Nếu trang web WordPress của bạn vẫn hoạt động, bạn có thể tìm thấy source code của trang web của mình trong “Appearance > Theme Editor”

Chỉnh sửa code trong theme editorVào phần theme editor
Trong khu vực chỉnh sửa này, bạn hoàn toàn có thể thực thi bất kể đổi khác nào mà bạn thấy tương thích với phong cách thiết kế và cấu trúc theme của mình :
giao diện chỉnh sửa code wordpress theme editor
Nếu bạn đã thiết lập nhiều theme, bạn hoàn toàn có thể quy đổi theme ở góc trên bên phải của Editor .
lựa chọn theme cần chỉnh sửa code wordpressLựa chọn theme bạn cần chỉnh sửa
Để chọn các file theme đơn cử cho việc sửa code WordPress, bạn hoàn toàn có thể chọn từ list ở bên phải của Editor :
lựa chọn file chỉnh sửa codeChọn file cần chỉnh sửa có sẵn trên giao diện
Các file có sẵn ở đây tùy thuộc vào theme của bạn, nhưng tối thiểu bạn nên thấy :

  • style.css: Đây là stylesheet của bạn, chứa nhiều tính năng liên quan đến thiết kế, chẳng hạn như phông chữ và bảng màu của theme của bạn.
  • functions.php: File chức năng của theme bao gồm PHP code sửa đổi các tính năng mặc định của WordPress.

Sau khi chỉnh sửa code WordPress của mình trong Theme Editor xong, hãy nhớ lưu các thay đổi của bạn. Chỉ cần nhấp vào nút Update File ở cuối màn hình để thực hiện việc đó.

WordPress sẽ ngăn bạn lưu các biến hóa nếu nó thấy có lỗi trong code. Đây là một phần của những gì làm cho việc làm sửa code WordPress bằng Theme Editor trở nên bảo đảm an toàn hơn so với sửa code WordPress trải qua FTP ( tất cả chúng ta sẽ tranh luận ở phần sau ) .

Cách chỉnh sửa code WordPress qua FTP

Như bạn hoàn toàn có thể nhớ lại ở phần trước, việc sử dụng Theme Editor để sửa code WordPress là một chiêu thức để truy vấn và biến hóa source code của website. Cách khác là sử dụng FTP client ví dụ điển hình như FileZilla. Các loại công cụ này được cho phép bạn liên kết với server của website để truy vấn các file được tàng trữ ở đó .
Cách tiếp cận này tương quan đến việc thực thi các biến hóa cục bộ với file của bạn. Sau đó tải lại các file đã được sửa code WordPress lên thiên nhiên và môi trường tàng trữ .
Dưới đây là bốn bước để sửa code WordPress qua FTP .

Bước 1: Định vị hoặc tạo thông tin đăng nhập FTP của bạn

Trước tiên, để liên kết với server của bạn qua FTP, bạn sẽ cần thông tin đăng nhập FTP, gồm có username, password và hostname. Bạn sẽ hoàn toàn có thể tìm thấy chúng được liệt kê trong thông tin tài khoản hosting của mình .

Nếu không, bạn có thể tạo username và password của mình trong cPanel trong “File > FTP Accounts

vào tài khoản ftpVào FTP Accounts

Nhấp vào biểu tượng này, sau đó chọn Add FTP Account:

tạo tài khoản ftpAdd tài khoản FTP vào giao diện

Trên Add FTP Account, hãy hoàn thành các bước sau:

  1. Thêm số nhận dạng duy nhất cho FTP username của bạn. FTP username sẽ là uniqueidentifier@primarydomain.com, vì vậy hãy copy/paste nó vào một vị trí an toàn.
  2. Tạo một password mạnh. Chúng tôi khuyên bạn nên sử dụng trình tạo password đạt xếp hạng độ mạnh 100/100. Đây sẽ là password FTP của bạn.
  3. Đối với Directory, hãy luôn sử dụng public_html.
  4. Quota của bạn luôn là Unlimited.

Nhấp vào Create FTP Account và bạn đã hoàn tất! Nếu gặp sự cố khi tạo thông tin đăng nhập FTP, bạn có thể muốn Google “[your hosting provider] FTP”. Thông thường, điều này sẽ cung cấp ít nhất một vài hướng dẫn hữu ích.

Bước 2: Tải xuống một FTP Client chẳng hạn như FileZilla

tải filezillaTải fileZilla
Đây là giải pháp FTP không tính tiền được cho phép bạn truyền file qua lại giữa máy tính và server của website. Tuy nhiên, có những FTP Client khác, vì thế hãy sử dụng ứng dụng tương thích với nhu yếu của bạn .

Bước 3: Đăng nhập vào môi trường web hosting thông qua FileZilla

Sau khi hoàn tất tải xuống FileZilla, hãy mở nó và nhập tên FTP hostname, username và password .
Nhập FTP

Nếu cPanel của bạn liệt kê một địa chỉ IP, bạn có thể sử dụng nó để làm host. Sau khi bạn nhập các thông tin đăng nhập này, hãy nhấp vào nút Quickconnect.

quickconnect
Nó sẽ liên kết với server trong vài giây .

Bước 4: Bắt đầu sửa code WordPress của bạn

Sau khi đăng nhập, bạn có quyền truy cập vào file nguồn WordPress để chỉnh sửa HTML, CSS, PHP và JS khi bạn thấy phù hợp. Chỉ cần nhấp chuột phải vào bất kỳ file nào và chọn View/Edit.

Chỉnh sửa HTML, CSS,…
Khi bạn đã sửa code WordPress của mình xong, hãy lưu tệp. Sau đó FileZilla sẽ tự động hóa tải lên thay cho phiên bản cũ .

Lời kết

Trên đây là các cách chỉnh sửa code WordPress cơ bản, để bạn hoàn toàn có thể nắm được và biết cách để duy trì, tùy chỉnh hay khắc phục trên website WordPress của mình. Chúc các bạn thành công xuất sắc .

5/5 – ( 2 bầu chọn )

Leave a Reply

Your email address will not be published