✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Suosituimmat 3 ilmaista Rich Text Editor -sovellusta verkkosovelluksille

14

Etsitkö ilmaista rich text editoria verkkosovelluksellesi? WYSIWYG (mitä näet on mitä saat) -editorin avulla voit kirjoittaa kuvailevaa sisältöä HTML-elementtien kanssa. Tässä artikkelissa keskustelemme kolmesta parhaasta ilmaisen rikkaan tekstin muokkausohjelmasta, jotka ovat suosittuja ja helppo asentaa.

Internetissä on useita WYSIWYG-toimittajia. Olen kokeillut joitain toimittajia ja noutanut 3 parasta ilmaista WYSIWYG HTML -editoria, jotka ovat – CKEditor, TinyMCE ja Trix.

Miksi tarvitset Rich Text Editoria?

Voidaan kysyä, miksi rikastekstieditoria tulisi käyttää? Vastaus on yksinkertainen. Tekstialueella ei ole helppoa ja käyttäjäystävällistä kirjoittaa suuria sisältöjä. Erilaisten HTML-elementtien syöttäminen teksti-alueelle on hyvin vaikeaa. Sisällön kääriminen elementtien sisälle ja niiden hierarkian ylläpitäminen on vaikeaa tekstialueella.

Tämän ongelman yksinkertaistamiseksi meillä on mahdollisuus käyttää Rich Text Editoria. Nämä WYSIWYG-editorit tarjoavat hyvän käyttöliittymän ja käyttökokemuksen tekstialueen sijaan.

CKEditor – Web-tekstieditori

CKEditor on suosittu ja yleisesti käytetty ilmainen rikkaiden tekstien muokkausohjelma. Tämä editori on suunniteltu yksinkertaistamaan verkkosivustojen sisällön luomista.

Jotta voit käyttää CKEditoria, sinun on ensin sisällytettävä sen JS-tiedosto. He ovat toimittaneet 3 erilaista pakettia – Basic, Standard, Full. Voit valita jommankumman paketin vaatimuksen perusteella. Jokaiselle paketille on saatavana eri JS-tiedosto.

Tässä on linkki CKEditor-paketteihin http://ckeditor.com/download

Yllä olevalla sivulla voi valita minkä tahansa paketin ja saada paketin JS-lähdepolun.

Suosituimmat 3 ilmaista Rich Text Editor -sovellusta verkkosovelluksille

Käytän esimerkiksi vakiopakettia, joten koodini on seuraava.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>CKEditor</title>
        <script src="//cdn.ckeditor.com/4.14.1/standard/ckeditor.js"></script>
    </head>
    <body>
        <textarea name="editor1"></textarea>
        <script>
            CKEDITOR.replace( 'editor1' );
        </script>
    </body>
</html>

Yllä oleva koodi luo editorin, joka näyttää alla olevalta kuvakaappaukselta.

Suosituimmat 3 ilmaista Rich Text Editor -sovellusta verkkosovelluksille

TinyMCE – Edistynyt WYSIWYG-editori

TinyMCE on yksi käytetyimmistä avoimen lähdekoodin editorista. Tunnetut tuotemerkit käyttävät tätä editoria ydinkehityksessään.

TinyMCE-editorin asennus on erittäin helppoa. Seuraava koodi korvaa tekstialueen TinyMCE WYSIWYG -editorilla.

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
  <script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
  <textarea>Next, get a free Tiny Cloud API key!</textarea>
</body>
</html>

Alla on kuvakaappaus editorista, joka on luotu käyttämällä yllä olevaa koodia.

Suosituimmat 3 ilmaista Rich Text Editor -sovellusta verkkosovelluksille

Tämä editori tarjoaa runsaan joukon työkalurivejä. Käyttäjä voi lisätä ominaisuuksia (laajennuksia), kuten tunteet, ankkuri, koko näytön tila, kuva, tulosteet, oikeinkirjoituksen tarkistus, taulukko, sanamäärä jne. Editorin työkalupalkkiin. Saat täydellisen luettelon kaikista käytettävissä olevista työkalupalkin ominaisuuksista heidän dokumentaatiostaan.

Trix – avoimen lähdekoodin WYSIWYG-editori

Trix on toinen avoimen lähdekoodin rikas tekstieditori Basecampilta. Koska tätä editoria käytetään Basecampissa, miljoonat käyttäjät käyttävät sitä jo. Kirjoitin erillisen artikkelin Trix-editorista, joten tutustu tähän artikkeliin, jossa kerrotaan, miten Trix-editoria käytetään verkkosivustoillasi.

Toivon, että sait perustiedot suosituista vapaiden rikkaiden tekstien muokkaajista. Jaa ajatuksesi ja ehdotuksesi alla olevassa kommenttiosassa.

Aiheeseen liittyvät artikkelit

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja