Edytor cheditor WYSIWYG z uploadem zdjęć.
- Autor:
- Doktor Problem
- Opublikowano:
- Kategorie:
- Informatyka
- Tagi:
- Ckeditor • edytor html • WYSIWYG
Nie dawno zostałem poproszony o zintegrowanie z systemem CMS jakiegoś prostego edytora tekstu z możliwością ładowania plików na serwer. Zastanawiałem się nad CKEditor i TinyMCE. Sprawdziłem oba i bardziej do gustu przypadł mi Ckeditor
. Trochę się namęczyłem zanim udało mi się doprowadzić zadanie do końca. Dla tego postanowiłem udostępnić gotowy pakiet edytora WYSIWYG CKEditor z menadżerem plików Kcfinder aby zaoszczędzić innym trochę czasu. (z czasem wersja może być trochę stara, można pobrać ckeditora i Kcfinder oddzielnie)
Jest to gotowy pakiet edytora CKeditor z dodanym menadżerem plików i ładowaniem zdjęć za pomocą plugina Kcfinder. Wszystko zostało skonfigurowane do pracy. Jeżeli po wysłaniu pliku skrypt zatrzymuje się na szarym boksie to znaczy że ścieżka do menadżera Kcfinder jest błędna i trzeba ją dostosować do sytuacji na naszym serwerze.
W pliku konfiguracyjnym CKeditor (ckeditor_Kcfinderconfig.js) trzeba zmodyfikować linie
config.filebrowserBrowseUrl = 'tutaj wpisz ścieżkę do pliku kcfinder/browse.php';
config.filebrowserUploadUrl = 'tutaj wpisz ścieżkę do pliku kcfinder/upload.php';
Dla przykładu na jednej z stron gdzie trzymam CKeditor w katalogu /js/Ckeditor z wieloma podkatalogami i wersjami językowymi strony aby upload plików działał poprawnie musiałem ustawić takie ścieżki:
config.filebrowserBrowseUrl = '../../js/ckeditor/kcfinder/browse.php';
config.filebrowserUploadUrl = '../../js/ckeditor/kcfinder/upload.php';
Kcfinder domyślnie skonfigurowany jest tak aby pliki wysłane pliki zostawiać w katalogu ckeditorkcfinderuploadfiles Aby zmienić katalog pobranych plików musimy edytować plik ckeditorkcfinderconfig.php
W linii 28 możemy zmienić adres URL obrazka który będzie nam się wyświetlał
'uploadURL' => "upload",
W linii 29 ustawiamy fizyczną lokalizację obrazka
'uploadDir' => "files",
Przykład. Uploader plików Kcfinder mam w katalogu /js/ckeditor. A zdjęcia trzymam w /images/files
Linie 28 i 29 zedytowałem tak:
'uploadURL' => "../../../images",
'uploadDir' => "",
Frazy wpisywane w wyszukiwarkach aby znaleźć ten artykuł:
| | |
Witryna wykorzystuje Akismet, aby ograniczyć spam. Dowiedz się więcej jak przetwarzane są dane komentarzy.
Gdzie można zmodyfikować ikonki, bo nie mogę odnaleźć pliku z konfiguracją?
Wyjaśniłeś mi wszystko 🙂 dziekuję!
Dzięęęęęki, siedziałem nad tym kilka godzin i dopiero dzięki Tobie wszystko mi działa 🙂