A Drupal 6, a Wysiwyg API, a TinyMCE 3 és a Drupal teaser megadása és különválasztása a teljes tartalomtól
A WYSIWYG editorok lényege, hogy a felhasználó HTML tudás nélkül is tudjon webes felületen formázni. Ezt úgy érjük el, hogy a html szöveget tartalmazó textarea-ra egy JavaScript szerkesztőfelületet adunk, ami a begépelt és formázott szöveget HTML kódokká alakítja át.
Drupal alá is létezik sok közkedvelt WYSIWYG editor modul, pl: FCK Editor vagy a TinyMCE Editor, melyek mindig előkelő helyen vannak a leggyakrabban letöltött Drupal modulok között.
Nekem a kedvencem mégis a Wysiwyg API modul, mégpedig azért, mert egy alapvető problémát old meg: a beviteli formák összeütközése a WYSIWYG editorral a beviteli forma szűrői miatt. Ez röviden annyit takar, hogy a többi WYSIWYG editor jogosultsághoz van rendelve, tehát ha egy felhasználónak megvan a joga az editorhoz akkor használhatja, de ha kiválasztja Filetred HTML beviteli formát, amelyben a sortörések, url-ek stb. szűrve vannak, akkor az eléggé össze fog akadni a WYSIWYG editorral. Ilyenkor ugyebár a felhasználó boldogan formázza a szöveget, majd elmenti a Drupal a szűrt beviteli formában és egyáltalán nem úgy néz ki a végeredmény mint ahogy azt akarta a felhasználó. Persze Ő soha nem fog rájönni, hogy mimiatt történt, és úgy gondolja valami fejlesztési hiba van a dologban. Természetesen ez nem fejelsztési hiba, de akkor sem várható el egy editortól, hogy rájöjjön mi okozza a problémát.
A Wysiwyg API modul erre talált gyógyírt, mégpedig azzal, hogy az editor használhatóságát a beviteli formához lehet megadni, nem pedig egy user jogosultság. Minden definiált beviteli formához külön-külön más és más editoroka lehet beállítani. Ekkor két kérdés merül fel:
- mi az hogy más és más WYSIWYG editorokat lehet rendelni?
- bárki használhatja az editort hisz nincs jogosultsághoz kötve?
Az első kérdésre a válasz az, hogy a Wysiwyg API egyszerre több WYSIWYG editort képes kezelni. Ez annyit takar, hogy a beállítási oldalán fel van sorova egy csomó WYSIWYG editor (pl MarkItUp, FCK editor vagy a TinyMCE editor), és amelyik fel van telepítve a megadott könyvtárba azt ki lehet választani egy legördülőből a beviteli formák felsorolása mellett.
A másodikra a válasz: nem. A beviteli formák beállítása oldalán meg lehet adni, hogy egy adott beviteli formát milyen csoport hasznáhat, és tetszőleges számút létrehozhatunk. Tehát pl, ha a Full HTML-t meg akarjuk hagyni a HTML-t értő és WYSIWYG editort nem használó csoport számára, akkor létrehozunk egy új beviteli formát, amelyben szintén nincs semmilyen szürő és hozzárendeljük a kívánt csoporthoz.
Ennyit a Wysiwyg API modul szépségéről, térjünk rá a cikk lényegére, a teaser beállítására.
Miután feltelepítettük a modult észrevehetjük, hogy eltűnt a teaser lehetőségére szolgáló gomb a body rész felett. Ez annyit takar hogy innenstől kezdve magunk nem állíthatjuk be hogy a teaser rész meddig tartson és azt sem, hogy ez akár különbözzön a tartalom többi részétől.
Mivel én hasznosnak találom ezt a funkciót, és többször is szükség volt már rá, ezért elkezdtem kutakodni és utánajárni hogy is lehetne megoldani. A TinyMCE editorban van egy pagebreak plugin, tehát lehetséges hogy megoldódik a probléma, mert a Drupal body részében egy helyre beírjuk a
<!--break-->
kifejezést, akkor ezt a Drupal úgy értelmezi, hogy az előtte lévő rész a teaser rész. Ez eddig szép és jó, csak kéne egy ilyen gomb az editor szerkesztőfelületére.
Ehhez a modul editors/tinymce.inc fájl wysiwyg_tinymce_plugins() fgv-ét kell módosítanunk.
A végén találunk benne egy ilyen részt:
-
if ($editor['installed version'] > 3) {
-
$plugins['xhtmlxtras'] = array(
-
'path' => $editor['library path'] .'/plugins/xhtmlxtras',
-
'buttons' => array('cite' => t('Citation'), 'del' => t('Deleted'), 'abbr' => t('Abbreviation'), 'acronym' => t('Acronym'), 'ins' => t('Inserted')),
-
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/xhtmlxtras',
-
'internal' => TRUE,
-
'load' => TRUE,
-
);
-
$plugins['safari'] = array(
-
'path' => $editor['library path'] .'/plugins/safari',
-
'extensions' => array('safari' => t('Safari compatibility')),
-
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/safari',
-
'internal' => TRUE,
-
'load' => TRUE,
-
);
-
}
ezt kell kibővítenünk a következő képpen:
-
if ($editor['installed version'] > 3) {
-
$plugins['xhtmlxtras'] = array(
-
'path' => $editor['library path'] .'/plugins/xhtmlxtras',
-
'buttons' => array('cite' => t('Citation'), 'del' => t('Deleted'), 'abbr' => t('Abbreviation'), 'acronym' => t('Acronym'), 'ins' => t('Inserted')),
-
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/xhtmlxtras',
-
'internal' => TRUE,
-
'load' => TRUE,
-
);
-
$plugins['safari'] = array(
-
'path' => $editor['library path'] .'/plugins/safari',
-
'extensions' => array('safari' => t('Safari compatibility')),
-
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/safari',
-
'internal' => TRUE,
-
'load' => TRUE,
-
);
-
$plugins['pagebreak'] = array(
-
'path' => $editor['library path'] .'/plugins/pagebreak',
-
'buttons' => array('pagebreak' => t('Drupal Teaser')),
-
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/pagebreak',
-
'internal' => TRUE,
-
'load' => TRUE,
-
);
-
}
Ekkor a TinyMCE editor beállítási oldalán a gombok között megjelenik a Drupal Teaser gomb. Ha kiválasztjuk, akkor a tartalom szerkesztésénél láthatjuk, hogy megjelenik és ha megnyomjuk megjelenik a
<--! pagebreak -->
felirat a szövegben. Várjuk a csodát, hogy majd biztos jó lesz, de sajnos nem működik. Ennek az az oka, hogy a TinyMCE editor pagebreak plugin-je a következőt helyettesíti be:
<--! pagebreak -->
holott a Drupal ezt tudja értelmezni:
<!--break-->
Ebből látszik, hogy a plugin JavaScript fájljába is bele kell kontárkodnunk egy kicsit, mégpedig a modul könyvtárán belül a tinymce/jscripts/tiny_mce/plugins/pagebreak/editor_plugin.js fájlba. Keressük meg a részt, ami beleteszi a kifejezést:
"pagebreak_separator","<!-- pagebreak -->"
és írjuk át a megfelelőre:
"pagebreak_separator","<!---break-->"
Ekkor ha újra megpróbáljuk beállítani, hogy meddig tartson a teaser rész, tökéletesen működni fog.
Mostmár csak egy dolgot akarunk megoldani, mégpedig hogy a teaser rész különbözhessen a tartalomtól.
Ennek megoldására a wysiwyg.module wysiwyg_form_alter() (hook_form_alter()) fgv-ét kell módosítanunk.
Ha megnézzük az egész fgv. csak ennyitből áll:
-
function wysiwyg_form_alter(&$form, &$form_state) {
-
$form['#after_build'][] = 'wysiwyg_process_form';
-
// Disable 'teaser' textarea.
-
if (isset($form['body_field'])) {
-
unset($form['body_field']['teaser_js']);
-
$form['body_field']['teaser_include'] = array();
-
}
-
}
Kommentbe benne is van, hogy a teaser részt kiszedi a modul. A teaser_js részt megszűnteti, ez jó is nekünk így, mert egyrészt összeakad a modullal a js (ez az, ha rányomunk a gombra akkor DHTML-el felkerül egy újabb textarea amelyben megadhatjuk a teaser rész tartalmát), másrészt pedig a WYSIWYG editorral már meg tudjuk oldali a teaser elkülönítését, és így legalább szerkeszthető is (úgy értem a WYSIWYG editorral). Nekünk gyakorlatilag csak az “Összefoglaló megjelenítése a teljes nézetben is” checkbox kellene, hogy meg tudjuk adni a teaser beépüljön a tartalomba, vagy különböző legyen.
Ezt úgy tudjuk elérni kiszedjük (vagy kikommentezzük) a következő részt:
-
$form['body_field']['teaser_include'] = array();
Így a wysiwyg_form_alter() fgv. a követekző képpen módosul:
-
function wysiwyg_form_alter(&$form, &$form_state) {
-
$form['#after_build'][] = 'wysiwyg_process_form';
-
// Disable 'teaser' textarea.
-
if (isset($form['body_field'])) {
-
unset($form['body_field']['teaser_js']);
-
//$form['body_field']['teaser_include'] = array();
-
}
-
}
Ekkor szépen megjelenik a checkbox, és beállíthajuk a teaser-t is.
hosszu.kalman Reply:
May 14th, 2009 at 12:11 pm
Nagyon szívesen, én is szívtam vele azért is írtam le.
[Reply]