7 En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak

İki tür kod düzenleyici vardır - Basit metin tabanlı düzenleyici ve WYSIWYG (ne görüyorsanız onu alırsınız). Önceki yazımızda, en iyilerinden bazılarını tartıştık.Açık Kaynak HTML Düzenleyicisi kodu manuel olarak yazdığınız yer. Metin tabanlı HTML editörleri ile ilgili herhangi bir sorun olmasa da, hiçbiri eski usul değildir. İşte burada WYSIWYG HTML düzenleyici açık kaynak devreye girer. WYSIWYG HTML düzenleyicileri, herhangi bir programlama bilgisi olmadan bir web sitesi oluşturmak için görsel tabanlı seçenekler sunar (Wix Reklamı, bu wizzy-sig'ı unutmayın)

WYSIWYG HTML editörü, metin tabanlı düzenleyicilere göre çeşitli avantajlara sahiptir. Başlangıç ​​olarak, kodlamayı bilmeseniz bile WYSIWYG editörleriyle bir web sitesi oluşturabilirsiniz. Tek yapmanız gereken, düzenleyicideki öğeleri sürükleyip bırakmaktır ve işiniz bittiğinde kodu kopyalamanız yeterlidir. Ancak, iyi bir açık kaynak kodlu WYSIWYG HTML editörü bulmak bir angarya olabilir. Biz burada devreye giriyoruz.

Ayrıca Oku: Google'dan Kurtulmak İstediğinizde 50+ Açık Kaynak Android Uygulaması

En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak

1. Pell

Pell muhtemelen şimdiye kadar karşılaşabileceğiniz en küçük ve en basit WYSIWYG editörüdür. Kelimenin tam anlamıyla 1.38 kb boyutunda!

Başlıklar, kalın, italik, listeler, alıntılar, bağlantılar ve resimler gibi tüm temel işlevleri ve biçimleri sunar. Diğer mevcut eylemler arasında girinti, üst simgeler, alt simgeler ve yazı tipi adı ve boyutu bulunur. Pell ile yazmayı ve biçimlendirmeyi bitirdikten sonra, tüm HTML kodunu çıkarır ve daha sonra web sitenize veya sayfanıza kopyalayıp yapıştırabilirsiniz ve gitmeniz iyi olur.

Artıları:

• En küçük ve en hafif WYSIWYG
• Bağımlılık yok
• Kolayca özelleştirilebilir

Eksileri:

• Süslü HTML düzenleme yok
• Yalnızca bağlantılar aracılığıyla görüntüler

Karar:
Pell, boyutuna göre ilgi çekici bir paket oluşturur. Ancak dürüst olalım, sınırlı düzenleme seçenekleriyle yalnızca temel HTML dosyalarını yapabilirsiniz. Öyleyse, bazı çok temel işler için açık kaynak olan hızlı ve hafif bir WYSIWYG editörü arıyorsanız, kesinlikle Pell'e bakın.

Pell'i alın

2. OpenWYSIWYG

OpenWYSIWYG, tamamen JavaScript ile kodlanmış, tarayıcılar arası zengin metinli bir HTML editörüdür. Yalnızca birkaç satır kodu kopyalayıp yapıştırarak, istediğiniz OpenWYSIWYG’nin güçlü WYSIWYG HTML düzenleyicisine.<p> <p>Açılır menülerle kullanıcı arayüzü ve düzenleme seçenekleri, herhangi bir metin düzenleyicininkine çok benzer ve kendinizi evinizde hissedeceksiniz. Tüm temel biçimlendirme seçeneklerinin yanı sıra, OpenWYSIWYG, aralarından seçim yapabileceğiniz 216 web rengi içeren gelişmiş bir renk seçiciye ve aklınıza gelebilecek her seçeneğe sahip güçlü bir tablo biçimlendirme aracına sahiptir.</p> <p>OpenWYSIWYG ile ilgili bir başka harika şey de, tüm görsel seçeneklerle birlikte,<strong>ham HTML kodunu görüntüle</strong> ve doğrudan kodda ayarlamalar yapın. Kodlama becerilerinizi öğrenmek veya yenilemek istediğinizde kullanışlıdır.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-2a8d34d0ca966deffc6441af9dbbe702-101381.jpg" alt="7 En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak"></p> <p><strong>Artıları:</strong></p> <ul> <li>Güçlü düzenleme ortamı</li> <li>Sezgisel ve kolay kullanıcı arayüzü</li> <li>Renk seçici ve kapsamlı tablo düzenleme seçenekleri</li> </ul> <p><strong>Eksileri:</strong></p> <ul> <li>Birkaç yıl içinde güncellenmedi</li> </ul> <p><strong>Karar:</strong><br> JavaScript ile yazılmış olan OpenWYSIWYG HTML editörü açık kaynak, diğer herhangi bir web programlama diliyle çalışmalıdır. Web uygulamanıza dahil etmek için Pell'den biraz daha güçlü bir şey arıyorsanız, bu harika bir seçenektir.</p> <p><strong>OpenWYSIWYG'yi Edinin</strong></p> <h3>3. TinyMCE (Topluluk Sürümü)</h3> <p>Listemizdeki bir sonraki açık kaynaklı HTML WYSIWYG editörü TinyMCE'dir. Ayrıca tamamen JavaScript ile yazılmıştır ve çoğu kelime işlemcisi gibi bir kullanıcı arayüzü ve deneyim sunar. Bu onu daha kullanıcı dostu yapar.</p> <p>TinyMCE ücretsiz değildir, ancak Community Edition ücretsiz ve açık kaynak kodludur. Metni biçimlendirme, listeler, tablolar ve ayrıca bazı görüntü düzenleme seçenekleri gibi tüm temel düzenleme seçenekleriyle birlikte gelir.</p> <p>Geliştiriciler, premium modellerin fiyatlarını kullanıcı sayısına göre tutmuşlardır. Bazı premium özellikler arasında Google Drive ve Microsoft Azure desteği, uzantılar, yazım ve bağlantı denetleyici ve teknik destek bulunur.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-35ef757e6374c689f5158bf25ea8b2c6-101381.jpg" alt="Önceden programlama deneyimine sahipseniz ve öğrenmek için zamanınız yoksa, bir WYSIWYG HTML editörü açık kaynak kullanarak kesinlikle kurtulabilirsiniz. Ancak, iyi bir WYSIWYG HTML Düzenleyicisi bulmak o kadar kolay değildir, özellikle de ücretsiz ve açık kaynak olması gerekiyorsa."></p> <p><strong>Artıları:</strong></p> <ul> <li>Uzatma desteği</li> <li>Dosya yönetimi</li> <li>Teknik Destek</li> <li>HTML için IDE tarzı kod düzenleyici</li> </ul> <p><strong>Eksileri:</strong></p> <ul> <li>Pahalı</li> <li>Tamamen açık kaynak değil</li> </ul> <p><strong>Karar:</strong><br> TinyMCE, kolay entegrasyon seçeneği, kullanıcı dostu kullanıcı arayüzü ve çok sayıda özelliği ile eksiksiz bir pakettir. Yalnızca en zengin özelliklere sahip WYSIWYG HTML düzenleyicisinin açık kaynağını istiyorsanız ve biraz para harcamakta sorun yoksa, TinyMCE gitmenin yoludur. Ayrıca, Pro modelleri için her zaman kontrol edebileceğiniz bir aylık ücretsiz deneme sunarlar.</p> <p><strong>TinyMCE Demosunu Edinin</strong></p> <h3>4. Jodit</h3> <p>Jodit, kodunuza ekleyebileceğiniz ve sayfanızı düzenlemeye başlayabileceğiniz başka bir hızlı ve hafif WYSIWYG HTML editörü açık kaynak editörüdür. Yaklaşık 100 KB boyutunda oldukça hafiftir ve tamamen TypeScript ile yazılmıştır. Bu yüzden çalıştırmak için herhangi bir bağımlılığa veya kitaplığa ihtiyacınız yoktur.</p> <p>Görüntü için de sürükle bırak arayüzü ile birlikte gelir. Ayrıca bir bağlantı yoluyla YouTube veya Vimeo videoları ekleyebilir veya bunları gömebilirsiniz. Jodit hakkında sevdiğim en iyi şey, bir <strong>ACE editörü</strong> kutunun dışında ve tek bir düğmeyle, gerçek kod ve ön izleme modu arasında geçiş yapabilirsiniz.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-d9f6924fe440a4261e0839c0c4b1c532-101381.jpg" alt="html, wysiwyg, düzenleme, seçenekler, açıklık, editopenurce, artılar, kod, metin, eksiler, destek, düzenleyiciler, tabanlı, karar, önyükleme"></p> <p><strong>Artıları:</strong></p> <ul> <li>Hafif, kitaplık yok</li> <li>Sürükle ve bırak</li> <li>Kutudan çıkan ACE editörü</li> <li>Teknik destek (Ücretli)</li> </ul> <p><strong>Karar:</strong><br> Jodit, her iki dünyanın en iyisini sunar - kolay görsel WYSIWYG editörü ve ham kodu düzenleme. En azından biraz HTML bilgisine sahip biriyseniz, Jodit sizin için en iyi seçenek olabilir.</p> <p><strong>Jodit Playground'u edinin</strong></p> <h3>5. Özet</h3> <p>Summernote, jQuery üzerine kurulu ve Bootstrap tabanlı süper basit bir WYSIWYG editörü açık kaynaktır. Bootstrap'i desteklediğinden, tüm desteklenen stilleri ve temaları Bootswatch'tan editörünüzde kullanabilirsiniz.</p> <p>WYSIWYG HTML editörü açık kaynak kodunun kendisi çok temiz ve minimal bir kullanıcı arayüzüne sahiptir ve hatta ihtiyacınıza göre biçimlendirme seçeneklerini düzenleyebilir veya ekleyebilirsiniz. Summernote’un Air-modu ile tüm araç çubuğunu gizleyebilir ve belgenizi anında düzenleyebilirsiniz. Kullanışlı. Ayrıca tüm görüntüleri otomatik olarak base64'e dönüştürebilir, böylece görüntü işlemeyi hiç yapmanız gerekmez.</p> <p>Bana göre Summernote'un en iyi yanı, her zaman topluluğu dinleyen ve yeni özellikler ekleyen, arkasındaki çalışkan geliştiriciler ekibidir. Örnekler arasında eklentiler için destek ve Bootstrap gerektirmeyen Summernote'un lite veya vanilya versiyonu yer alır.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-d48b6067378fbbbed4746fb15a5e64e8-101381.jpg" alt="7 En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak"></p> <p><strong>Artıları:</strong></p> <ul> <li>Minimum öğrenme eğrisi</li> <li>Anında düzenleme için Hava Modu</li> <li>Bootstrap 3.x.x - 4.x.x'i destekler</li> <li>HTML olarak görüntüleyin ve düzenleyin</li> </ul> <p><strong>Eksileri:</strong></p> <ul> <li>Bootstrap gerektirir</li> </ul> <p><strong>Karar:</strong><br> Summernote, muhtemelen piyasadaki en zengin özelliklere sahip ancak ücretsiz ve açık kaynaklı WYSIWYG HTML editörüdür ve sürekli olarak gelişmektedir. Bootstrap ile çalışıyorsanız, Summernote hiç akıllıca değil ama siz olmasanız bile Summernote kontrol edilmeyi hak ediyor.</p> <p><strong>Summernote Demosunu Edinin</strong></p> <h3>6. Froala</h3> <p>Froala, JavaScript ile yazılmış güzel bir WYSIWYG HTML editörü açık kaynaktır. Bu listedeki en popüler araçlardan biridir ve geliştiriciler arasındaki popülerliği, kolay entegrasyonu ve temiz tasarımı ile ilişkilendirilebilir.</p> <p>Froala kendi başına çok güçlü bir editördür ve geniş sayısız eklenti sadece aynı oranda artmıştır. Bazılarında gelişmiş bir resim düzenleyici, ifadeler, yazım denetleyici bulunur ve kendi eklentinizi oluşturmak bile kolaydır. Tüm araçlara, son derece kullanışlı olan satır içi düzenleyici ile de erişilebilir.</p> <p>TinyMCE gibi, Froala da pek çok tatta mevcuttur, ancak ücretsiz sürüm bile bol miktarda yumruk barındırır. Tek fark, tam kaynak kodunu ve teknik desteği alamayacak olmanızdır.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-5a89ec944a7b7318dad29d4cbe38303c-101381.jpg" alt="7 En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak"></p> <p><strong>Artıları:</strong></p> <ul> <li>Hafif, güçlü düzenleyici</li> <li>Satır içi düzenleme</li> <li>Çok sayıda eklenti</li> </ul> <p><strong>Eksileri:</strong></p> <ul> <li>Mobil hibrit uygulama / web sitesi için harika değil</li> </ul> <p><strong>Karar:</strong><br> Froala, güzel bir kullanıcı arayüzü ile hızlı ve hafiftir, ancak yine de bir WYSIWYG HTML düzenleyicide aranabilecek tüm özellikleri getirmeyi başarır. Kaynak kodu ve destek olmadan iyiyseniz, ücretsiz sürüm size gayet iyi hizmet edecek, yoksa ne yapacağınızı biliyorsunuz.</p> <p><strong>Froala'yı alın</strong></p> <h3>7. CKEditor</h3> <p>CKEditor, güzel tasarlanmış bir WYSIWYG HTML editörü açık kaynak olduğu için kullanıcılar arasında oldukça popülerdir. Kullanıcı dostu bir düzende HTML öğrenmenize yardımcı olmak için 21.000'den fazla testle birlikte gelir. Becerilerinizi daha da geliştirmenize yardımcı olmak için ayrıntılı belgeler mevcuttur. Teknoloji endüstrisindeki en büyük isimlerden bazıları buna güveniyor.</p> <p>Her dosyadaki telif hakkı bildirimlerini olduğu gibi tutmanız ve CKEditor kurulum klasöründe bulunan LICENSE.md dosyasını silmemeniz gerektiğini unutmayın. Bu bir dezavantaj değildir, özellikle karşılığında çok fazla değer elde ettiğinizde.</p> <p>Eklentiler, @bahsetme, emojiler, eski tarayıcılar ve hatta çok zaman kazandıran otomatik tamamlama desteği vardır.</p> <p><img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-f7cf4bbbed846085854eb05d6236462e-101381.png" alt="Önceden programlama deneyimine sahipseniz ve öğrenmek için zamanınız yoksa, bir WYSIWYG HTML editörü açık kaynak kullanarak kesinlikle kurtulabilirsiniz. Ancak, iyi bir WYSIWYG HTML Düzenleyicisi bulmak o kadar kolay değildir, özellikle de ücretsiz ve açık kaynak olması gerekiyorsa."></p> <p><strong>Artıları:</strong></p> <ul> <li>Ayrıntılı dokümantasyon, testler, sorular</li> <li>İşbirliği ve @bahsetme</li> <li>Otomatik tamamlama</li> </ul> <p><strong>Eksileri:</strong></p> <ul> <li>Lisans dosyasını sakla</li> </ul> <p><strong>CKEditor'ı alın</strong></p> <p><strong>Onursal sözler:</strong></p> <p>1. MediumEditor, Medium.com için satır içi WYSIWYG editörünün açık kaynaklı bir klonudur. Son derece basit, hafif ve herhangi bir bağımlılık olmadan geliyor. O kadar güçlü olmasa da, metin veya metinle ilgili belgeler için harika bir satır içi düzenleme aracı olarak işlev görebilir.</p> <p>2. Atom’un HTML Önizleme paketi, HTML kodunuzun canlı önizlemesine sahip olabileceğiniz ve geliştiriciler için çok yararlı olabilecek bir önizleme bölmesi eklemenize olanak tanır. Bu kesinlikle yeni başlayanlar için olmasa da, zaten HTML olarak programlama yapıyorsanız mevcut iş akışınıza eklemek için harika bir pakettir.</p> <h3>En İyi WYSIWYG HTML Düzenleyicisi Açık Kaynak</h3> <p>HTML hala bir web sitesi oluşturmanın daha güçlü yolu ve onunla çok daha karmaşık şeyler mümkün olsa da, WYSIWYG editörleri kendilerine ait bir yer buldular. Kod yazmayı öğrenmek çok fazla zaman ve enerji yatırımı gerektirir ve herkes için bir anlam ifade etmeyebilir. Önceden programlama deneyiminiz varsa ve öğrenmek için zamanınız yoksa, bir WYSIWYG HTML editörü açık kaynak kullanarak kesinlikle kurtulabilirsiniz.</p> <p><strong>Ayrıca Oku:</strong> <a href="/7-best-open-source-browser-for-android-2018-100540" target="_blank">Android için 7 En İyi Açık Kaynak Tarayıcı (2018)</a></p>