Как сделать зависимые выпадающие списки. По секрету всему свету - новые возможности блога

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

В текущей статье предлагаю рассмотреть несколько наиболее интересных и актуальных приложений для Wix. На данный момент существует около 200 полноценных расширений базовой функциональности платформы. Если говорить об основных фишках конструктора, то можно выделить:

  • Мощный и понятный визуальный редактор.
  • Оптимизация под мобильные размены экрана.
  • Более 500 шаблонов для разных типов сайтов.
  • Мощные функции обработки изображений с современными эффектами, а также использование в фонах и галереях.
  • Реализация блога и поддержка соц.сетей.
  • Возможность создания интернет-магазина.
  • Набор опций под коммерческие веб-проекты: почта, статистика, рассылки, SEO.

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

Для удобства можете просматривать там расширения не только по категориям, но и с помощью фильтров «Новые», «Популярные». Парочку новинок рассмотрим детальнее.

Wix Events (События)

Если у вас на сайте планируются какие-то мероприятия (курсы, встречи, конференции), то данный модуль должен пригодиться.

С его помощь вы сможете:

  • Отобразить на странице информацию о событии (дата, место, время).
  • Разместить форму регистрации дабы пользователи оставляли свои данные.
  • Создавать красивые приглашения и отправлять разные E-mail уведомления.
  • Управлять списком гостей и подключить шеринг в соц.сетях.

При добавлении данного инструмента на сайт, увидите базовый пример наполнения формы. Кликаете по кнопке «Управлять событием», после чего откроется всплывающее окно с разными параметрами:

Здесь есть несколько разделов с настройками:

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

Как и для всех остальных элементов , в Events вы сможете задать некоторые визуальные настройки, например, макет вывода информации, что именно следует показывать в данном блоке, изменить дизайн кнопок и т.п.

Все эти действия, как видите, не требуют никаких технических навыков. Это здорово, быстро и удобно. Вам не нужно искать фрилансеров, общаться в веб-студию дабы внедрить функционал событий на сайте, вы просто добавляете бесплатное приложение Wix Events.

Wix Forum (Форум)

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

После установки Wix Forum администратор получит функцию добавления разделов и тем для обсуждения. Пользователи смогут регистрироваться, а затем оставлять текстовые, фото и видео сообщения. Приложение позволяет добавить все задачи, которые требуются на форуме:

  • текстовый редактор для комментариев;
  • профиль зарегистрированных посетителей;
  • подписка на обсуждения;
  • уведомления о событиях для модератора;
  • настройка внешнего вида форума.

Отличной фишкой является то, что данная разработка хорошо работает и с мобильными девайсами.

Quick Polls (Опросы)

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

Wix Bookings (Бронирование)

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

  • онлайн оформление записи на услуги или события;
  • добавление расписания работы сотрудников (пользователи смогут выбирать определенного специалиста);
  • синхронизация календарем Google;
  • возможность создания формы в виджете без отдельной страницы;
  • уведомления о новых заказах;
  • настройки отображения элементов приложения;
  • мобильная адаптивная версия;
  • отсутствие скрытых комиссий — вся оплата перечисляется вам.

Вот как это выглядит в работе со стороны пользователя:

В платной версии есть несколько дополнительных фишек: групповая запись, варианты оплаты по частям и рассылка напоминаний о событиях. Если для вашего бизнеса это важно, сможете оформить себе премиальный пакет Wix.

Wix ShoutOut

Здесь есть:

  • возможность создания и настройки формы подписки на сайте: выбирайте цвета, шрифты, оформления, добавляйте тексты;
  • бесплатный сбор неограниченного числа подписчиков (вам не нужно платить за каждые 100, 1000 и т.п. привлеченных пользователей);
  • управление базой подписчиков;
  • Email уведомления о новых юзерах;
  • синхронизация базы с функцией рассылки сообщений (найдете ее в меню «Управление» — «Рассылки» для выбранного сайта);
  • возможность всплывающих окон для привлечения внимания посетителей.

Итого

На Wix.com в разделе функций есть ссылка на страницу актуальных новинок с последними наработками программистов и дизайнеров. Каждый месяц там публикуется информация о новых фишках или шаблонах, добавленных в систему. Все они делают конструктор Wix еще более крутым, мощным, гибким и полезным инструментом.

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

Под выпадающим списком понимается содержание в одной ячейке нескольких значений. Когда пользователь щелкает по стрелочке справа, появляется определенный перечень. Можно выбрать конкретное.

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

Создание раскрывающегося списка

Путь: меню «Данные» - инструмент «Проверка данных» - вкладка «Параметры». Тип данных – «Список».

Ввести значения, из которых будет складываться выпадающий список, можно разными способами:

Любой из вариантов даст такой результат.



Выпадающий список в Excel с подстановкой данных

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


Протестируем. Вот наша таблица со списком на одном листе:

Добавим в таблицу новое значение «елка».

Теперь удалим значение «береза».

Осуществить задуманное нам помогла «умная таблица», которая легка «расширяется», меняется.

Теперь сделаем так, чтобы можно было вводить новые значения прямо в ячейку с этим списком. И данные автоматически добавлялись в диапазон.


Когда мы введем в пустую ячейку выпадающего списка новое наименование, появится сообщение: «Добавить введенное имя баобаб в выпадающий список?».

Нажмем «Да» и добавиться еще одна строка со значением «баобаб».

Выпадающий список в Excel с данными с другого листа/файла

Когда значения для выпадающего списка расположены на другом листе или в другой книге, стандартный способ не работает. Решить задачу можно с помощью функции ДВССЫЛ: она сформирует правильную ссылку на внешний источник информации.

  1. Делаем активной ячейку, куда хотим поместить раскрывающийся список.
  2. Открываем параметры проверки данных. В поле «Источник» вводим формулу: =ДВССЫЛ(“[Список1.xlsx]Лист1!$A$1:$A$9”).

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

Как сделать зависимые выпадающие списки

Возьмем три именованных диапазона:

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

  1. Создадим первый выпадающий список, куда войдут названия диапазонов.
  2. Когда поставили курсор в поле «Источник», переходим на лист и выделяем попеременно нужные ячейки.

  3. Теперь создадим второй раскрывающийся список. В нем должны отражаться те слова, которые соответствуют выбранному в первом списке названию. Если «Деревья», то «граб», «дуб» и т.д. Вводим в поле «Источник» функцию вида =ДВССЫЛ(E3). E3 – ячейка с именем первого диапазона.
  4. Выбор нескольких значений из выпадающего списка Excel

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

    1. Создаем стандартный список с помощью инструмента «Проверка данных». Добавляем в исходный код листа готовый макрос. Как это делать, описано выше. С его помощью справа от выпадающего списка будут добавляться выбранные значения.
    2. Private Sub Worksheet_Change(ByVal Target As Range) On Error Resume Next If Not Intersect(Target, Range("Е2:Е9" )) Is Nothing And Target.Cells.Count = 1 Then Application.EnableEvents = False If Len(Target.Offset(0, 1)) = 0 Then Target.Offset(0, 1) = Target Else Target.End (xlToRight).Offset(0, 1) = Target End If Target.ClearContents Application.EnableEvents = True End If End Sub
    3. Чтобы выбранные значения показывались снизу, вставляем другой код обработчика.
    4. Private Sub Worksheet_Change(ByVal Target As Range) On Error Resume Next If Not Intersect(Target, Range("Н2:К2" )) Is Nothing And Target.Cells.Count = 1 Then Application.EnableEvents = False If Len(Target.Offset(1, 0)) = 0 Then Target.Offset(1, 0) = Target Else Target.End (xlDown).Offset(1, 0) = Target End If Target.ClearContents Application.EnableEvents = True End If End Sub
    5. Чтобы выбираемые значения отображались в одной ячейке, разделенные любым знаком препинания, применим такой модуль.

    6. Private Sub Worksheet_Change(ByVal Target As Range)
      On Error Resume Next
      If Not Intersect(Target, Range("C2:C5" )) Is Nothing And Target.Cells.Count = 1 Then
      Application.EnableEvents = False
      newVal = Target
      Application.Undo
      oldval = Target
      If Len(oldval) <> 0 And oldval <> newVal Then
      Target = Target & "," & newVal
      Else
      Target = newVal
      End If
      If Len(newVal) = 0 Then Target.ClearContents
      Application.EnableEvents = True
      End If
      End Sub

    Не забываем менять диапазоны на «свои». Списки создаем классическим способом. А всю остальную работу будут делать макросы.

    Выпадающий список с поиском

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


Знали ли вы, что за команда Wix выпила более трех тонн кофе? Сотни тысяч чашек бодрящего напитка были опустошены неспроста: в отделе разработок Wix кофейная энергия в сочетании со знаниями, энтузиазмом и печеньками активно перерабатывается в новые возможности для редактирования сайтов. Все это, чтобы обеспечить наших пользователей удобным набором инструментов для создания и развития онлайн-ресурсов. На этот раз разработчики порадовали нас самыми разными обновлениями, о которых мы немедленно все расскажем:

Расширение возможностей навигации по сайту всегда было одним из самых востребованных функций среди пользователей. Вы просили - в Wix сделали! В навигaционном меню появилось два важных обновления:

    Вам нужно выпадающее меню, но не хочется выделять отдельную страницу для главной кнопки? Теперь эту кнопку можно сделать некликабельной.

    Любую кнопку в меню сайта теперь можно привязать к ссылке на внешний ресурс, документу или якорной ссылке. Неплохо, правда?

Как это сделать : в меню «Страницы» нажмите на кнопку «Добавить» и выберите нужную вам функцию.


Если вам часто приходится менять фотографии в галерее, это обновление вам обязательно понравится. Теперь, чтобы поменять порядок изображений, достаточно просто кликнуть по фотографии и перетащить ее в нужное место. Вот что называется освежить сайт одним махом. Не забудьте дать каждой фотографии значимое название и добавить описание: это улучшит индексацию сайта.


Из всех виджетов для соцсетей этот, несомненно, самый классный! С помощью кнопки «Класс» посетители вашего сайта смогут делиться контентом со своими друзьями в Одноклассниках. Добавить такую кнопку очень просто: перейдите по этой , нажмите «Добавить», настройте кнопку по желанию - и готово. В ближайшее время нас ждет ряд полезных обновлений для интеграции сайта с соцсетями. Но тсс! Это пока между нами…


Мы уверены, что посетители вашего сайта проявляют серьезный интерес к разделу «О нас» или «О компании». Ведь перед тем как приобрести чьи-либо услуги, хочется знать, с кем имеешь дело. С помощью нового приложения вы сможете представить свою историю в суперпривлекательной форме. Линию времени легко настроить на свой вкус: выберите дизайн, цвета, добавьте тексты, и история вашего бренда приобретет совершенно новый вид.


Чем этот счетчик отличается от остальных счетчиков в Wix App Market? Тем, что он был разработан нами (а не сторонней компанией) - именно поэтому он совершено бесплатный для пользования! Как и любое другое приложение, его легко настроить по вкусу. Просто перейдите по , нажмите «Добавить» и следите за посещениями сайта в реальном времени.


Кнопка «Наверх» в два клика

Вы наверняка слышали о тренде страниц с и не раз встречали его в сети. Основной способ навигации по такому сайту - кнопка «Наверх». Специально для владельцев лендингов, одностраничников и прочих длинных сайтов в лаборатории Wix разработали приложение Back To Top. Теперь вы сможете не только добавить кнопку «Наверх» в два счета, но и настроить ее стиль. Вы уже знаете, как это работает: для добавления кнопки перейдите по и нажмите «Добавить». Кстати, очередной виджет собственного производства.


По секрету всему свету - новые возможности блога

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

UX-дизайнера из IBM Золтана Коллина.

В закладки

Золтан Коллин

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

Дизайнеры чаще всего используют выпадающие списки не к месту, а по мнению директора по продукту Google Люка Вроблевски, к этому шаблону следует прибегать только в самом крайнем случае.

Давайте рассмотрим некоторые ограничения:

  • Опции выпадающего списка невидимы до тех пор, пока пользователь не кликнет или не коснется формы. Кроме того, с первого взгляда невозможно предсказать, сколько строк будет в списке - две или пятьдесят.
  • Выбор опции из выпадающего списка - это многоступенчатый процесс, особенно на мобильных устройствах: сперва пользователю нужно коснуться формы и открыть варианты, пролистать вниз и найти нужный, выбрать его и закрыть список.
  • Из-за выпадающих списков дизайнеры становятся ленивыми, ведь это так просто - добавить все возможные опции в один перечень без какой-либо приоритизации. Из-за этого выпадающий список очень похож на другой шаблон - меню «гамбургер ».
  • Листать длинные списки, вроде выбора страны, - это кошмар. Особенно на мобильных устройствах, где поиск с клавиатуры обычно недоступен.
  • На некоторых устройствах поле для отображения вариантов очень мало, поэтому пролистывание может превратиться в кошмар.

Количество видимых вариантов списка на iOS может показаться крайне незначительным

Хорошая новость заключается в том, что существует большое количество альтернативных элементов для ввода данных, которые во многих случаях сработают лучше выпадающих списков.

Оцените количество вариантов

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

Для небольшого количества взаимоисключающих опций подойдет форма в виде радиокнопок или кнопок Segmented Control. Пользователь сразу увидит все доступные варианты, и ему не придется раскрывать список.

Пример использования кнопок Segmented Control

Количество видимых вариантов зависит от ширины экрана и длины текста. Однако не стоит использовать более пяти опций

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

Чтобы не пролистывать весь список, пользователи могут ввести первые буквы, и выбрать отфильтрованные варианты

Для больших и разнообразных списков лучше использовать существующие пользовательские данные, чтобы в список попали популярные варианты ответа. В этом случае 90% пользователей смогут сразу выбрать необходимую опцию, а оставшиеся 10% - кликнут по варианту «Другое», который будет уточнен в следующем вопросе.

И хотя «Другое» - это не самое элегантное решение, приоритизация может улучшить UX для большинства пользователей.

Оцените предпочтительную форму ввода

Одно из преимуществ выпадающего списка заключается в том, что пользователям не нужно много печатать. Однако если печатать нужно немного, и данные запрашиваются довольно часто (например, личная информация), то их удобнее вводить, а не выбирать из списка.

На мобильных устройствах проще всего вводить год рождения с помощью цифровой клавиатуры, а не выпадающего списка

Говоря в целом, числовая клавиатура - самый эффективный способ ввести числовое значение.

​Даже если значение списка отсортированы по порядку, возможно, пользователям будет проще ввести их от руки, а не листать.

Если вам важно подтвердить данные, которые вводит человек, используйте форму ввода с отфильтрованным выпадающим списком.

Например, когда пользователю требуется указать штат, отфильтровать список доступных вариантов может всего одна буква

Это особенно важно, если порядок сортировки элементов списка ясен не до конца.

Например, пользователи не понимают, по какому принципу отсортированы валюты. Сделайте так, чтобы они могли искать и по ее названию, и по аббревиатуре

То же относится к списку стран.

Для целых чисел - например, количества пассажиров или товаров в корзине, - лучше всего использовать степпер. Он позволит пользователям увеличивать или уменьшать значение по одному клику.

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