Документерра: руководство пользователя

Иконка проекта

Индивидуальные настройки делают вашу документацию более личной и узнаваемой. Вот почему система Документерра предоставляет вам различные варианты брендинга, которые не требуют знания CSS. В этом разделе мы расскажем, как добавить иконку в проект и изменить порядок ее отображения в списках публикаций.

Добавление иконки проекта

Чтобы добавить иконку проекта, выполните следующие действия:

Откройте страницу Проекты.
Нажмите кнопку с тремя вертикальными точками, затем нажмите кнопку Настройки.
Откроется страница Основные настройки.
Перетащите иконки в соответствующие области (рекомендуется не менее 32x32 пикселей).
Нажмите Сохранить изменения.
Как вы могли заметить, мы применяем эти настройки к проекту, поэтому, когда вы его публикуете, его значок и заголовок будут отображаться на левой боковой панели.
Результат:

Если вы хотите добавить иконку к существующей публикации, откройте настройки публикации и выполните описанные выше действия.

Ниже приведено еще несколько сценариев.

Сценарий №1. Добавление иконки публикации на домашнюю страницу

Если вы хотите, чтобы иконка публикации отображалась на Домашней странице, выполните следующие действия.

Во-первых, добавьте иконку для публикации, как описано выше.
На домашней странице выберите параметр Редактировать домашнюю страницу.
Вставьте следующий код в поле Шаблон разметки ссылки на публикацию:
Copy Code
CSS
<div class="pubItem">
<a href="{{URL}}" title="{{NAME}}"><img src="{{ICON_URL}}" alt="{{NAME}}"/>{{NAME}}</a>
</div>
Это должно выглядеть следующим образом:
Нажмите Сохранить изменения.

Если иконка больше, чем заголовок публикации, выполните следующие действия:

Откройте настройки домашней страницы портала.
Прокрутите вниз и нажмите Показать редактор стилей домашней страницы.
Добавьте код, как показано на скриншоте.
Нажмите Сохранить изменения.

Сценарий №2. Добавление на домашнюю страницу иконок публикации и наведения мыши

Выполните следующие действия:

Во-первых, добавьте иконки для публикации, как описано выше.
Откройте настройки домашней страницы портала.

Добавьте следующий код в поле Шаблон разметки ссылки на публикацию.

Copy Code

HTML

<div class="pubItem">
  <a href="{{URL}}" title="{{NAME}}"><img src="{{ICON_URL}}" alt="{{NAME}}"/><img src="{{HOVER_ICON_URL}}" class="pubHoverIcon" alt="{{NAME}}"/> {{NAME}}</a>
</div>

Затем прокрутите вниз и нажмите Показать редактор стилей домашней страницы.

Добавьте следующий код:

Copy Code

HTML

.pubHoverIcon,
.pubItem a:hover img
{
display: none;
}

.pubItem a:hover .pubHoverIcon
{
display: inline-block;
}

Если иконки выше, чем заголовки публикаций, добавьте также следующий код.
Copy Code
HTML
.pubItem img
{
vertical-align: middle;
}
Нажмите Сохранить изменения.

Порядковый номер проекта Стили и скрипты проекта