Top 3 darmowy edytor tekstu sformatowanego do aplikacji internetowych

Ostatnia aktualizacja paź 18, 2021

Zadowolony

Dlaczego potrzebny jest edytor tekstu sformatowanego?

Szukasz darmowego edytora tekstu sformatowanego do swojej aplikacji internetowej? Edytor WYSIWYG (otrzymujesz to, co widzisz) pozwala na wprowadzanie opisowej treści wraz z elementami HTML. W tym artykule omówimy 3 najlepsze darmowe edytory tekstu sformatowanego, które są popularne i łatwe w instalacji.

W Internecie dostępnych jest kilka edytorów WYSIWYG. Wypróbowałem niektóre edytory i wybrałem 3 najlepsze darmowe edytory HTML WYSIWYG, którymi są – CKEditor, TinyMCE i Trix.

Dlaczego potrzebny jest edytor tekstu sformatowanego?

Można zapytać, dlaczego warto korzystać z edytora tekstu sformatowanego? Odpowiedź jest prosta. W obszarze tekstowym wprowadzanie dużych fragmentów treści nie jest łatwe i przyjazne dla użytkownika. Bardzo trudno jest wprowadzić różne rodzaje elementów HTML w obszarze tekstowym. Zawijanie treści wewnątrz elementów i utrzymywanie ich hierarchii jest trudne w obszarze tekstowym.

Aby uprościć ten problem, mamy możliwość skorzystania z edytora tekstu sformatowanego. Te edytory WYSIWYG zapewniają dobry interfejs użytkownika i wygodę użytkownika zamiast obszaru tekstowego.

CKEditor – internetowy edytor tekstu

CKEditor to popularny i powszechnie używany darmowy edytor tekstu sformatowanego. Ten edytor ma na celu uproszczenie tworzenia treści witryny.

Aby korzystać z CKEditor, musisz najpierw dołączyć jego plik JS. Dostarczyli 3 rodzaje pakietów – Basic, Standard, Full. Możesz wybrać dowolny pakiet w zależności od wymagań. Dla każdego pakietu dostępny jest inny plik JS.

Oto link do pakietów CKEditor http://ckeditor.com/download

Na powyższej stronie można wybrać dowolny pakiet i uzyskać ścieżkę źródłową JS pakietu.

Na przykład używam standardowego pakietu, więc mój kod będzie wyglądał następująco.

<!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>

Powyższy kod wygeneruje edytor, który wygląda jak na poniższym zrzucie ekranu.

TinyMCE – zaawansowany edytor WYSIWYG

TinyMCE jest jednym z najczęściej używanych edytorów open-source. Dobrze znane marki używają tego edytora w swoich podstawowych działaniach.

Instalacja edytora TinyMCE jest bardzo łatwa. Poniższy kod zastępuje textarea edytorem TinyMCE WYSIWYG.

<!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>

Poniżej znajduje się zrzut ekranu edytora, który jest generowany przy użyciu powyższego kodu.

Ten edytor zapewnia bogaty zestaw pasków narzędzi. Użytkownik może dodawać funkcje (wtyczki), takie jak emocje, kotwica, tryb pełnoekranowy, obraz, druk, sprawdzanie pisowni, tabela, liczba słów itp. w pasku narzędzi edytora. Pełną listę wszystkich dostępnych funkcji pasków narzędzi znajdziesz w ich dokumentacji.

Trix – edytor WYSIWYG typu Open Source

Trix to kolejny edytor tekstu sformatowanego typu open source firmy Basecamp. Ponieważ ten edytor jest używany w Basecamp, miliony użytkowników już z niego korzystają. Napisałem osobny artykuł o edytorze Trix, więc zapoznaj się z tym artykułem, który wyjaśnia, jak używać edytora Trix na swoich stronach internetowych.

Mam nadzieję, że masz podstawową wiedzę na temat popularnych darmowych edytorów tekstu sformatowanego. Podziel się swoimi przemyśleniami i sugestiami w sekcji komentarzy poniżej.

Powiązane artykuły

Źródło nagrywania: artisansweb.net