Logo

Blog o JavaScript, jQuery, HTML5, CSS3 i 4. Porady jak pisać dobrej jakości kod, tutoriale, nowości.

TinyMCE: własne atrybuty przy formatowaniu tekstu

TinyMCE to jeden z najpopularniejszych edytorów tekstowych, które bardzo ułatwiają życie użytkowników nieznających HTML. Czasami domyślne ustawienia to za mało, a w jednym projekcie musiałem dodać dodatkowe style i atrybuty dla justowanego tekstu. Jak to zrobić?

TinyMCE ma bardzo dobrą dokumentację i można dużo rzeczy konfigurować wg własnych potrzeb i wymagań. W ostatnim czasie musiałem dodać atrybuty dla justowanego tekstu, który miał wyświetlać się we flashowej wersji aplikacji. Problem w tym, że flash nie rozumie (jeszcze) "polecnia" style="text-align: [wartość]".

TinyMCE: formats

Takiej modyfikacji można dokonać dzięki ustawieniom formats. One nadpisują domyślne style dla poszczególnym elementów. Co można nadpisać?

Mnie interesowały cztery pierwsze opcje.

Skoro już wiadomo co, to teraz powstaje pytanie jak.

tinyMCE.init({
   // ...
   formats: {
      alignleft : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', styles : {'textAlign':'left'}, attributes : {'align':'left'}},
      aligncenter : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', styles : {'textAlign':'center'}, attributes : {'align':'center'}},
      alignright : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', styles : {'textAlign':'right'}, attributes : {'align':'right'}},
      alignfull : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', styles : {'textAlign':'justify'}, attributes : {'align':'justify'}}
   },
   // ...
});

Dla justowania dodałem odpowiednie seketory (selectors), ustawiłem odpowiednie style (styles) oraz dodałem niezbędne atrybuty (attributes) rozumiane przez flash'a. Oczywiście wymienione przeze mnie parametry to tylko część. Można ich definiować znacznie więcej. Po te informacji zapraszam do dokumentacji.

Autor wpisu

Piotr cichosz (shpyo) — Front-end developer Twórca kilku serwisów internetowych oraz autor kilku blogów. Pasjonat nowych, otwartych technologii.

Komentarze

Dodaj komentarz