Использование виджетов в Adobe Muse

С помощью виджетов в Adobe Muse на сайт можно добавлять интерактивные функции и динамически формируемое содержимое. Виджеты представляют собой готовые настраиваемые объекты для таких элементов, как меню, формы, слайд-шоу и многих других. Adobe Muse предлагает ряд виджетов, упрощающих работу с комплексным веб-дизайном. 

Виджеты в составе Adobe Muse можно настраивать в соответствии с дизайном сайта, что позволяет интегрировать их с веб-страницами сайта. В библиотеке виджетов представлены все готовые функции сайта (Виджеты), которые можно перетаскивать на страницы, а также настраивать их работу и определять их стиль.

В состав Adobe Muse входят следующие виджеты:

• Виджеты «Композиция»: позволяют пользователю, работая в области веб-страницы, изменять содержимое в другой области. При этом изменении появляется затухающая или скользящая анимация. 
• Виджеты «Форма»: позволяют добавить на веб-сайт контактную информацию пользователей. В зависимости от выбранного виджета «Форма» доступны разные поля формы.
  
• Виджеты «Меню»: позволяют создавать меню, добавляя разделы динамически или вручную, а также задавать для них состояния. В меню каждой страницы автоматически будет активной ссылка на текущую страницу.
• Виджеты «Панель»: отображают только одну панель содержимого, с которой можно переключаться на другие панели с помощью интуитивно понятной навигации. Выбирайте скользящую раздвижную панель или привычную панель со вкладками.
• Виджеты «Слайд-шоу»: позволяют с легкостью создать галерею изображений с помощью эффектной анимации. Эти виджеты разработаны для слайд-шоу на основе простых изображений, для комплексной графики подойдет виджет «Композиция».
• Виджеты «Социальная сеть»: позволяют с легкостью настраивать пользовательский код HTML и встраивать его в страницы Adobe Muse. Большинство виджетов для сети Интернет предоставляют функции, которые также можно реализовать, встроив код HTML с веб-сайтов сторонних разработчиков. Вы можете сэкономить время, добавляя и настраивая веб-содержимое прямо в приложении Adobe Muse, вместо того, чтобы создавать код вне приложения и затем встраивать его в Adobe Muse как встроенный HTML.

Добавление виджетов на страницу Adobe Muse

С помощью библиотеки виджетов можно выбирать нужные виджеты и добавлять их на страницы сайта Adobe Muse. Чтобы добавить виджеты, выполните следующие действия:

Конфигурация и настройка виджетов

Adobe Muse позволяет настраивать виджеты после размещения их на веб-страницах посредством панели «Параметры». Контекстная панель Параметры позволяет применить изменения в настройках, свойственных выбранному виджету. Панель «Параметры» содержит настройки, определяющие отображение содержимого.

Параметры «Заливка» и «Обводка» позволяют значительно улучшить дизайн виджета. Если виджет содержит текст, для изменения текста или его стиля можно использовать панель «Текст» (Окно > Текст или параметр «Текст» на панели управления).

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

Выбор вложенных элементов в виджет

При перетаскивании виджета из библиотеки на страницу вы также фактически помещаете вложенный набор контейнеров виджета. Эти контейнеры можно выделять и редактировать в зависимости от их иерархической организации.

При работе с виджетами необходимо корректно выделять виджет и его контейнеры. В приложении Adobe Muse индикатор выделения отображает текущую область выделения. Индикатор выделения, расположенный в левом верхнем углу окна Adobe Muse, отображает текущую область выделения и раскрывающееся меню, которое позволяет просматривать объект в зависимости от его состояния.

В примерах ниже индикатор выделения отображает выделенную область страницы (если не выделен ни один объект на странице), виджет «Меню» (после выделения виджета «Меню») и раздел «Меню» (контейнер в виджете «Меню»).

Если щелкнуть виджет целиком один раз, в индикаторе выделения отобразится слово «Виджет». Если щелкнуть виджет еще раз, можно выбрать вложенный контейнер виджета. В индикаторе выделения в этом случае отобразится слово «Контейнер». Продолжив щелкать виджет, можно выбрать различные вложенные элементы контейнеров (например, текстовые фреймы).

Когда выбран текстовый фрейм, в индикаторе выделения отображаются слова «Текстовый фрейм». Щелкая виджет для выбора его вложенных элементов, рекомендуется обращаться к индикатору выделения, чтобы отслеживать выбор элементов. Мы будем выбирать различные контейнеры (например, отельные кнопки меню навигации), чтобы обновить состояния кнопок. Это позволяет управлять внешним видом кнопок при первой загрузке страницы, при наведении указателя мыши на них, а также при их нажатии. Также можно задать состояние «Активное», позволяющее посетителю определить, на какой странице он находится в текущий момент, визуально выделив соответствующую кнопку.

Чтобы выбрать вложенные контейнеры виджета, можно щелкнуть нужный элемент несколько раз. Обратите внимание на индикатор выделения и параметры, представленные на панели «Состояния», чтобы определить, что выбран нужный сложенный элемент для изменения.

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

Настройка виджетов с помощью панели «Параметры»

После перетаскивания виджета из окна Библиотека виджетов на страницу в верхнем правом углу виджета появится синий значок с белой стрелкой. Он появляется при выделении виджета. Нажмите этот значок, чтобы открыть меню Параметры.

Для каждого виджета доступны свои параметры, поэтому настройки, которые можно задать в меню Параметры, могут отличаться. Параметры позволяют управлять работой виджета (например, для слайд-шоу можно выбрать автоматическое воспроизведение или указать, что посетителю нужно щелкнуть миниатюру каждого изображения, чтобы просмотреть его в более крупном размере) и его отображением (например, можно задать тип анимированного перехода при показе каждого нового изображения).

При разработке веб-сайтов вам представится возможность настроить эти параметры и вместе с клиентами определить наиболее подходящие варианты дизайна для определенного проекта. Следует помнить, что в любое время, даже если сайт уже опубликован, можно вернуться к нужному файлу .muse, выбрать виджет, нажать синюю кнопку со стрелкой и в меню Параметры скорректировать нужные параметры для изменения виджета. Затем можно повторно опубликовать веб-сайт с внесенными изменениями.

Виджеты Меню можно использовать для динамического отображения названий страниц сайта и автоматически создавать ссылки на такие страницы. Это значительно упрощает добавление на страницы элементов навигации по сайту на основе карты сайта в представлении План. Теперь можно забыть о восстановлении неработающих ссылок. Также можно не включать определенные страницы в динамически обновляемые виджеты Меню. Для этого достаточно в приложении План щелкнуть правой копкой мыши миниатюру нужной страницы и отменить выбор параметра Включить страницу в навигацию. Этот параметр установлен по умолчанию (когда он включен, рядом с ним отображается флажок).

Кроме того, можно вручную настроить виджеты Меню, если хотите самостоятельно присвоить имена кнопкам и добавить ссылки на определенные страницы, вместо того чтобы программа Adobe Muse сама создала пункты меню. Для этого в меню Параметры в разделе Тип меню выберите пункт Вручную.