Blogg

Alfresco och ECM

CKEditor plugin för Alfresco Share

maj 11 2011

Kategorier : Produkter och tillägg, Tips och Tricks

Alfresco Share använder som standard TinyMCE för direktredigering av html filer. För ett projekt behövde jag kunna anpassa TinyMCE, men den version som Alfresco använder har en del Alfresco specifika anpassningar. Så istället använde jag mig av CKEditor, ckeditor.com.

Funktionalitet

  • All standardfunktionalitet i CKEditor.
  • Anpassade konfigurationsfiler
  • Infoga bildfiler direkt från Alfresco Share webbplats.

För formulär i Alfresco är det enkelt att skapa nya kontroller. I detta fall så anger du bara att du vill använda den nya kontrollen enligt

<appearance>
   <field id="cm:content">
      <control template="/org/alfresco/components/form/controls/ckeditor.ftl">
         <control-param name="forceEditor">true</control-param>
      </control>
   </field>
</appearance>

Själva kontrollen inklusive källkod ladda ner från Share Extras projektet. Mer om hur du konfigurerar formulär på Alfresco Wiki
För att installera, kopiera filen ckeditor-form-control-0.1.jar till tomcat/webapps/share/WEB-INF/lib. Sedan ändrar du dina formulärdefinitioner enligt ovan eller kopierar filen ckeditor-config-custom.xml (ta bort filändelsen sample) till tomcat/shared/classes/alfresco/web-extension och startar om.

Vill du använda en anpassad konfigurationsfil för att ange vilka knappar som visas och styra utseende så kan du ange vilken med

<control-param name="settingsfile">components/editors/ckeditor/my-config.js</control-param>

Sökvägen skall vara utan inledande / och sedan till den plats där du placerat filen. Om du skapar en bra config fil så inkluderar jag den gärna om du skickar den till mig. Kommer framöver lägga till några alternativa konfigurationsfiler.

CKEditor filbläddrare

För att bläddra efter bilder så klickar du bara ”bläddra på server” så listas miniatyrbilder. Jag baserade den på Image dashleten som finns i Share, så naturligtvis kan du klicka på bilden och få en full förhandsgrandskning. Välj en bild genom att klicka namnet.