Bỏ qua đến nội dung chính

Cách thêm đoạn mã bằng Gutenberg trên WordPress

Divi: chủ đề WordPress dễ sử dụng nhất

Divi: Chủ đề WordPress tốt nhất mọi thời đại!

hơn Tải xuống 901.000, Divi là chủ đề WordPress phổ biến nhất trên thế giới. Nó là hoàn chỉnh, dễ sử dụng và đi kèm với hơn 62 mẫu miễn phí. [Khuyến nghị]

Hầu hết mọi blogger, người sáng tạo nội dung hoặc nhà phát triển công nghệ đều cần đăng các đoạn trích được đánh dấu trên blog của họ theo thời gian. Bản thân nó có thể là một cơn đau đầu. Tuy nhiên, đánh dấu một hoặc nhiều dòng trong đoạn mã này cũng có thể cần thiết và rất tiếc, chức năng này không phải là một phần của hầu hết các tích hợp mã. May mắn thay, plugin SyntaxHighlighter Evolved tồn tại. Chúng tôi sẽ hướng dẫn bạn cách sử dụng nó để giữ cho mã sạch và dễ đọc nhất có thể.

Cú pháp tiến hóa

Công cụ đánh dấu cú pháp

Cài đặt và kích hoạt plugin rất đơn giản. Bạn có thể tìm thấy nó trên kho lưu trữ plugin WP.org nhưng hãy chắc chắn rằng nó được thực hiện tốt bởi Alex Mill (Viper007Bond), bởi vì quả thực, có rất nhiều kết quả. Tuy nhiên, chúng tôi biết rằng nó đáng tin cậy và cập nhật. Hơn nữa, cái này đi kèm với một khối chuyên dụng cho trình soạn thảo Gutenberg. Chưa kể đến một số thông số cho phép bạn cá nhân hóa trải nghiệm của mình, điều này khiến nó trở thành lựa chọn của chúng tôi cho loại tác vụ này.

Cú pháp highlighter plugin wordpress

Trong menu Tham số trong bảng điều khiển WordPress của bạn, bạn sẽ tìm thấy một mục mới được gọi là SyntaxHighlighter . Hãy tiếp tục và nhấp vào nó. Ở đó, bạn có thể điều chỉnh mọi thứ bạn cần để nhúng các đoạn mã vào trang web WordPress của mình.

Cài đặt cú pháp

Trang cài đặt cho plugin tương đối đơn giản. Một yếu tố đặc biệt mà chúng tôi thích về plugin này là bạn có được một số tùy chỉnh tốt về cách mã được hiển thị trên trang web của bạn. Bạn có thể thêm các lớp CSS vào nhúng, điều chỉnh phần đệm số hàng, chọn chủ đề màu, sử dụng các tab thông minh và ngắt dòng và quyết định xem có tải từng phần đánh dấu ngôn ngữ mã hóa hay không. trên toàn bộ trang web.

Cấu hình Syntaxhighlighter

Chúng tôi muốn xác định ba tham số cụ thể mà hầu hết mọi người nên biết.

Phiên bản plugin, số dòng và kích thước tab

Đầu tiên là bạn đang tải phiên bản plugin nào. Mặc dù plugin vẫn được cập nhật trong kho lưu trữ, bạn có thể chọn giữa các phiên bản 2.x và 3.x của trình cắm , tùy thuộc vào cách bạn muốn hiển thị mã của mình. Cả hai đều an toàn, tuy nhiên, chúng đều cung cấp các tính năng cụ thể mà cái kia không có (tại thời điểm viết bài).

Dễ dàng tạo trang web của bạn với Elementor

Elementor cho phép bạn dễ dàng tạo ra bất kỳ thiết kế trang web nào với một cái nhìn chuyên nghiệp. Ngừng trả tiền đắt cho những gì bạn có thể tự làm. [Miễn phí]

Nếu người dùng sao chép mã của bạn là quan trọng nhất, thì phiên bản 3.x sẽ làm được. Tuy nhiên, nếu tiện ích của bạn hữu ích hơn cho việc hiển thị so với tiện ích thực tế, thì dòng mới trong phiên bản 2.x có thể tốt hơn cho bạn, vì nó loại bỏ nhu cầu sử dụng thanh cuộn. cho các đoạn mã lớn.

Sau đó, bạn cần hiển thị hoặc không hiển thị số dòng. Đối với một lượng lớn mã và hướng dẫn, số dòng là vô giá. Tuy nhiên, khi bạn có các đoạn mã ngắn, không cần thiết phải gắn nhãn vĩnh viễn chúng thành dòng 1 và 2. Việc xóa chúng có thể cải thiện đáng kể sự xuất hiện của mã.

Và sau đó là kích thước tab vẫn còn nhiều tranh cãi. Tùy chọn mặc định là 4, nhưng bạn có thể thay đổi nó thành bất kỳ số nào bạn muốn. Bao gồm giá trị chính xác là 2. (Có, chúng tôi nhận ra rằng không có giá trị chính xác nào. Chúng tôi chỉ thích 2 dấu cách cho các tab.)

Mã và mã ngắn của bạn

Nếu bạn cuộn xuống cuối trang Tham số , bạn sẽ thấy bản xem trước của mã lớn, cũng như một số lượng lớn các tham số mã ngắn. Thời gian của bạn sẽ được dành để xem qua chúng, chỉ để xem tất cả những gì plugin có thể làm để giới thiệu các đoạn mã của bạn. Ngoài ra, bất kỳ thay đổi nào bạn đã thực hiện ở trên đối với hiển thị mã trong cài đặt ở trên sẽ được phản ánh ở đây. Vì vậy, hãy nhớ nhấn lưu sau khi thay đổi bất kỳ tùy chọn nào.

Bạn đang tìm kiếm các plugin và plugin WordPress tốt nhất?

Tải xuống các plugin và WordPress chủ đề tốt nhất trên Envato và dễ dàng tạo trang web của bạn. Đã tải xuống nhiều hơn 49.720.000. [ĐỘC QUYỀN]

Xem sửa đổi cú pháp divi

Mặc dù một số người không phải là người hâm mộ nhất của mã ngắn vì họ có thể liên kết bạn với một số plugin nhất định, nhưng chúng tôi nghĩ rằng những plugin này đáng sử dụng vì chúng thông minh và dễ nhớ. Nếu không có gì khác, bạn cần nhớ hai điều và sau đó plugin sẽ hoạt động tốt nhất cho bạn.

ou ou ou et...bien, vous obtenez</li><li></li></ul>

Hoặc một số biến thể. Nếu bạn có thể nhớ, bạn tự tin về những điều khác nhau bạn có thể làm với plugin này. Mặc dù bạn có thể sử dụng mã định danh dài, plugin SyntaxHighlighter được xây dựng đủ tốt để đơn giản hóa công việc của bạn.

Sử dụng mã ngắn

Bạn có thể sử dụng mã ngắn ở bất kỳ đâu bạn có thể sử dụng chúng. Trong Divi hoặc trình soạn thảo cổ điển, bạn có thể sử dụng mô-đun Văn bản hoặc trình soạn thảo TinyMCE và chỉ cần dán mã giữa các mã ngắn. Do cách hoạt động của tab Visual, chúng tôi khuyên bạn nên sử dụng Văn bản để giữ các định dạng ký tự đặc biệt.

Tham số văn bản Divi

Nếu bạn là người dùng Gutenberg / Block Editor, mọi thứ thật đơn giản. Bạn có thể, một lần nữa, sử dụng khối văn bản cho việc này. Dễ dàng hơn nữa là khối HTML tùy chỉnh. Như trên, hãy dán mã vào các thẻ mã ngắn.

Chặn html gutenberg divi

Tốt hơn, khối SyntaxHighlighter Evolved là chính nó. Cài đặt trình cắm thêm bao gồm khối Gutenberg của riêng nó; vì vậy, nếu bạn không phải là shortcode và không muốn làm rối tung các cài đặt, bạn không cần phải làm như vậy. Chỉ cần tìm khối dưới định dạng và chèn nó vào tin nhắn hoặc trang của bạn.

Cú pháp highliter gutenberg

Bất kể bạn chèn mã như thế nào, bạn sẽ thấy kết xuất tương tự ở mặt trước của trang web WordPress của bạn.

Dễ dàng tạo Cửa hàng trực tuyến của bạn

Tải xuống miễn phí WooCommerce, các plugin thương mại điện tử tốt nhất để bán các sản phẩm vật lý và kỹ thuật số của bạn trên WordPress. [Đề xuất]

Tóm tắt

Bạn có thể cần trình bày các đoạn trích cho khán giả của mình vì một số lý do. Có thể bạn viết hướng dẫn hoặc đăng các giải pháp cho các vấn đề phổ biến mà khán giả có thể thực hiện và sử dụng theo ý họ? Nhưng đôi khi tích hợp GitHub không cung cấp loại trải nghiệm bạn muốn cho người dùng của mình. Đây là lúc bạn cần một plugin như SyntaxHighlighter Evolved. 

Chỉ trong vài cú nhấp chuột, với một chút tùy chỉnh và khối Gutenberg hoặc shortcode, khán giả của bạn sẽ khám phá mã của bạn mà không gặp vấn đề gì.

Bài viết này chứa comments 0

Để lại một bình luận

Địa chỉ email của bạn sẽ không được công bố. Các trường bắt buộc được đánh dấu *

Trang web này sử dụng Akismet để giảm bớt không mong muốn. Tìm hiểu thêm về cách sử dụng dữ liệu nhận xét của bạn.

Trở lại đầu trang
1 cổ phiếu
cổ phiếu1
tweet
Enregistrer