Addon 2x Code - Cải tiến trình soạn thảo Code XenForo 2 2.2.0.1

PVS

Super Moderator
Thành viên BQT
Code - Cải tiến trình soạn thảo Code XenForo 2 2.2.0.1

Addon này làm cho code bbcode và trình soạn thảo code có nhiều chức năng hơn bằng cách thêm các nút sao chép, mở rộng, thu gọn, thanh chỉnh sửa, số dòng code và khả năng đánh dấu các dòng.

CodeLogotype.png

Đây là một addon mã nguồn mở. Truy cập kho lưu trữ GitHub để biết mã nguồn.

func_features.png

Đánh dấu tiêu đề và dòng tùy chỉnh

Bây giờ bạn có thể chỉ định tiêu đề header block code tùy chỉnh. Ví dụ: người dùng có thể cung cấp tên tệp cho các block code thay vì viết nó dưới dạng văn bản hoặc đặt toàn bộ block code bên trong một trình hướng dẫn có tiêu đề tên tệp.

Hơn nữa, bạn thậm chí có thể làm nổi bật các dòng nhất định!

Tiêu đề tùy chỉnh và các dòng cần đánh dấu có thể được đặt qua hộp thoại "Insert code":

highlight_lines_text_field.png

Bạn cũng có thể đặt tiêu đề và các dòng để đánh dấu trực tiếp trong trình soạn thảo văn bản bằng cách thêm các tham số title="..."highlight="..." trong code bbcode.

Ví dụ: [code lang="php" title="My Custom Title"]<? .... ?>[/code] sẽ tạo ra block code này:

1535718915924.png

Di chuột qua tiêu đề tùy chỉnh sẽ hiển thị ngôn ngữ code:

1535719001075.png

Ví dụ về đánh dấu: [code lang="php" highlight="2, 5-8"]a log of code...[/code]

highlighted_code_example.png

Các nút Mở rộng/Thu gọn

Nút mở rộng tăng chiều cao của block code một cách trơn tru cho đến khi tất cả code hiển thị. Nó chỉ hiển thị khi chiều cao block code ÍT hơn kích thước code thực tế.

Nút thu gọn giảm chiều cao của block code xuống chiều cao mặc định một cách trơn tru mà bạn có thể đặt trong style properties. Nó chỉ hiển thị khi chiều cao block code LỚN hơn chiều cao block code mặc định.

expand-collapse.gif

Cả nút mở rộng và nút thu gọn đều hiển thị khi chiều cao block code nằm trong giới hạn tối thiểu và tối đa và không hiển thị trên các block code nhỏ hơn chiều cao block code mặc định.

Chiều cao mặc định của block code có thể được đặt trong style properties (Phần "Code" bên dưới "Messages"):

1535723219891.png

Nút sao chép

Nút sao chép chỉ cần sao chép code ngay vào khay nhớ tạm của bạn:

copy.gif

Số dòng

Tất cả các block code đều có số dòng (tối đa 1000 dòng). Số dòng có thể được tắt thông qua style properties:

1535721681160.png

Thay đổi kích thước

Mỗi block code có chiều cao code lớn hơn chiều cao mặc định đều có thanh điều chỉnh. Nó cho phép người dùng thay đổi kích thước block code theo chiều dọc:

resizer.gif

Ngôn ngữ phổ biến

Với addon giờ đây, bạn có thể đặt các ngôn ngữ phổ biến ngay sau tùy chọn "Allowed code languages" trong nhóm tùy chọn "Messages":

1535723658651.png


1535723826755.png

Ngôn ngữ mặc định

Bạn cũng có thể đặt ngôn ngữ code mặc định cho hộp thoại "Insert code" qua tùy chọn "Default code language" sau các ngôn ngữ phổ biến trong nhóm tùy chọn "Messages":

1535743202787.png

Class CSS block code tùy chỉnh

Có một tùy chọn để thêm một class CSS tùy chỉnh cho block code. Chỉ cần chỉ định thuộc tính BBcode class="..." cho điều đó. Bây giờ bạn có thể tạo kiểu cho các block code với class này. Đây là một ví dụ:

custom_code_block_styling.png

Chúc các bạn thành công.


Nguồn: xenforo.com​
 

Đính kèm

Back
Top