JCE / TinyMCE - Tiếp tục cố gắng sửa lỗi HTML hợp lệ và không hợp lệ


9

Trong tất cả các trình soạn thảo Joomla chúng tôi đã sử dụng, JCE phù hợp nhất với mục đích và khách hàng của chúng tôi. Nhưng có một vài vấn đề với trình soạn thảo có thể gây ra sự cố khi chúng tôi mã hóa một cái gì đó, sau đó nó được chuyển sang wysiwyg và trình chỉnh sửa cố gắng 'sửa chữa' html hoàn toàn hợp lệ của chúng tôi.

Trước khi bạn đặt câu hỏi - có, chúng tôi đã đặt nó để cho phép tất cả các yếu tố mà JCE thích hạn chế, và không, nó KHÔNG được đặt để xác thực / dọn sạch html. Những hạn chế duy nhất chúng tôi có là dán nội dung vào trình chỉnh sửa.

Triển lãm A:

<a href="#"></a>

Điều này sẽ biến mất trên trình chỉnh sửa bật và trở lại. Thay thế bằng:

<p>&nbsp;</p>

Triển lãm B:

<a id="#nameofanchor"></a>

Thay đổi:

<p>&nbsp;</p>

Triển lãm C:

<div><a id="#nameofanchor"></a></div>

Thay đổi:

<div>&nbsp;</div>

Triển lãm D:

<a id="hello" class="link">Hello</a>

Thay đổi:

<p><a id="hello" class="link"></a>Hello</p>

Triển lãm E:

<a href="#">
<div>
<h2>Our Work</h2>
</div>
</a>

Thay đổi:

<p><a href="#"></a></p>
<div>
<h2><a href="#">Our Work</a></h2>
</div>
<p>&nbsp;</p>

Bây giờ, chúng tôi muốn sử dụng id thay vì tên cho neo của chúng tôi, vì nó hợp lệ trong HTML5, trong khi tên về mặt kỹ thuật thì không. Ngoài ra, trong vũ trụ nào id là một sự gán không hợp lệ cho một liên kết?

Ngoài ra, bây giờ việc bọc một div bằng các liên kết là hoàn toàn hợp pháp, tại sao JCE cũng loại bỏ chúng?

Đây có phải là một thiết lập tôi đang thiếu? Có ai có cái nhìn sâu sắc về cách tôi có thể sử dụng trình soạn thảo để chúng tôi có thể viết mã khi chúng tôi cần trong trình chỉnh sửa, nhưng khách hàng của chúng tôi không thể phá hỏng nó chỉ bằng cách lưu trong wysiwyg?

Chỉnh sửa: Tôi đã thử nghiệm điều này trong chrome, firefox và safari. Đừng nghĩ nó có liên quan gì đến trình duyệt.

Chỉnh sửa: Tôi đã kiểm tra điều này với các cài đặt container. Cả Container Đoạn & Đoạn trên Enter và Div Container & Div khi nhập đều gây ra điều này. Hai cái còn lại, Không có container & Đoạn khi nhập, Không có Container & ngắt dòng khi nhập, không gây ra nó. Vấn đề là - Tôi cần cài đặt đầu tiên! Càng nhiều càng tốt khi mang đến cho khách hàng lợi ích của sự nghi ngờ, đơn giản là họ không thể tin tưởng để làm theo hướng dẫn và thêm định dạng đoạn văn vào văn bản của họ.

Xác nhận: Điều này cũng xảy ra với TinyMCE.

Vì vậy - chúng tôi biết nguyên nhân gây ra điều này - cài đặt Parallel Container - bây giờ làm thế nào để chúng tôi có được xung quanh nó trong khi giữ cho cài đặt đó tồn tại?


1
Vui mừng không chỉ tôi.
Craig

Sau các cuộc thảo luận trước đây của chúng tôi và kết luận rằng điều này đến từ tính năng gói phần tử JCE, tôi không chắc đây thực sự là một mối quan tâm. Nếu bạn tin tưởng khách hàng của mình có thể thêm đoạn mã html như trên, bằng cách chuyển trạng thái trình chỉnh sửa, tại sao bạn không tin tưởng họ rằng họ sẽ bọc nội dung của họ bằng các thẻ <p> phù hợp?
FFrewin

Khách hàng của chúng tôi không thêm html. CHÚNG TÔI viết html, họ sử dụng phía biên tập viên - ngay khi trình soạn thảo được bật, nó phá hỏng html hoàn toàn hợp lệ của chúng tôi.
Faye

Trong mọi trường hợp, nếu bạn cấp quyền truy cập chỉnh sửa một trang chứa đầy html cho khách hàng, thì bằng cách này hay cách khác, có khả năng lớn là khách hàng có thể phá hủy html của bạn. Điều gì về việc sử dụng Trình quản lý mẫu của JCE hoặc các thẻ "macro" khác, sẽ thực hiện công việc bẩn khi thêm đánh dấu bạn cần?
FFrewin

Câu trả lời:


7

Tôi sử dụng JCE Editor trên tất cả các trang web của chúng tôi, nhưng chúng tôi cũng đã bắt đầu cài đặt Sourcerer bởi NoNumbers. Điều này cung cấp một nút INSERT CODE dễ dàng cho trình soạn thảo JCE để bảo vệ nó khỏi bị sửa đổi.

http://www.nonumber.nl/extensions/sourcerer


CẢM ƠN BẠN. Điều này là hoàn hảo, chúng tôi đã cài đặt nonumber trên công cụ của chúng tôi bởi vì nó thật tuyệt vời, tôi không biết nó có cái này. Đây là hoàn hảo.
Faye

1
Không cần sử dụng Sourcerer để thêm HTML.
BodgeIT

Aaaand tôi phải, hoặc JCE loại bỏ HTML hoàn toàn hợp lệ.
Faye

2

Có một số cài đặt bí mật cho JCE. Tôi biết cài đặt sau dừng lại &nbsp;được thêm vào div trống, có thể được sử dụng để xóa phao, điều này gây ra các vấn đề về chiều cao dòng khi được hiển thị:

In the Editor Global Configuration, add:
remove_div_padding:1 
to Custom Configuration Variables. 

Tôi hy vọng sẽ có nhiều hơn có thể kiểm soát bất kỳ khía cạnh nào của trình soạn thảo.


1

Tôi nghĩ rằng nó phải là cài đặt kiểu chữ trong: Hồ sơ -> Thông số Trình chỉnh sửa -> Kiểu chữ . Hãy thử đặt Phần tử chứa & Nhập khóa thành NoContainer & LineBreak trên Enter để xem liệu nó có còn áp dụng bất kỳ thay đổi nào đối với html của bạn không.

Cũng nên nhớ rằng cài đặt Xác thực HTML có cài đặt cho từng cấu hình Trình chỉnh sửa và Joomla cũng cung cấp bộ lọc toàn cầu trong trang cấu hình toàn cầu do nhóm người dùng đặt. Hãy chắc chắn rằng không có cài đặt nào cho mỗi nhóm người dùng.


Vâng, tôi đã ở trong tất cả các hồ sơ biên tập, v.v. Tôi đã thiết lập tất cả chính xác cho không có html. Thay đổi container có thể giải quyết nó - nhưng nó sẽ gây ra một vấn đề khác, tương tự như vấn đề. Nếu khách hàng có thể thêm nội dung văn bản không được bọc trong thẻ đoạn văn thì định dạng văn bản của họ sẽ khác. Chúng tôi cũng không muốn điều đó. Tôi sẽ kiểm tra xem liệu điều đó có gây ra vấn đề tương tự với neo hay không, nhưng theo như các thẻ đoạn tự thêm vào, đó là loại tương đương với khóa học.
Faye

Vâng, đó là cài đặt bộ chứa thực hiện - nhưng như tôi đã nói, đó là vấn đề lớn hơn đối với khách hàng của chúng tôi không thể dán và có thẻ đoạn tự động bao bọc nội dung của họ.
Faye

Tôi nghĩ điều này đang xảy ra bởi vì các ví dụ mã của bạn chứa các ngắt dòng, đây là một loại "quy tắc" để JCE tạo các đoạn văn. Cần có một tiêu chí như vậy để thực hiện điều này. Là khách hàng của bạn sẽ dán đoạn mã html như vậy trong trình chỉnh sửa?
FFrewin

Khách hàng của chúng tôi sẽ không sử dụng html, nhưng chúng tôi vẫn viết mã với html đằng sau những gì họ làm. Chúng tôi tạo các khu vực để họ dán / nhập nội dung thẳng vào. Ngoài ra - nếu bạn muốn gõ html trong một dòng thay vì tổ chức như trên, tôi cũng đã thử điều đó. Tôi nhận được kết quả chính xác như nhau.
Faye

0

Hành vi này không phải là duy nhất đối với JCE. TinyMCE hành xử theo cùng một cách. Hành vi này có thể không giới hạn ở TinyMCE, nó có thể là hành vi DOM của trình duyệt.

JCE thực sự gặp rắc rối khi cố gắng giữ một số thẻ trống, phương pháp được sử dụng là đệm với một khoảng trắng.

https://github.com/widgetfactory/jce-editor/blob/master/editor/tiny_mce/plugins/cleanup/editor_plugin.js


Không nói dối, tôi không biết điều này có nghĩa là gì. Bạn có thể phá vỡ nó thêm một chút? Tôi đang nhìn gì trong liên kết đó? Bạn có ý nghĩa gì với pad với một không gian? Thêm một không gian không phá vỡ vào các ví dụ mã ở trên không làm thay đổi kết quả cuối cùng, tôi đã kiểm tra kỹ lưỡng.
Faye

Tôi đã chuyển trình soạn thảo mặc định của mình sang TinMCE, trình soạn thảo được cài đặt sẵn với Joomla và đã thử nghiệm Phụ lục A. Nó cũng xóa các thẻ khi chuyển đổi giữa trình soạn thảo WYSIWYG và chế độ xem Nguồn. tức là hành vi này dường như không phải là duy nhất đối với JCE. Do đó, tôi tự hỏi liệu điều này có phải là duy nhất đối với TinyMCE không, và có lẽ điều tương tự cũng có thể xảy ra khi sử dụng khả năng của trình duyệt để thực hiện chỉnh sửa tại chỗ. Tham chiếu mã JCE là dòng 129 trong đó một không gian không phá vỡ được sử dụng giữa các thẻ bắt đầu và kết thúc. Điều đó làm việc cho tôi trong cả JCE và TinyMCE. Lạ thật.
Peter Wiseman
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.