7 Bedste WYSIWYG HTML Editor Open Source

Der er to slags kodeditorer - Enkel tekstbaseret editor og WYSIWYG (hvad du ser er hvad du får). I vores tidligere artikel diskuterede vi nogle af de bedsteOpen Source HTML Editor hvor du indtaster koden manuelt. Selvom der ikke er nogen problemer med de tekstbaserede HTML-redaktører, er de ikke desto mindre old-school. Og det er her WYSIWYG HTML-editor open source kommer ind. WYSIWYG HTML-redaktører giver visuelt baserede muligheder for at opbygge et websted uden nogen programmeringsviden (husk Wix-annoncen, det er wizzy-sig)

WYSIWYG HTML-editor har flere fordele i forhold til de tekstbaserede redaktører. Til at begynde med kan du oprette et websted med WYSIWYG-redaktører, selvom du ikke ved, hvordan du koder. Alt du skal gøre er at trække og slippe emner i editoren, og når du er færdig, skal du bare kopiere koden. At finde en god open source WYSIWYG HTML-editor kan dog være en opgave. Det er her, vi kommer ind.

Læs også: 50+ Android-apps med open source, når du vil trække Google

Bedste WYSIWYG HTML Editor Open Source

1. Pell

Pell er sandsynligvis den mindste og enkleste WYSIWYG-editor, som du nogensinde vil komme på tværs af. Det er bogstaveligt talt 1,38 kb i størrelse!

Det tilbyder alle de grundlæggende funktionaliteter og formater som overskrifter, fed, kursiv, lister, citater, links og billeder. Andre tilgængelige handlinger inkluderer indrykning, overskrift, abonnement og skrifttypenavn og -størrelse. Når du er færdig med at skrive og formatere med Pell, udsender den hele HTML-koden, som du derefter kan kopiere og indsætte på dit websted eller din side, så er du klar til at gå.

Fordele:

Mindste og letteste WYSIWYG
Ingen afhængigheder
Let tilpasselig

Ulemper:

Ingen fancy HTML-redigering
Billeder kun via links

Dom:
I betragtning af størrelsen laver Pell en overbevisende pakke. Men lad os være ærlige, du kan kun få grundlæggende HTML-filer udført med de begrænsede redigeringsmuligheder. Så hvis du er nogen på udkig efter en hurtig og let WYSIWYG-editor, der er open source til noget meget grundlæggende arbejde, skal du helt sikkert tjekke Pell.

Få Pell

2. OpenWYSIWYG

OpenWYSIWYG er en HTML-editor, der er rich-text på tværs af browsere, kodet udelukkende i JavaScript. Ved blot at kopiere og indsætte et par linier med kode kan du dreje en hvilken som helst ind i OpenWYSIWYGs robuste WYSIWYG HTML-editor. Brugergrænsefladen og redigeringsmulighederne med rullemenuerne ligner meget enhver teksteditor, og du vil føle dig hjemme. Bortset fra alle de grundlæggende formateringsindstillinger kan OpenWYSIWYG prale af en forbedret farvevælger med 216 webfarver at vælge imellem og et kraftfuldt bordformateringsværktøj med alle de muligheder, du kunne tænke på. En anden god ting ved OpenWYSIWYG er, at du sammen med alle de visuelle muligheder stadig kanse rå HTML-kode og foretag justeringer direkte i koden. Nyttigt til når du vil lære eller opdatere dine kodningsfærdigheder. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-2a8d34d0ca966deffc6441af9dbbe702-101381.jpg" alt="7 Bedste WYSIWYG HTML Editor Open Source"> Fordele: <ul> <li>Kraftigt redigeringsmiljø</li> <li>Intuitivt og let brugergrænseflade</li> <li>Farvevælger og omfattende bordredigeringsmuligheder</li> </ul> Ulemper: <ul> <li>Ikke opdateret om et par år</li> </ul> Dom: Når OpenWYSIWYG HTML-editor er skrevet i JavaScript, skal den fungere med ethvert andet webprogrammeringssprog. Hvis du er på udkig efter noget lidt mere kraftfuldt end Pell at indarbejde i din webapplikation, er dette en god mulighed. Få OpenWYSIWYG <h3>3. TinyMCE (Community Edition)</h3> Den næste open source HTML WYSIWYG-editor på vores liste er TinyMCE. Det er også fuldstændigt skrevet i JavaScript og tilbyder en brugergrænseflade og oplevelse som de fleste tekstbehandlere. Det gør det mere brugervenligt. TinyMCE er ikke gratis, men Community Edition er den gratis og open source. Den leveres med alle de grundlæggende redigeringsindstillinger som formatering af tekst, lister, tabeller og også nogle billedredigeringsindstillinger. Udviklerne har holdt prissætningen af premium-modellerne i henhold til antallet af brugere. Nogle af premium-funktionerne inkluderer support fra Google Drive og Microsoft Azure, udvidelser, stave- og linkkontrol og teknisk support. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-35ef757e6374c689f5158bf25ea8b2c6-101381.jpg" alt="Hvis du har tidligere erfaring med programmering og ikke tid til at lære, kan du absolut komme væk ved at bruge en WYSIWYG HTML-editor open source. At finde en god WYSIWYG HTML Editor er dog ikke så let, især hvis du har brug for det for at være en gratis og open source."> Fordele: <ul> <li>Extension support</li> <li>Filhåndtering</li> <li>Teknisk support</li> <li>IDE-stil kode editor til HTML</li> </ul> Ulemper: <ul> <li>Dyr</li> <li>Ikke fuldt open source</li> </ul> Dom: TinyMCE med sin nemme integrationsmulighed, brugervenlige brugergrænseflade og overflod af funktioner er en komplet pakke. Hvis du bare vil have den mest funktionsrige WYSIWYG HTML-editor open source og er okay med at bruge nogle penge, er TinyMCE vejen at gå. De tilbyder også en måneds gratis prøveperiode til deres Pro-model, som du altid kan tjekke ud. Få TinyMCE Demo <h3>4. Jodit</h3> Jodit er en anden hurtig og let WYSIWYG HTML editor open source editor, som du kan integrere i din kode og begynde at redigere din side. Det er ret let på omkring 100 KB i størrelse og er skrevet fuldstændigt i TypeScript. Derfor har du ikke brug for afhængigheder eller biblioteker for at køre det. Den leveres også med en træk-n-slip-grænseflade til billedet. Du kan også vedhæfte YouTube- eller Vimeo-videoer via et link eller integrere dem. Det bedste, jeg kan lide ved Jodit, er, at den kommer med en ACE-redaktør ud af kassen og med en enkelt knap kan du skifte mellem den aktuelle kode og preview-tilstand. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-d9f6924fe440a4261e0839c0c4b1c532-101381.jpg" alt="html, wysiwyg, redigering, indstillinger, openurce, editopenurce, professionelle, kode, tekst, ulemper, support, redaktører, baseret, dom, bootstrap"> Fordele: <ul> <li>Letvægts, ingen biblioteker</li> <li>Træk-n-slip</li> <li>ACE-editor ud af kassen</li> <li>Teknisk support (betalt)</li> </ul> Dom: Jodit tilbyder det bedste fra begge verdener - nem visuel WYSIWYG-editor samt redigering af rå kode. Hvis du er en person, der i det mindste har noget kendskab til HTML, kan Jodit være den bedste mulighed for dig. Få Jodit Playground <h3>5. Sommer note</h3> Summernote er en super simpel WYSIWYG editor open source bygget på jQuery og baseret på Bootstrap. Da det understøtter Bootstrap, kan du bruge alle de understøttede stilarter og temaer på din editor fra Bootswatch. Selve WYSIWYG HTML-editorens open source har en meget ren og minimal brugergrænseflade, og du kan endda redigere eller tilføje formateringsindstillinger efter dit behov. Med Summernotes Air-mode kan du skjule hele værktøjslinjen og redigere dit dokument i farten. Praktisk. Det kan også automatisk konvertere alle billeder til base64, så du slet ikke behøver at tage billedhåndtering. For mig er det bedste ved Summernote det hårdtarbejdende team af udviklere bag det, der altid lytter til samfundet og tilføjer nye funktioner. Eksempler inkluderer support til plugins og en lite eller vaniljeversion af Summernote, som ikke kræver Bootstrap. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-d48b6067378fbbbed4746fb15a5e64e8-101381.jpg" alt="7 Bedste WYSIWYG HTML Editor Open Source"> Fordele: <ul> <li>Minimum indlæringskurve</li> <li>Air Mode til redigering på farten</li> <li>Understøtter Bootstrap 3.x.x til 4.x.x</li> <li>Se og rediger i HTML</li> </ul> Ulemper: <ul> <li>Kræver Bootstrap</li> </ul> Dom: Summernote er sandsynligvis den mest funktionsrige, men gratis og open source WYSIWYG HTML-editor, der findes på markedet, og den forbedres konstant. Hvis du arbejder med Bootstrap, er Summernote en no brainer, men selvom du ikke er det, fortjener Summernote at blive tjekket ud. Få Summernote-demo <h3>6. Froala</h3> Froala er en smuk WYSIWYG HTML editor open source skrevet i JavaScript. Det er et af de mere populære værktøjer på denne liste, og dets popularitet hos udviklere kan tilskrives dets nemme integration og rene design. Froala er en meget kraftfuld redaktør i sig selv, og det brede utal af plugins er kun steget det samme. Nogle af dem inkluderer en avanceret billededitor, humørikoner, stavekontrol, og det er nemt at endda oprette dit eget plugin. Alle værktøjer kan også fås med inline-editoren, hvilket er ekstremt praktisk. Ligesom TinyMCE er Froala tilgængelig i mange varianter, men selv den gratis version indeholder masser af punch. Den eneste forskel er, at du ikke får den fulde kildekode og teknisk support. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-5a89ec944a7b7318dad29d4cbe38303c-101381.jpg" alt="7 Bedste WYSIWYG HTML Editor Open Source"> Fordele: <ul> <li>Let, kraftfuld editor</li> <li>Integreret redigering</li> <li>Overflod af plugins</li> </ul> Ulemper: <ul> <li>Ikke fantastisk til mobilhybrid-app / websted</li> </ul> Dom: Froala er hurtig og let med en smuk brugergrænseflade, men formår stadig at bringe alle de funktioner, man måske leder efter, i en WYSIWYG HTML-editor. Hvis du er okay uden kildekoden og supporten, vil den gratis version tjene dig fint, ellers ved du hvad du skal gøre. Få Froala <h3>7. CKEditor</h3> CKEditor er yderst populær blandt brugerne for at være en smukt designet WYSIWYG HTML editor open source. Den leveres med over 21.000 tests, der hjælper dig med at lære HTML i et venligt layout. Detaljeret dokumentation er der for at hjælpe dig med at finpudse dine færdigheder yderligere. Nogle af de største navne i teknologibranchen stoler på det. Bemærk, at du bliver nødt til at holde copyright-meddelelserne i hver fil intakte og ikke slette LICENSE.md-filen, der findes i CKEditor-installationsmappen. Det er ikke en ulempe, især når du får så meget værdi til gengæld. Der er understøttelse af plugins, @mention, emojis, ældre browsere og endda autofuldførelse, hvilket kan spare meget tid. <img src="//geekmarkt.com/img/101381/7-best-wysiwyg-html-editor-open-source-f7cf4bbbed846085854eb05d6236462e-101381.png" alt="Hvis du har tidligere erfaring med programmering og ikke tid til at lære, kan du absolut komme væk ved at bruge en WYSIWYG HTML-editor open source. At finde en god WYSIWYG HTML Editor er dog ikke så let, især hvis du har brug for det for at være en gratis og open source."> Fordele: <ul> <li>Detaljeret dokumentation, test, spørgsmål</li> <li>Samarbejd og @ omtale</li> <li>Autofuldfør</li> </ul> Ulemper: <ul> <li>Opbevar licensfil</li> </ul> Få CKEditor Æresomtaler: 1. MediumEditor er en open source-klon af den indbyggede WYSIWYG-editor til Medium.com. Det er dødt simpelt, let og kommer uden afhængigheder. Selvom det ikke er så stærkt, kan det fungere som et fantastisk redigeringsværktøj til tekst eller tekstrelaterede dokumenter. 2. Atoms HTML Preview-pakke giver dig mulighed for at tilføje en preview-rude, hvor du kan få en live preview af din HTML-kode, hvilket kan være meget nyttigt for udviklere. Selvom dette bestemt ikke er for begyndere, er det en god pakke at tilføje til din eksisterende arbejdsgang, hvis du allerede laver programmering i HTML. <h3>Bedste WYSIWYG HTML Editor Open Source</h3> Mens HTML stadig er den mere kraftfulde måde at opbygge et websted på, og meget mere indviklede ting er mulige med det, har WYSIWYG-redaktører sikret et eget sted. At lære at kode kræver meget investering af tid og energi og giver måske ikke mening for alle. Hvis du har tidligere erfaring med programmering og ikke tid til at lære, kan du absolut komme væk ved hjælp af en open source for WYSIWYG HTML-editor. Læs også: <a href="/7-best-open-source-browser-for-android-2018-100540" target="_blank">7 Bedste Open Source Browser til Android (2018)</a>