Op de JUG-bijeenkomst van 20/02/2016 heeft Jurgen Gaeremyn een boeiende voorstelling gedaan hoe men JCE kan aanpassen aan de gebruikers (en de devices). Welke onderwerpen hierbij zijn behandeld kan je zien op zijn blog terwijl in dit artikel bijkomende nota's en belangrijke opmerkingen te lezen zijn.

Alle besproken configuraties zijn te vinden onder het menu Component > JCE Editor.

1. Global Configuration

1.1 Formatting & Display

Container Element & Enter key: wat moet er gebeuren bij het intypen van de Enter-toets. Het effect test je best uit omdat het kan afhangen van welke template je gebruikt.
Reset Editor Styling:  bij “No” zal hij de stijlen van de template proberen over te nemen.
Editor Styles: kies je voor “Custom CSS Files” dan kan je jouw eigen CSS stijlen laten toepassen. Voorbeeld uit cursus extra css bevatte alzo:

@import url(“template.css”)
@import url(“content.css”)

Je kan daar ook de stijlen zetten die je m.b.v. Firefox debug voor de content-tags (div ) ontwaart.

2. JCE Editor Profiles

Voor je de Default begint te wijzigen, weet dat je een Copy kan maken. Een backup van een profiel is ook aangeraden. De Restore is snel uitgevoerd (zoals uit de demonstrate bleek).

2.1 Tab Setup

User Group: let op als je hier te gespecieerd gaat configureren: als je later een nieuwe Gebruikersgroup maakt, dan zou het kunnen dat die niets ziet omdat je er geen default voorzien is in jouw JCE-configuratie setting.

2.2 Tab Features & Layout

Editor Toggle: hiermee kan je de Source-code editor op- afzetten. Zet deze op af omdat er een meer gesofisticeerde code-editor voorhanden is (via een icoon in de JCE-toolbar).
Bemerk dat je functionaliteiten, bewerk-opties in de toolbar van de JCE-editor plaatsen of juist wegnemen door de desbetreffende iconen te slepen van Current Editor Layout van/naar Available Buttons & Toolbars.

2.3 Editor Parameters

2.3.a Filesystem

File Browser Position: de popup om afbeeldingen te kiezen of bestanden te uploaden, de zogenaamde Image Uploader, bestaat uit 2 delen. Standaard wordt daarin onderaan de navigatie boomstructuur met onderliggende bestanden afgebeeld, terwijl bovenaan de specificaties voor het gekozen bestand ingevuld kunnen worden. Deze schikking is contra-intuïtief. Dus zet je best de File Browser Position op Top.

JCE BestandsBrowser bovenaan geplaatst

2.3.b Advanced

XML-formaten waarin Javascript kan ingebed worden, zullen door Joomla geweigerd worden voor opladen, ook als je ze in JCE configuratie toelaat.

2.4 Plugin Parameters

In de links geplaatste grijze toolbar zie je alle functionaliteiten uit de JCE-editor werkbalk. Met een klik op een ervan worden dan aan de rechterzijde alle mogelijke configuraties getoond die je eventueel wijzigen kan.

File Browser : het is aangeraden om de Permissions te wijzigen zodat editors geen folders kunnen verwijderen noch hernoemen, want hernoemde of verwijderde folders, bestanden kan leiden tot missing links.

Clipboard: omdat auteurs text kunnen copieren uit verschillende bronnen, is het aangewezen om de oorsrponkelijke stijl niet mee over te nemen. Dus zet Strip Class Atrib. en Remove all Spans | Styles op “Ja” .

Remove by Regular Expression: hier kan je een regular expression specifiëren die gewenste tekst-correcties kan uitvoeren. Let wel: dit is enkel van toepssing bij het plakken vanuit het klembord (dus niet op alle tekst in de editor).

Link: Target: als de meeste linken in de geschreven artikels verwijzen naar ander sites, dan zet je dit best standaard op "Open in new window".
Link: Relationship page to target: heeft invloed op SEO (kan je evt. op NoFollow zetten).

Popups: zet bij voorkeur op JCE MediaBox Popups om mooiere pop-ups te hebben. Let op met het zetten van Auto-Pop-up op Automatisch want je kan niet speciciëren op welke pagina wel/niet.

Styles: hiermee kan je Stijlen definiëren die je auteurs kunnen toepassen. JCE past dan de css-class of de html-attributen toe die je hier gedefinieerd hebt. Hoewel niet getoond in de bijeenkomst, hier enkele voorbeelden.

Met selectie-criterium en (te creëren) tag Enkel de class (hier van Bootstrap) is gespecifieerd
Styles lyst nummer groen definitie   Styles groene knop definitie

In de editor sie je de stijlkeuzes als volgt:

Styles in JCE editor

en na toepassing zal de code er als volgt uitzien:

Styles HTML code

Voor het gebruikte template wordt dit:

Styles front end

 

3. Varia

Popups vereisen de gratis plugin JCE MediaBox.

PDF en Google Docs embedden kan je doen met de JCE Media manager.

Template manager van JCE is niet gemakkelijk in gebruik. Heb je hier nood aan, neem dan beter die van NoNumber.

Meer informatie op https://www.joomlacontenteditor.net/

Een Nederlandstalige handleiding voor JCE kan je hier downloaden (5 Mbytes) evenals de presentatie van Jurgen in PDF-formaat (0,8 MBytes)(maar het geschrevene is een flauwe neerslag van de demonstratie en uitleg tijdens de bijeenkomst).