Erstellung individueller Formatvorlagen für Tabellen innerhalb von SharePoint 2013

SharePoint 2013 bietet dem Benutzer die Möglichkeit, mehrere Formatvorlagen für Tabellen zu wählen. Leider decken diese Formatvorlagen nicht immer alle Wünsche unserer Kunden ab.

Es gibt zwei Möglichkeiten, wie wir eine Tabelle individuell gestalten können. Die erste Möglichkeit wäre es, mit Hilfe von „CSS" gezielt die gewünschte Tabelle anzusprechen und somit zu gestalten.

Bei der zweiten Möglichkeit, welche innerhalb dieses Beitrages beschrieben wird, erstellen wir in unserer CSS-Datei eine eigene Formatvorlage. Diese Formatvorlage steht im gesamten SharePoint zur Auswahl.

picture_01.png 

Abbildung 1: Dropdown Tabellenformatvorlage´

 

1.  Anlegen einer neuen „rteTable"-Klasse mit unserem Namen

 

Wir erstellen eine neue CSS-Datei und fügen folgenden Code hinzu:

picture_02.png 

Abbildung 2: Neue Formatvorlage anlegen 

Dank der Eigenschaft -ms-name ist unsere Formatvorlage mit dem Namen: "My custom table" im Dropdown der Tabellenformatvorlage zu finden. Die Klasse dieser Tabelle lautet ms-rteTable-customTable.

2. Eigenschaften der Tabelle festlegen

 

Mit den folgenden Zeilen Code legen wir das Styling fest. In unserem Beispiel wird der Rand der Tabelle rot und der Text wird zentriert, horizontal sowie vertikal ausgerichtet.

picture_03.png

Abbildung 3: Eigenschaften der Tabelle festlegen

Jede individuelle Formatvorlage, die wir für Tabellen erstellen, wird mit der CSS-Klasse .ms-rteTable-customTable deklariert. Dadurch ist es möglich, die individuellen Tabellen zu stylen.

 3. Hochladen der CSS-Datei

 

Nun kann man die CSS-Datei in die Style-Library hochladen. Dazu navigiert man über die Websiteinhalte zur Formatbibliothek.

picture_04.png 

Abbildung 4: Formatbibliothek / Style-Library 

Nun kann die CSS-Datei eingebunden werden und unsere neu erstellte Vorlage steht in allen Tabellenformatvorlagen zur Auswahl.

picture_05.png 

Abbildung 5: Unsere Tabellenformatvorlage

Comments