Utvecklingstips

Inställningar för TinyMCE i EPiServer 6

EPiServer använder sig av en HTML-editor från Tiny MCE för att redigera html-egenskaper och med TinyMCE finns det stora möjligheter att ändra vilka val och alternativ användaren ska få.

Genom att använda EPiServers admin-gränssnitt kan man styra exakt vilka knappar och boxar som ska visas, både globalt och för varje sidegenskap. Men det går naturligtvis att göra ännu mer! Faktum är att du har tillgång till alla init-inställningar för TinyMCE även när du använder den i EPiServer CMS.

Att ändra init-inställningarna

I normala fall skulle du tilldela TinyMCE sina inställningar med javascriptmetoden tinyMCE.init().

tinyMCE.init({
     paste_auto_cleanup_     on_paste : true,
     theme_advanced_styles : ""Tabellbeskrivning=table-description"",
     theme_advanced_resizing : true
});

För att göra samma sak i EPiServer CMS 6 skapar du en klass med valfritt namn och tilldelar den attributet TinyMCEPluginNonVisual. Med TinyMCEPluginNonVisual kan du sätta ett antal properties för att konfigurera TinyMCE.

[TinyMCEPluginNonVisual( AlwaysEnabled = true,
    PlugInName = "TinyMCE editor settings",
    DisplayName = "Init options",
    Description = "Init options for the HTML editor",
    EditorInitConfigurationOptions = @"{
          paste_auto_cleanup_on_paste : true,
          theme_advanced_styles : ""Tabellbeskrivning=table-description"",
          theme_advanced_resizing : true }")] 

    public class TinyMCESettings
    {

    }

I exemplet ovan har jag bland annat lagt till en cssklass som dyker upp i listan ”Stilar” i editorn och som användaren kan använda vid redigering av en text. TinyMCE erbjuder dock fler inställningar än de jag användar i exemplet ovan, här är en komplett lista:

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration.

Här kan du läsa mer om TinyMCE:

http://tinymce.moxiecode.com

Andra bloggar om: 
 
Johanna Gustafsson

2010-12-03 kl. 15:46

Web Analytics