Drupal, WYSISWYG API, TinyMCE a IMCE jednoduše

Redakční systém Drupal neobsahuje v základní podobě vizuální editor ani prohlížeč souborů uploadovaných na web. Vše můžete velmi jednoduše změnit, stačí mít ten správný postup. V jednoduchém návodu vám ukážu, jak vše konečně zprovoznit bez použití patchů.

Tématu Drupal, vizuální editor a obrázky jsem se na Maxiorlovi věnoval již několikrát a tyto články patří k těm, které vás zaujaly nejvíce. Problém je v tom, že u videa TinyMCE, IMCE, Lightbox. Obrázky v Drupalu podruhé si stěžujete na nemožnost jednoduché instalace potřebného patche pro zprovoznění prohlížeče a vybíračky obrázků IMCE spolu s vizuálním editorem TinyMCE. Skutečně, současná verze zastřešujícího modulu WYSIWYG API, který se stará o zprovoznění vizuálních editorů, není kompatibilní s IMCE.

V posledním článku na toto téma, v diskuzích i mailech jsem doporučoval použití patche, který však vyžaduje tu správnou verzi WYSIWYG API i IMCE. Zapomeňte na to. Mám pro vás mnohem jednodušší řešení, které zvládne každý, kdo je schopen nainstalovat běžným způsobem modul do Drupalu.

Jak na TinyMCE s IMCE bez patchování

Stáhněte a nainstalujte si následující moduly pro Drupal 6:

Dále si stáhněte knihovny editoru TinyMCE a rozbalte je do složky tinymce v adresáři, kam jste nainstalovali WYSIWYGP API - tedy do sites/all/modules/wysiwyg. ...v adresáři sites/all/libraries.

Moduly zapněte a přejděte do nastavení WYSIWYG API na adrese admin/settings/wysiwyg/profile. Pokud jste TinyMCE nakopírovali do správného umístění, nabídne se vám v nabídce vedle jednotlivých vstupních formátů. Zapněte jej minimálně pro Full HTML, nastavení uložte a poté klepněte na nastavení. Upravte si parametry podle potřeby. V nabídce tlačítek by se mělo objevit i IMCE. Podotýkám, že je nutné zároveň s ním zapnout i Advanced Image.

Tip: pokud vám editor nebude fungovat, vraťte se do nastavení a vypněte tlačítko Flash.

Prohlížeč a vybírač obrázků IMCE

Prohlížeč a vybírač obrázků IMCE

IMCE nastavte, jak potřebujete - tedy složky, kam mohou koukat jednotlivé skupiny uživatelů, maximální velikosti souborů pro upload atd. IMCE Wysiwyg API bridge žádné nastavení nemá, jeho funkce se projeví „jen" v tom, že přidává možnost zapnutí tlačítka IMCE.

Nyní byste měli mít vše připraveno k tomu, aby editor začal fungovat. Postup jsem odzkoušel na nejnovějších stabilních verzích zmíněných modulů a zdá se bezproblémový.

Tagy

Buďme ve spojení, přihlaste se k newsletteru

Odesláním formuláře souhlasíte s podmínkami zpracováním osobních údajů. 
Více informací v Ochrana osobních údajů.

Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal, WordPress a Symfony. Acquia Certified Developer & Site Builder. Autor několika knih o Drupalu.
Web Development Director v Lesensky.cz. Ve volných chvílích podnikám výlety na souši i po vodě. Více se dozvíte na polzer.cz a mém LinkedIn profilu.

Komentáře k článku

návštěvník

Dobry den, diky za super clanek, vsechno funguje jak ma narazila jsem vsak na jeden problem kdy pridam obrazek tak se mi zobrazi vzdy prazdny s krizkem nemate nejaky tip?
deje se mi tu u dvou stranek ktere mam rozpracovane a zkoousela jsem htacces tam je zakomentovano vse pak cesty jsou v poradku zadane.tak nevim
dekuji
jana sirkova

návštěvník

jeste ja tak to bylo htaccess jen mi omylem zapli prava na korenovem htaccess takze se mi to v tom zpravnem neulozilo.
:)
jana

návštěvník

Dobrý den.

Dle návodu ve Vaší knize pro Google jsem do page.tpl přidal skript od TOPLISTu na sledování statistiky přístupů. Přestal se zobrazovat TinyMCE a Lightbox. Smazání scriptu nepomohlo. Začínám, nevíte kde mám hledat řešení?

Díky

Profile picture for user Jan Polzer

Dobrý den. page.tpl.php musí být zakončeno <?print $closure?></body></html>. Pokud to tam není, většinou to způsobuje nefunkčnost editoru a dalších modulů.

návštěvník

Dobry den,
postupoval jsem presne navodu, ale stale nemam k dispozici moznost zapnuti tlacitka IMCE.

Profile picture for user Jan Polzer

Někde jste udělal chybu, třeba nezapnul ten propojovací modul. Toto řešení funguje spolehlivě.

návštěvník

Zdravím,
tak som si stiahol všetko aktuálne k dnešnému dňu a vyskúšal som to. Upozorňujem užívateľov na nefunkčnosť, pretože na stránke mám červený blok: The version of TinyMCE could not be detected.

Postupoval som takto:
1, inštalácia a aktivovanie modulov WYSIWYG API, IMCE a IMCE Wysiwyg API bridge
2, vytvorenie priečinku sites/all/libraries a nakopírovanie rozbaleného Main package TinyMCE, čiže cesta je sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js

Následne som zistil, že problém je v TinyMCE 3.3b2 (2010-02-04)
Použil som teda staršiu verziu 3.2.7 (2009-09-22) a všetko funkčné :)

Pre istotu teda zverejňujem link na funkčné TinyMCE:
http://sourceforge.net/projects/tinymce/files/TinyMCE/3.2.7/tinymce_3_2_...

návštěvník

Mám problém, vše jsem udělal podle návodu a když se překliknu do nastavení Wysiwyg tak mi to pise:

The version of TinyMCE could not be detected.

Extract the archive and copy its contents into a new folder in the following location:
sites/all/libraries/tinymce

So the actual library can be found at:
sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js

uz nevím co dál. Vse jsem zkontorloval a vse je podle me vporadku. Prosim o radu. Dekuji

návštěvník

Tak už jsem problem vyřwšil..ale stejně se m i editor nezobrazuje :( co dal?

Profile picture for user Jan Polzer

1. Musíte mít buď modul 2.0 a TinyMCE 3.2.x nebo modul ve verzi dev a pak lze mít i editor ve verzi 3.3.x

2. Pokud jste v nastavení Wysiwygu zapl češtinu, musí být v editoru nakopírována správně. Zkuste topro jistotu s angličtinou.

3. Ujistěte se, že má pod editačním polem vybrán takový vstupní formát, pro který je editor nastaven. Typicky je výchozí Filtered HTML, uživatel má editor jen pro Full HTML a pak se diví, kde je editor.

návštěvník

Dobry den. Potreboval by som zmenit velkost okna tinymce. Po pridaní funkcných tlacitok sa mi stalo toto http://sturovo.com/tmp/tinymce_size.jpg
Nasiel som popis o tom to tu: http://wiki.moxiecode.com/index.php/TinyMCE:Auto_resize_editor_box

Neviem ale co a kde zmenit neviem najst nazov suboru alebo hodnoty v samotnej tiny aplikacii kde sa to dá zmenit a co treba robit.
editor nejde zmenit ani tým trojuholníkom v rohu, že by som si ho mysou nastavil na pozadovanú velkost. Nie téma marinelli je na vine. robí to aj na inej téme.

Enable resizing button mán nastavené na true.

Dakujem za pomoc.

Nasledovné som urobil - toto: tablecontrols – table som vypol a tu:
tinymce/jscripts/tiny_mce/themes/advanced/editor_template.js
som zmenil ,theme_advanced_buttons3 na ,theme_advanced_buttons7

Tabulky by som ale potreboval pouzivat a okno také ako má byť :-O

Profile picture for user Jan Polzer

Zaintegrujte si TinyMCE do Drupalu pomocí modulu Wysiwyg. Problém zmizí :-) K tématu si pohledejte články a diskuze tu na webu.

návštěvník

Dakujem za radu. Pozriem si co tu máte. Instaláciu som robil podla návodu v tomto článku wisiwig modul bol pridaný tiež. Skúsim si to ešte raz prejsť čo ak som si niečo nevšimol.

návštěvník

Dobrý den děkuji za články vše funguje ok.

Problém mám s fyzickým přístupem na soubory.

U adresářů a souborů pořízených IMCE je jiný vlastník a skupina. Na tyto soubory a adresáře pak nemám přes FTP přístup. Stejně tak soubory nahrané přes FTP nepracují potom v IMCE zcela korektně.

Jsem začátečník. Pomůžete?

Děkuji.

JK

Profile picture for user Jan Polzer

Dobrý dne. To je bohužel klasický problém paranoidně zabezpečených českých webhostingů. Můžu jen odkázat na domluvu s poskytovatelem.

návštěvník

Dobrý den.

Editor jsem nainstaloval dle vašeho návodu.
Pokud však zaškrtnu jakékoliv tlačítko v nastavení editoru tak se nezobrazí v editoru žádná lišta s tlačítka a zmizí i ty původní.
Nevíto co nastavit?

Josef

Profile picture for user Jan Polzer

Aktuální verze modulu WYSIWYG s editorem TinyMCE někdy zlobí v IE a Chrome. Ale mají tam na to patch, zkuste pohledat.

návštěvník

Dobrý den

také jsem v koncích, jako někteří již přede mnou. Vše jsem provedl dle návodu, pročetl diskuze a nic. Můj problém je v tom, že se mi obrázek vůbec nevloží. Už při zapnutí náhledu se mi zobrazí pouze toto:

Nějaký text [img]/sites/default/files/pictures/1605.jpg[/img]

Profile picture for user Jan Polzer

Na každém školení vykládám, jak na podobný dotaz zde na Maxiorlovi odpovídám několikrát do měsíce. Čili:
1. V nastavení WYSIWYG vypněte "tlačítko" BBcode.
2. Článek zeditujte, ten nesmysl smažte, obrázek vložte znovu a uložte to.
3. Nyní bude vše v pořádku.

návštěvník

Stejný problém. Editor se zobrazuje, obrázek se načte atd. Ovšem editor jako když nefunguje. Po uložení, nebo v náhledu je pouze čistý text bez obrázku, barevného rozlišení textu apod.

Veškeré chyby co jsem našel na fórech jsem zkontroloval a už nevím.

návštěvník

Tak jsem zjistil, že se vše zobrazí správně pokud zadám formát vstupu v php. Přičemž v nastavení WYSISWYG mám tinyMCE zapnutý pouze na fullHTML???

Vůbec tomu nerozumím a nechce se mi povolovat php návštěvníkům

Profile picture for user Jan Polzer

Máte nějaký binec ve Formátech vstupu, filtrech a oprávněních. Wysiwyg nastavte pouze pro Full HTML. Poté se podívejte do nastavení tohoto vstupního formátu a ujistěte se, že v něm není zapnut filtr nazvaný HTML filtr.

návštěvník

Moc děkuji, opravdu stačil vypnout ten filtr, vůbec jsem si toho nevšiml.

Kdybych mohl mít ještě dotaz jak nastavit, aby admin měl k dispozici plný editor a návštěvník pouze určité funkce editoru?

Profile picture for user Jan Polzer

Jedině přes ty Vstupní formáty. Čili návštěvníkovi povolíte jen Filtered HTML a pro něj ve Wysiwyg definujete jen některá tlačítka - Bold, Underline, Italic - třeba.

Adminovi dáte právo na Full HTML, a pro tento vstupní formát povolíte ve Wysiwyg všechna tlačítka (pozor, nezapínejte BBcode, viz ostatní příspěvky tu).

Pokud byste chtěl, aby návštěvník mohl mít Full HTML a zároveň aby měl jiná tlačítka, než admin, muselo by se to řešit tak, že přidáte ještě jeden Vstupní formát, který se bude chovat stejně, jako Full HTML, jen se jinak pojmenuje. Ten pak dáte do práv pro návštěvníka apřiřadíte tomu nějaký profil editoru.

návštěvník

dobry den, chem sa opytat, naistalovala som si podla tohto navodu   WYSISWYG API, TinyMCE a IMCE

v nastaveniach pre modul wysiwyg som zvilila pre full html modul tiny...

ked chcem vytvorit obsach, napriklad stranku tak si zvolim to Full zobrazenie, zobrazim si panel nastrojv na formatovanie Tiny.. formatujem text, vlozim obrazok vsetko funguje, ale ked to ulozim zmeni text na neformatovany, miesto bold je pred slovom B v hranatych zatvorkach.. obrazok ma formu odkazu kde je ulozeny.. :( nevim co uz mam robit predtym mi to islo, ked som mala D5 ale teraz som presla D6 a neviem to nastavitm pri D5 som nic extra nastavovat nemusela a text som mala pekne naformatovany....

 

dakujem za odpoved

návštěvník

Dakujem uz nie je treba...  mi to nedalo a som si to este raz presla a nasla som chybu.. problem som mala s tym BB code v tiny :) vypla som a uz mi to funguje :)

návštěvník

Dobrý den,

mam takový menší problém s TinyMCE a IMCE. Chci vložit obrázek, vše funguje jak má, v pohodě ho najdu, udělám upload, obrázek se vloží na ftp ale když dám send tinyMCE tak cesta se vloží správně, jako url např. /sites/default/files/u6/xxx.jpg , ale obrázek se nevlozí, jenom malý čtvereček jako náhled, jakoby to ten obrázek nemohlo najít, přitoam tam je a URL se zdá také správná, vůbec už netuším co s tím, návody jsem viděl snad všechny. Prosím, netušíte. Děkuji Lukas

návštěvník

ještě jednou píšu, ted jsem zjistil že se to fyzicky na FTP nenahráva a že mam naky problém s imagecache, nezobrazuje se mi ukázkový soubor. A co mam používat za ImageAPI, GD2 nebo to druhé, to bude také možná kámen úrazu, protože v přehledu modulů u reportu mi to píše  chybu :

Jak se prosím vyvarovat těchto chybových hlášek. Děkuji 

ImageMagick advanced optionsImageMagick image toolkit is not properly installedThe sites/all/modules/image/image.imagemagick.inc file must be copied to includes in order for the ImageMagick image toolkit to function.

a

GD Image FilteringLow Quality / Poor Performance

The installed version of PHP GD does not support image filtering(desaturate, blur, negate, etc). It was probably compiled using the official GD libraries from http://www.libgd.org instead of the GD library bundled with PHP. You should recompile PHP --with-gd using the bundled GD library. See PHP Manual for more information. A slower implementation of imagefilter() written in PHP will be used in the interim.

 

Profile picture for user Jan Polzer

Zdravím.

Neukazující se obrázky - zakomentujte si obsah souboru .htaccess ve složce sites/default/files napsáním mřížek na začátek tří jeho řádků.

ImageMagick - v té hlášce máte info o tom, kam máte zkopírovat který soubor. Pokud knihovny ImageMagick ne serveru nejsou (řekne vám to hosting), používejte pouze PHP GD.

PHP GD musí na hostingu být zkompilováno tak, aby podporovalo rozšířenou práci s obrázky, v tomto případě opět máte v hlášce napsáno, co je třeba na serveru nastavit.

Takže buď to vykomunikujte s hostingem, nebo se svým správcem, podle toho, kde vám stránky běží.

návštěvník

dobry den,

děkuji za odpověd. Zakomentování souboru htaccess se mi podařilo zprovoznit ImageMagick, ale blebne mi tam ještě něco s ImageMagick, asi chybi knihovna u poskytovatele, je to možné?

Píše mi to :

warning: file_exists() [function.file-exists]: open_basedir restriction in effect. File(/usr/bin/convert) is not within the allowed path(s): (/wwwhosting/802xxx) in /wwwhosting/802xxx/subdomeny/ose/sites/all/modules/image/contrib/image_im_advanced/image_im_advanced.install on line 30.

 

Zkoušel jsem změnit všechno možné a pořád se mi to nedaří, změnit usr na user apod.

Asi se musím obrátit na poskytovatele webhostingu že? Stejně tak jako s PHP GD že?

 

A poslední dotaz je, jak můžu udělat v editoru TinyIMCE to, že když tam vložim obrázek, tak se vám kolem obrázku zobrazuje ohraničení a v rohách čtverečky, pomocí kterých můžete změnit velikost, ve videu to máte a já jsem vůbec nepřišel na to jak to tam udělat taky? Prosím můžete poradit, to je naky modul či natavení?

 

Děkuji mnohokrát, Lukáš 

návštěvník

dobry den,

K TinyMCE myslim to, že si můžete upravovat velikost obrázku přímo v editoru, tzv. zatáhnete za krajní rohy a nastavíte si velikost obrázku, mě zatím jde jenom jasně definovaná velikost kterou tam vložím a v editoru už nemohu s obrázkem hejbat, měnit jeho velikost. Rozumíme si?

Děkuji Lukas

 

návštěvník

Opravdu je to prohlížečem, v Google Chrome to nejde. Děkuji moc, tohle řešení mě nenapadlo a je tak jednoduché.

Ještě jeden menší dotaz:

Chci si přeložit web do více jazyků, již mám nainstalované jazyky, ale nevim jak přeložit menu, lépe řečeno název jmenu, možnost v Home » Administer » Site building » Menus , abych tam měl možnost přeložit do ostatních jazyků, to tam není. Jak to přeložit abych když kliknu na jiné vlaječky abych měl v cizím jazyce i menu. Děkuji

návštěvník

Děkuji za odpověď. Modul i18n samozřejmě nainstalován mám. Spíše netuším jak přeložit bloky. Tzv. nadpis bloků, mám ho zatím pouze v jednom jazyce a když přepnu na jiný jazyk tak nadpis bloku zůstane stejný. Co jsem tak zkoušel , tak by to mělo jít přeložit, ale to bych musel pro každý jazyk vytvořit nový blok v daném jazyce, to to nelze udělat nak manuálně, pokud bych každý blok vytvářel znovu, tak by tam těch bloků bylo opravdu hodně. Jde to udělat nak centrále v nastavení bloku? Děkuji mnohokrát za odpověď. Lukas

návštěvník

Tak jsem na to už přišel, stačilo uprait v tématu soubor : block.tpl.php 

a doplnit: <h2><?php print t($block->subject) ?></h2> A již to mohu překládat jako rozhraní :-)

Nebo máte jiné řešení? Lepší?

Děkuji Lukáš

 

návštěvník

Dal jsem tam přesně to co píši nahoře. V originále je tam pouze <H3>...  bez funkce t() , celý to dáš do této funkce a je to. Když se koukneš do toho php souboru, tak to přesně uvidíš co se změnilo :-). Lukas

návštěvník

Já sem asi úplně blbej :) Dobrý den přeji... Kde najdu pouze knihovny editoru TyniMCE? Nenašel sem po rozbalení archivu s editorem žádnou složku, která by se tvářila jako že sdružuje knihovny. Můžu případně nakopírovat celý adresář TyniMCE? Děkuji předem za radu! :)

návštěvník

Ignorujte, vyřešeno :) Díky moc za článek! :)

návštěvník

Dobrý den,

chtěl bych se zeptat, jestli nevíte, jak nastavit modul TinyMCE tak, aby když se s ním edituje nějaký text, tak nepřidával inline css styly do html, ale vytvářel v html pouze třídy a css umístil do externího css souboru?

Díky

Profile picture for user Jan Polzer

Dobrý den, které vložené inline CSS máte na mysli?

V podstatě by to šlo udělat tak, že si styly specifikujete do style.css v tématu vzhledu a v nastavení WYSIWYG vyplníte políčko CSS Classes dle instrukcí pod ním.

Formátování v editoru pak budete zajišťovat výběrem z nabídky stylů, nikoli tlačítkami s barvami a podobně.

Přidat komentář

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Moje kniha o CMS Drupal

 

Kniha 333 tipů a triků pro Drupal 9


Více na KnihyPolzer.cz

Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

@maxiorel na Twitteru

Maxiorel na Twitteru