Kachelbasierte Navigation in SharePoint mit Smart Tiles
Einführung
Eine gute Navigation ist entscheidend, damit eine SharePoint-Online-Website nützlich und ansprechend bleibt. Das Smart Tiles Webpart bietet eine kachelbasierte Navigation, mit der Sie klare, ansprechende Layouts erstellen, die wichtige Inhalte leicht erreichbar machen.
Dieser Artikel behandelt die wichtigsten Funktionen von Smart Tiles sowie das Hinzufügen und Konfigurieren des Webparts auf Ihren Seiten.
📝 Hinweis
Smart Tiles unterstützt keine klassischen Seiten. Verwenden Sie es nur mit der neuen modernen Benutzeroberfläche.
Smart Tiles hinzufügen
Öffnen Sie die Seite, auf der Sie die Kachelnavigation hinzufügen möchten, im Bearbeitungsmodus. Bewegen Sie den Mauszeiger über oder unter einen vorhandenen Abschnitt, bis eine Linie mit einem Pluszeichen erscheint, und klicken Sie darauf, um den Webpart-Katalog zu öffnen. Suchen Sie das Webpart „Smart Tiles“ durch Blättern oder über die Suchleiste und klicken Sie darauf, um es zur Seite hinzuzufügen.
💡 Tipp
Smart Tiles kann die gesamte Bildschirmbreite ausfüllen und so den verfügbaren Platz auf breiten Displays optimal nutzen.
Konfiguration des Webparts
Klicken Sie nach dem Hinzufügen des Smart Tiles Webparts auf die Schaltfläche Edit web part (Webpart bearbeiten), um rechts einen Konfigurationsbereich zu öffnen, in dem Sie die Einstellungen anpassen können.
Darstellungseinstellungen
Das Smart Tiles Webpart bietet eine Reihe von Optionen zur Anpassung der Kacheldarstellung, sodass Sie Ihre Navigation an das Branding und die Vorlieben Ihrer Organisation anpassen können.
- Font Size (Schriftgröße): Größe der Kachelbeschriftung, von 13px bis 42px, für gute Lesbarkeit auf allen Geräten.
- Icon Size (Symbolgröße): Größe des Kachelsymbols, von 2em bis 5em.
- Internal Indent (Innenabstand): Innenabstand der Kachel in Pixeln für ein ausgewogenes Erscheinungsbild.
- Icon Indent (Symbolabstand): unterer Abstand des Symbols in Pixeln zur visuellen Trennung.
- External Indent (Außenabstand): Außenabstand der Kachel in Pixeln zur Steuerung des Abstands zwischen Kacheln.
- Shadow (Schatten): Schlagschatten unter dem Symbol ein- oder ausblenden, um Tiefe zu erzeugen.
- Show Titles (Titel anzeigen): Kacheltitel für ein aufgeräumteres Aussehen ein- oder ausblenden.
- Hover Effect (Hover-Effekt): Effekte, die beim Überfahren einer Kachel mit der Maus ausgelöst werden.
Kacheln
Um eine Kachel zu verwalten, öffnen Sie ihr Kontextmenü.
Die Eigenschaften jeder Kachel sind in der folgenden Tabelle beschrieben:
| Eigenschaft | Beschreibung |
|---|---|
| Caption | Titel der Kachel, zur Übersichtlichkeit immer einzeilig dargestellt. |
| URL | Der mit der Kachel verknüpfte Hyperlink, der Benutzer zu relevanten Inhalten führt. |
| Color | Die Kachelfarbe, festgelegt auf die Akzentfarbe des aktuellen Designs oder eine der vordefinierten Farben. |
| Size | Die vertikale Größe der Kachel. |
| Icon | Auswahl aus vier vordefinierten Symbolsätzen: Fluent UI Icons, Azure Apps, Microsoft 365 Apps und Vitextra Apps. |
| Open in new tab | Den verknüpften Inhalt in einem neuen Browser-Tab öffnen. |
Zusätzliche Einstellungen
Neben den grundlegenden Kacheleigenschaften können Sie die Text- und Symbolfarbe festlegen. Der Text kann schwarz oder weiß sein, um einen guten Kontrast zum Kachelhintergrund zu bieten. Wenn Sie keine Farbe wählen, wird die Textfarbe aus der Kachelfarbe abgeleitet, sodass das Design stimmig bleibt.
📝 Hinweis
Die Option für die Symbolfarbe gilt nur für Fluent-UI-Symbole; andere Symbolsätze ignorieren diese Einstellung.
Einen Abschnitt in voller Breite hinzufügen (optional)
Um Smart Tiles in einem Abschnitt in voller Breite zu verwenden, fügen Sie der Seite zuerst einen solchen Abschnitt hinzu. Dieses Layout maximiert die visuelle Wirkung Ihrer Kacheln.
Klicken Sie auf das Symbol + auf der linken Seite der Seite, um einen neuen Abschnitt hinzuzufügen, und wählen Sie dann aus den Layoutoptionen Full-width section (Abschnitt in voller Breite), damit sich Ihr Inhalt über die gesamte Seitenbreite erstrecken kann.
Das Webpart zum Abschnitt hinzufügen
Um das Smart Tiles Webpart im Abschnitt in voller Breite zu platzieren, verschieben Sie es aus einem regulären Abschnitt in den Abschnitt in voller Breite, um den Bildschirmplatz voll auszunutzen.
Mit diesen Schritten können Sie eine klare, ansprechende Kachelnavigation in SharePoint Online erstellen.
Zusammenfassung
Smart Tiles bringt eine visuelle, kachelbasierte Navigation in SharePoint Online. Dieser Artikel hat gezeigt, wie Sie das Webpart hinzufügen, seine Darstellung konfigurieren, die Eigenschaften einzelner Kacheln verwalten und einen Abschnitt in voller Breite für maximale Wirkung nutzen.
Zusammen ermöglichen diese Optionen eine klare, ansprechende Navigation, die wichtige Inhalte leichter erreichbar macht und Ihrem Team effektiveres Arbeiten erleichtert.