JCE / TinyMCE - Terus berusaha Memperbaiki HTML yang Valid & Tidak Valid


9

Dari semua editor Joomla yang kami gunakan, JCE paling sesuai dengan tujuan dan klien kami. Tetapi ada beberapa masalah dengan editor yang dapat menyebabkan masalah ketika kita membuat kode sesuatu, kemudian beralih ke wysiwyg dan editor mencoba untuk 'memperbaiki' html kita yang benar-benar valid.

Sebelum Anda mengajukan pertanyaan - ya, kami telah menetapkannya untuk mengizinkan semua elemen yang suka dibatasi oleh JCE, dan tidak, itu TIDAK diatur untuk memvalidasi / membersihkan html. Satu-satunya batasan yang kami miliki adalah menempelkan konten ke editor.

Pameran A:

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

Ini akan hilang di toggling editor dan kembali. Digantikan dengan:

<p>&nbsp;</p>

Pameran B:

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

Perubahan ke:

<p>&nbsp;</p>

Pameran C:

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

Perubahan ke:

<div>&nbsp;</div>

Pameran D:

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

Perubahan ke:

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

Pameran E:

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

Perubahan ke:

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

Sekarang, kami ingin menggunakan id bukan nama untuk jangkar kami, karena itu berlaku di bawah HTML5, sedangkan nama secara teknis tidak. Juga, di jagat raya apa id tugas yang tidak valid untuk sebuah tautan?

Juga, sekarang benar-benar sah untuk membungkus div dengan tautan, mengapa JCE juga akan menghapusnya?

Apakah ini hanya pengaturan yang saya lewatkan? Adakah yang memiliki wawasan tentang bagaimana saya dapat menggunakan editor sehingga kami dapat membuat kode sesuai kebutuhan di editor, tetapi klien kami tidak dapat merusaknya hanya dengan menyimpan di wysiwyg?

Sunting: Saya sudah menguji ini di chrome, firefox dan safari. Jangan berpikir itu ada hubungannya dengan browser.

Sunting: Saya sudah menguji ini dengan pengaturan wadah. Kedua Paragraph Container & Paragraph pada Enter dan Div Container & Div on enter menyebabkan hal ini. Dua lainnya, Tidak ada wadah & Paragraf masuk, Tidak Ada Wadah & linebreak saat masuk, jangan menyebabkannya. Masalahnya adalah - Saya perlu pengaturan pertama! Sebaiknya memberi manfaat pada klien dengan keraguan, mereka tidak bisa dipercaya untuk mengikuti instruksi dan menambahkan format paragraf ke teks mereka.

Dikonfirmasi: Ini juga terjadi dengan TinyMCE.

Jadi - kita tahu apa yang menyebabkan ini - pengaturan Kontainer Paragraf - sekarang bagaimana kita mengatasinya sambil mempertahankan pengaturan itu tetap hidup?


1
Senang bukan hanya aku.
Craig

Setelah diskusi kami sebelumnya dan kesimpulan bahwa ini berasal dari fitur pembungkus elemen JCE, saya tidak yakin apa ini sebenarnya menjadi perhatian. Jika Anda mempercayai pelanggan Anda untuk dapat menambahkan cuplikan html seperti di atas, dengan mengubah status editor, mengapa Anda tidak akan mempercayai mereka bahwa mereka akan membungkus konten mereka dengan tag <p> yang sesuai?
FFrewin

Klien kami tidak menambahkan html. KAMI menulis html, mereka menggunakan sisi editor - segera setelah editor beralih, itu merusak html kami yang benar-benar valid.
Faye

Bagaimanapun, jika Anda memberikan akses edit dari halaman penuh html ke pelanggan, maka dengan satu atau lain cara, ada kemungkinan besar bahwa pelanggan dapat menghancurkan html Anda. Bagaimana dengan menggunakan Manajer Template JCE, atau tag "makro" lainnya, yang akan melakukan pekerjaan kotor dengan menambahkan markup yang Anda butuhkan?
FFrewin

Jawaban:


7

Saya menggunakan Editor JCE di semua situs kami, tetapi kami sudah mulai menginstal Sourcerer oleh NoNumbers. Ini memberikan tombol INSERT CODE yang mudah untuk editor JCE yang melindunginya dari modifikasi.

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


TERIMA KASIH. Ini sempurna, kami sudah memiliki nomor yang belum diinstal pada barang-barang kami karena itu fantastis, saya tidak tahu itu punya ini. Ini sempurna.
Faye

1
Seharusnya tidak perlu menggunakan Sourcerer untuk menambahkan HTML.
BodgeIT

Aaaand saya harus, atau JCE menghapus HTML yang benar-benar valid.
Faye

2

Ada beberapa pengaturan rahasia untuk JCE. Saya tahu pengaturan berikut ini berhenti &nbsp;ditambahkan ke divs kosong, mungkin digunakan untuk menghapus float, yang menyebabkan masalah ketinggian garis saat diterjemahkan:

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

Saya berharap ada lebih banyak yang dapat mengontrol segala aspek editor.


1

Saya pikir itu harus menjadi pengaturan tipografi di: Profil -> Parameter Editor -> Tipografi . Cobalah untuk mengatur Elemen Kontainer & Masukkan Kunci ke NoContainer & LineBreak pada Enter untuk melihat apakah itu masih menerapkan perubahan apa pun pada html Anda.

Juga ingat bahwa pengaturan Validasi HTML memiliki pengaturan untuk setiap profil Editor dan bahwa Joomla juga menyediakan filter global di halaman konfigurasi global yang ditetapkan oleh usergroup. Pastikan tidak ada pengaturan di sana untuk setiap grup pengguna.


Ya saya telah di semua profil editor, dll. Saya sudah mengatur semuanya dengan benar tanpa html. Mengubah wadah mungkin menyelesaikannya - tetapi itu akan menyebabkan masalah lain, sama-sama bermasalah. Jika klien dapat menambahkan konten teks yang tidak dibungkus dengan tag paragraf, maka format teks mereka akan berbeda. Kami juga tidak menginginkan itu. Saya akan mengujinya untuk melihat apakah itu menyebabkan masalah yang sama dengan jangkar, tetapi sejauh tag paragraf menambahkan sendiri, itu semacam par untuk kursus.
Faye

Ya itu adalah pengaturan wadah yang melakukannya - tetapi seperti yang saya katakan, ini adalah masalah yang lebih besar bagi klien kami yang tidak dapat menempel dan meminta tag paragraf otomatis untuk membungkus konten mereka.
Faye

Saya pikir ini terjadi karena contoh kode Anda berisi jeda baris, yang merupakan semacam "aturan" bagi JCE untuk membuat paragraf. Harus ada kriteria seperti itu untuk membuat ini. Apakah pelanggan Anda akan menempelkan cuplikan html tersebut di editor?
FFrewin

Klien kami tidak akan menggunakan html, tetapi kami masih membuat kode dengan html di belakang apa yang mereka lakukan. Kami membuat area untuk mereka tempel / ketik konten langsung ke. Juga - jika Anda maksud mengetik html dalam satu baris alih-alih terorganisir seperti di atas, saya sudah mencobanya juga. Saya mendapatkan hasil yang sama persis.
Faye

0

Perilaku ini tidak unik untuk JCE. TinyMCE berperilaku dengan cara yang sama. Perilaku ini mungkin tidak terbatas pada TinyMCE, itu bisa menjadi perilaku DOM browser.

JCE benar-benar pergi ke masalah mencoba untuk menyimpan beberapa tag kosong, metode yang digunakan adalah dengan mengisi spasi.

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


Tidak akan berbohong, saya tidak tahu apa artinya ini. Bisakah Anda memecahnya sedikit lebih banyak? Apa yang saya lihat di tautan itu? Apa maksudmu pad dengan spasi? Menambahkan ruang nonbreaking ke contoh kode di atas tidak mengubah hasil akhir, saya mengujinya secara menyeluruh.
Faye

Saya beralih editor default saya ke TinMCE, yang datang pra-instal dengan Joomla, dan menguji Tampilan A. Ini juga menghapus tag ketika beralih antara editor WYSIWYG dan pandangan Sumber. ie Perilaku ini tampaknya tidak unik untuk JCE. Karenanya, saya bertanya-tanya apakah ini juga tidak unik untuk TinyMCE, dan mungkin hal yang sama terjadi ketika menggunakan kemampuan browser untuk melakukan pengeditan di tempat. Referensi kode JCE adalah baris 129 di mana ruang tanpa-putus digunakan antara tag awal dan akhir. Itu bekerja untuk saya di JCE dan TinyMCE. Aneh.
Peter Wiseman
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.