webdesign mit sharepoint 2013

SharePoint 2013

Markus Hintner

Über mich

҉ Microsoft Certified

Solution Master | SharePoint

҉ http://www.entos.at

҉ http://blog.entos.at

҉ @MarkusHintner

҉ Profile im Web:MCP Virtual Business Card

http://www.xing.com/profile/Markus_Hintner

http://at.linkedin.com/in/markushintner

2

Markus Hintner

Inhalt

3

Markus Hintner

Design Manager

҉ HTML Dateien werden in Master Pages

konvertiert

4

Markus Hintner

Design Manager

҉ Aus HTML-Datei wird Master Page erzeugt

҉ .html und .master bilden ein Paar

5

Markus Hintner

Master Page

҉ ASP.NET 2.0 Konzept

҉ Master Page gibt Layout und Default-

Inhalt vor

6

Demo

Markus Hintner

Design Manager

҉ Snippets erlauben das Einfügen von

vorgefertigtem Code

8

Markus Hintner

Design Manager

҉ Nicht alle Controls sind in den Snippets

vorhanden -> z.B. fehlt Breadcrumb

҉ Im HTML File können keine ASP.NET

Controls hinzugefügt werden

҉ <!-- MS:… -->

҉ <!-- ME:… -->

9

Demo

Markus Hintner

Inhalt

11

Markus Hintner

Device Channels

҉ Alternative Masterpages für verschiedene

Endgeräte

҉ Device Channels definieren „Browser

Inclusion Rules“

12

Markus Hintner

Device Channels erstellen

҉ Site Settings | Look and Feel | Device

Channels

҉ Nur bei aktiviertem Publishing Feature

҉ Für Nicht-Publishing-Sites muss verstecktes

Feature „PublishingMobile“ aktiviert werden

13

Markus Hintner

Device Channels

҉ Reihenfolge der Channels relevant für die

Ermittlung des zu verwendenden Channels

҉ Übersicht über User Agent Strings:

҉ http://www.useragentstring.com/

14

Markus Hintner

Zuweisen einer Master Page

҉ Pro Channel kann eine Master Page

ausgewählt werden

҉ max. 10 Channels pro Site Collection

15

Markus Hintner

Device Channels testen

҉ Testen:

҉ User Agent Switcher von Firefox

https://addons.mozilla.org/de/firefox/addon/u

ser-agent-switcher/

҉ Hinzufügen von

„?DeviceChannel=DeviceChannelAlias“ an die

URL

16

Demo

Markus Hintner

Inhalt

18

Markus Hintner

Display Templates

҉ Display Templates erlauben einfache

Anpassung der Suchergebnisse

19

Markus Hintner

Display Template

҉ Erzeugen auf Basis eines vorhandenen Templates

20

Markus Hintner

Display Template

҉ .html Datei kann mit jedem Editor modifiziert werden

҉ ManagedProperties erweitern

҉ <style> Tags im Head werden beim Hochladen entfernt -> CSS Datei

҉ JavaScript muss nach dem ersten DIV Tag stehen und eingeschlossen sein durch:<!--#_ und _#-->.

21

Markus Hintner

Display Template

22

Markus Hintner

Result Type

23

Markus Hintner

Fertiges Display Template

24

Demo

Markus Hintner

Inhalt

26

Markus Hintner

JSLink

҉ Client-side Rendering von SharePoint

Feldern mit Hilfe von JavaScript

҉ JSLink-Property der SPField-

Klasse, XSLTListViewWebPart,…

27

Markus Hintner

JSLink

28

Markus Hintner

Beispiel

҉ http://www.sharepointnutsandbolts.com/2

013/01/using-jslink-to-change-ui-of-

sharepoint_20.html

29

Vielen Dank