Навигация плитками в SharePoint с помощью Smart Tiles
Введение
Хорошая навигация важна, чтобы сайт SharePoint Online оставался удобным и вовлекающим. Веб-часть Smart Tiles обеспечивает навигацию на основе плиток, позволяя создавать понятные и визуально привлекательные макеты, которые упрощают доступ к важному контенту.
В этой статье рассматриваются основные возможности Smart Tiles, а также добавление и настройка веб-части на ваших страницах.
📝 Примечание
Smart Tiles не поддерживает классические страницы. Используйте её только с новым современным интерфейсом.
Добавление Smart Tiles
Откройте в режиме редактирования страницу, на которую нужно добавить навигацию плитками. Наведите указатель над или под существующим разделом, пока не появится линия со знаком «плюс», и нажмите на неё, чтобы открыть коллекцию веб-частей. Найдите веб-часть «Smart Tiles», просматривая список или используя строку поиска, и нажмите на неё, чтобы добавить на страницу.
💡 Совет
Smart Tiles может занимать всю ширину экрана, максимально используя доступное пространство на широких дисплеях.
Настройка веб-части
После добавления веб-части Smart Tiles нажмите кнопку Edit web part (Изменить веб-часть), чтобы открыть панель настройки справа, где можно изменить параметры.
Параметры внешнего вида
Веб-часть Smart Tiles предлагает набор параметров для настройки внешнего вида плиток, чтобы навигация соответствовала фирменному стилю и предпочтениям вашей организации.
- Font Size (Размер шрифта): размер подписи плитки от 13px до 42px для читаемости на разных устройствах.
- Icon Size (Размер значка): размер значка плитки от 2em до 5em.
- Internal Indent (Внутренний отступ): внутренний отступ плитки в пикселях для сбалансированного вида.
- Icon Indent (Отступ значка): нижний отступ значка в пикселях для визуального разделения.
- External Indent (Внешний отступ): внешний отступ плитки в пикселях для управления расстоянием между плитками.
- Shadow (Тень): показать или скрыть тень под значком для придания глубины.
- Show Titles (Показывать заголовки): показать или скрыть заголовки плиток для более чистого вида.
- Hover Effect (Эффект при наведении): эффекты, срабатывающие при наведении указателя на плитку.
Плитки
Чтобы управлять плиткой, откройте её контекстное меню.
Свойства каждой плитки описаны в таблице ниже:
| Свойство | Описание |
|---|---|
| Caption | Заголовок плитки, всегда отображается в одну строку для наглядности. |
| URL | Гиперссылка плитки, направляющая пользователей к нужному контенту. |
| Color | Цвет плитки: акцентный цвет текущей темы или один из предопределённых цветов. |
| Size | Вертикальный размер плитки. |
| Icon | Выбор из четырёх предопределённых наборов значков: Fluent UI Icons, Azure Apps, Microsoft 365 Apps и Vitextra Apps. |
| Open in new tab | Открывать связанный контент в новой вкладке браузера. |
Дополнительные параметры
Помимо основных свойств плитки, можно задать цвет текста и значка. Текст может быть чёрным или белым для хорошего контраста с фоном плитки. Если цвет не выбран, цвет текста определяется цветом плитки, сохраняя гармоничный вид.
📝 Примечание
Параметр цвета значка применяется только к значкам Fluent UI; другие наборы значков игнорируют эту настройку.
Добавление секции во всю ширину (необязательно)
Чтобы использовать Smart Tiles в секции во всю ширину, сначала добавьте на страницу такую секцию. Этот макет максимально усиливает визуальное воздействие плиток.
Нажмите значок + слева от страницы, чтобы добавить новую секцию, затем в вариантах макета выберите Full-width section (Секция во всю ширину), чтобы контент занимал всю ширину страницы.
Добавление веб-части в секцию
Чтобы разместить веб-часть Smart Tiles в секции во всю ширину, переместите её из обычной секции в секцию во всю ширину, чтобы полностью использовать пространство экрана.
С помощью этих шагов вы сможете создать понятную и привлекательную навигацию плитками в SharePoint Online.
Итоги
Smart Tiles добавляет в SharePoint Online наглядную навигацию на основе плиток. В этой статье показано, как добавить веб-часть, настроить её внешний вид, управлять свойствами отдельных плиток и использовать секцию во всю ширину для максимального эффекта.
Вместе эти возможности позволяют построить понятную и привлекательную навигацию, которая упрощает доступ к важному контенту и помогает команде работать эффективнее.