
TinyMCE - Instalace a čeština
Návody pro C4
K dispozici je stránka o aplikaci TinyMCE, na které naleznete: popis aplikace, screenshoty stránek, návody pro aplikaci, demo stránky, diskuze k aplikaci. - Zobrazit stránku aplikace
Příprava na instalaci
Stažení aplikace
Nejprve si stáhněte aplikaci TinyMCE verzi "Main package". Na stránce http://www.tinymce.com/i18n/index.php?ctrl=lang&act=download&pr_id=1 vyhledejte český jazykový balíček, zaškrtněte ho a stisknutím "Download" stáhněte.
Rozbalení souborů
- Rozbalte (např. pomocí programu Total Commander) staženou aplikaci TinyMCE do nějakého adresáře ve vašem počítači (např. si vytvořte adresář tinymce). Je nutné zachovat strukturu adresářů - po rozbalení byste tedy měli najít adresář examples s ukázkovými soubory a jscripts, ve kterém je umístěno jádro aplikace.
- Do jiného adresáře (např. cestina) rozbalte stažený balík s českou lokalizací.
- Obsah složky tinymce_language_pack zkopírujte do adresáře tinymce/jscripts/tiny_mce.
Adresář cestina můžete smazat, již ho nebudete potřebovat.
Instalace
Editor TinyMCE se neinstaluje. Na server se nahraje jádro aplikace, a poté se do zdrojového kódu stránky, na které chcete aplikaci používat, vloží skript pro zobrazení editoru.
Kopírování souborů
Pomocí FTP klienta zkopírujte adresář tiny_mce do složky na server, na kterém budete aplikaci používat. Adresář tiny_mce naleznete ve složce tinymce/jscripts a obsahuje jádro celé aplikace. V našem ukázkovém případě adresář kopírujeme na web tinymce.demo2.cz do kořenového adresáře.
Tím je instalace hotová. Nyní přejdeme k implementaci do webové stránky.
Implementace editoru
Vytvoření webové stránky
Pokud zatím nemáte webovou stránku, na které chcete editor zobrazit, vytvořte ji.
Vložení a úprava skriptu
Do zdrojového kódu stránky někam mezi párové tagy <body> a </body> vložte skript pro zobrazení editoru. Ukázkové skripty pro různé varianty zobrazení editoru naleznete buď v rozbaleném adresáři s instalací tinymce/examples, nebo na oficiálních stránkách aplikace http://tinymce.moxiecode.com/examples/full.php. V našem ukázkovém případě použijeme a upravíme skript pro zobrazení všech součástí aplikace, který vypadá takto:
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ // General options mode : "textareas", theme : "advanced", plugins : "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager", // Theme options theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect", theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen", theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", theme_advanced_resizing : true, // Example content CSS (should be your site CSS) content_css : "css/example.css", // Drop lists for link/image/media/template dialogs template_external_list_url : "js/template_list.js", external_link_list_url : "js/link_list.js", external_image_list_url : "js/image_list.js", media_external_list_url : "js/media_list.js", // Replace values for the template plugin template_replace_values : { username : "Some User", staffid : "991234" } }); </script> <form method="post" action="somepage"> <textarea name="content" style="width:100%"> </textarea> </form>
Nyní je potřeba upravit pár částí skriptu. Postupujte následovně:
- Text "<your installation path>" nahraďte cestou k adresáři s jádrem aplikace umístěným na serveru. V našem ukázkovém případě se adresář nachází v kořenové složce webu, tudíž celá cesta bude vypadat takto "tiny_mce/tiny_mce.js".
- Do části "// General options" přidejte řádek language : "cs",. Tím se nastaví čeština.
- Pokud chcete v editoru používat stejné styly, jako má stánka, upravte cestu k souboru na řádce "content_css : "css/example.css", ".
- Vytvořený obsah z editoru se posílá pomocí formuláře. Vyhledejte řádek "<form method="post" action="somepage">" a místo textu "somepage" zadejte cestu ke skriptu, který bude formulář zpracovávat.
Upravený zdrojový kód bude vypadat například takto:
<script type="text/javascript" src="tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ // General options language : "cs", mode : "textareas", theme : "advanced", plugins : "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager", // Theme options theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect", theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen", theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", theme_advanced_resizing : true, // Example content CSS (should be your site CSS) content_css : "css/styly.css", // Drop lists for link/image/media/template dialogs template_external_list_url : "js/template_list.js", external_link_list_url : "js/link_list.js", external_image_list_url : "js/image_list.js", media_external_list_url : "js/media_list.js", // Replace values for the template plugin template_replace_values : { username : "Some User", staffid : "991234" } }); </script> <form method="post" action="index.php"> <textarea name="content" style="width:100%"> </textarea> </form>
Webovou stránku uložte a nahrajte na server. Do internetového prohlížeče zadejte adresu webu a vytvořeného souboru. Pokud jste vše udělali správně zobrazí se vám na stránce TinyMCE editor.
Ukázka
Ukázku nainstalovaného editoru TinyMCE si můžete prohlédnout na http://tinymce.demo2.cz/.
Související odkazy
- http://tinymce.moxiecode.com/ - oficiální stránky editoru TinyMCE (anglicky)
- http://tinymce.moxiecode.com/documentation.php - dokumentace k editoru TinyMCE (anglicky)
- http://tinymce.moxiecode.com/punbb/ - diskuzní fórum editoru TinyMCE (anglicky)
Aktualizace
Z bezpečnostních důvodů doporučujeme pravidelně provádět aktualizaci aplikace.
Diskuzní fórum pro aplikaci TinyMCE
Nové diskuzní téma můžete založit v sekci Tvorba web stránek.
Témata | Reakce | Poslední příspěvek |
---|---|---|
SQL příkaz INSERT přes CKeditor nebo TinyMCE | 1 | 10.10.2012 16:44 |
Editor tinyMCE v JOOMLE se zahlcuje při vkládání obsahu | 5 | 16.02.2011 15:07 |
Licence tinyMCE manager a CKFinder | 3 | 15.09.2010 14:14 |
Joomla - problém s tinymce | 1 | 10.02.2010 15:30 |
Oxid eshop CE + tinymce | 3 | 16.10.2009 17:04 |
Změny a kontroly
K dispozici je kompletní přehled všech změn a kontrol v tomto návodu.
TinyMCE - Instalace a čeština
Aplikace: | TinyMCE |
Ověřeno pro: | TinyMCE 3.5.8 |
Publikace: | 25.8.2009 |
Kontrola: | 24.2.2013 |
Přehled změn a kontrol |
Nové texty
- 12.1. - Drupal 9 - Konfigurační soubor
- 12.1. - Drupal 9 - Instalace a čeština
Diskuzní fórum
- Webové aplikace
- Tvorba web stránek
- PHP, MySQL
TinyMCE partneři
- VENDY atelier
http://www.vendyatelier.cz - DEWELL.cz
http://www.dewell.cz - Webdesign - Bronislav Churý
http://www.bronislavchury.cz - WebSite4u.cz
http://www.website4u.cz - Studio Illek - grafické studio
http://www.studioillek.cz - A-ALFA salt s.r.o.
http://www.grafika-www.cz - AW-dev, v.o.s.
http://www.aw-dev.cz/ - vm-soft-Věroslav Moštěk
http://www.vm-soft.cz - Pavel Grof - PG servis
http://www.pg-servis.cz - ValpeNET - Petr Valina
http://www.valpenet.cz