Bögös Jenő személyes honlapja

Érdekes dologgal találjuk szembe magunkat, amikor Drupal rendszerünkbe integráljuk a TinyMCE szövegszerkesztőt és egy olyan tartalmat hozunk létre benne, melynek a beviteli formája Filtered HTML és amiben képeket helyezünk el különböző elrendezésben (pl. jobbra, illetve balra "úsztatva"). Mentés után a képeink nem az általunk megadott módon fognak megjelenni. Erre a problémára keressük meg a megfelelő megoldást.

Van egy könnyebb, gyorsabb, de kockázatosabb, valamint egy kicsit pepecselősebb, lassabb, de biztonságosabb megoldás a probléma kezelésére. A gyors és egyszerű megoldás az, hogy Full HTML formában mentjük el a tartalmat. Ez nem javasolt olyan rendszeren, melyen több felhasználó vihet fel tartalmat, mivel bármilyen kódot "lenyel" a rendszer és nem biztos, hogy minden felhasználó tisztában van azzal, hogy mit is hajt végre egy-egy esetben. Ezt a megoldást tehát ilyen esetben ne tekintsük megnyugtató megoldásnak a rendszer biztonsága érdekében.

A jó megoldás a WYSIWYG Filter modul használata lesz számunkra. De mielőtt ennek a modulnak a telepítéséről és konfigurációjáról szólnék, nézzük meg, hogy miért is nem megy alapból a képek helyes igazítása a tartalomban. A HTML-szűrő a html elemekből - többek között - eltávolítja a CSS stílusdeklarációkat. Hiába vesszük fel az engedélyezett html elemek közé az <img> tagot a TinyMCE a tagba teszi a stílusdeklarációt pl:

<img src="valami.jpg" sytle="float: left" alt="valami" />

<img src="valami.jpg" alt="valami" />

Beüzemelés:

• Töltsd le a WYSIWYG Filter modult
• Kitömörítés után olvad el a modul readme.txt állományát (ezt minden modul használata előtt érdemes megtenni)
• Másold be a modul kitömörített könyvtárát a sites/all/modules könyvtárba
• Kapcsold be a modult az admin/build/modules oldalon
• Hozz létre egy új beviteli formát
• Engedélyezd a megfelelő csoportoknak
• Jelöld be a WYSIWYG Filter-t és a HTML korrektort, majd mentsd el
• Menj az Újraraendezés menüre
• Legyen felül a WYSIWYG Filter (mentés)
• A Beállítás menüben finomhangold a rendszert (A HTML elements and attributes részhez vedd fel a szükséges elemeket. A képek szerkesztővel való igazításához pl. ezt: img[style|src|alt|width|height] A Stílus tulajdonságok-nál jelöld be a float, left, right opciókat. Mentés)
• A Wysiwyg beállítási felületén az általad létrehozott beviteli formához engedélyezd a szerkesztő használatát.

Ezzel a képek igazítása a szerkesztő felületén keresztül megoldható, és nem kell a Full HTML beviteli formát sem használni, ami növeli a rendszer biztonságát.
Azoknak a tartalmaknak, melyekben képeket használsz, ezt a beviteli formát engedélyezd.

A modul beállítási lehetőségei sokkal szélesebb körűek, mintsem csak a fent leírt lehetőség. A finomhangolásra rendkívül precíz lehetőség nyílik ezzel a modullal. Csak néhány szóban teszek említést arra, hogy a fentiekben mit is engedélyeztünk, hogy ezzel is egy kicsit jobban átlássuk a modul működését.

A HTML elements and attributes résznél megadhatjuk, hogy milyen HTML elemeket fogadjon el a rendszer (jelen esetben hozzáadtuk a img tagot) és azoknak milyen tulajdonságai lehetnek (hozzárendeltük: style, src, alt, width, height tulajdonságokat). Ennél a pontnál használható lehetőségeket ez az oldal írja le bővebben, érdemes rápillantani. A Stílus tulajdonságok-nál pedig megadhatjuk, hogy milyen stíluselemek maradhatnak a kódban.