Использование кнопки для запуска действия или последовательности действий
Кнопки в формах Access используются для запуска действий или наборов действий . Например, кнопка может открывать другую форму. Чтобы кнопка запускала действие, нужно связать макрос или процедуру обработки событий со свойством Нажатие кнопки. Можно также внедрить макрос прямо в свойство Нажатие кнопки. Это позволит копировать кнопку в другие формы без потери ее функциональности.
В этой статье
Добавление кнопки в форму с помощью мастера
Создание кнопки перетаскиванием макроса в форму
Создание кнопки без использования мастера
Настройка кнопки
Добавление кнопки в форму с помощью мастера
С помощью мастера создания кнопок можно быстро создавать кнопки для разных задач, таких как закрытие формы, открытие отчета, поиск записи или запуск макроса.
В области навигации щелкните форму правой кнопкой мыши и выберите в контекстном меню пункт Конструктор.
На вкладке Конструктор
в группе Элементы управления выберите параметр Использовать мастера .
На вкладке Конструктор в группе Элементы управления щелкните элемент Кнопка.
Щелкните форму в том месте, где должна находиться кнопка.
Запустится мастер создания кнопок.
Следуйте указаниям мастера. На его последней странице нажмите кнопку Готово.
Мастер создаст кнопку и внедрит макрос в ее свойство Нажатие кнопки. Макрос будет содержать действия, выполняющие выбранную в мастере задачу.
Просмотр или изменение макроса, внедренного в кнопку
Щелкните в области навигации правой кнопкой мыши форму с нужной кнопкой и выберите в контекстном меню пункт Конструктор или Режим макета .
org/ListItem»>
Щелкните кнопку, чтобы выделить ее, и нажмите F4, чтобы открыть окно ее свойств.
В окне свойств на вкладке
События в поле свойства Нажатие кнопки должен отображаться текст [Внедренный макрос]. Щелкните в этом поле и нажмите справа от него кнопку .
Откроется конструктор макросов, в котором будут показаны действия во внедренном макросе.
К началу страницы
Создание кнопки перетаскиванием макроса в форму
Кнопку запуска макроса можно создать, перетащив готовый макрос в форму в режиме конструктора.
org/ListItem»>
Чтобы открыть форму в режиме конструктора, щелкните ее правой кнопкой мыши в области навигации и выберите в контекстном меню пункт Конструктор .
Найдите в области навигации макрос, который должна запускать новая кнопка, и перетащите его в форму.
Access автоматически создаст кнопку и сделает ее подписью название макроса. Кроме того, Access вставит в свойство
Нажатие кнопки имя макроса, чтобы он запускался при нажатии кнопки. Кнопка будет создана со стандартным именем, но лучше назначить ее свойству Имя какой-нибудь подходящий по смыслу текст. Чтобы отобразить окно свойств кнопки, когда форма открыта в режиме конструктора, щелкните кнопку и нажмите клавишу F4.
Дополнительные сведения о создании макросов см. в статье Создание макроса пользовательского интерфейса.
К началу страницы
Создание кнопки без использования мастера
Кнопку можно создать и без мастера. Для этого нужно расположить кнопку на форме и настроить несколько свойств.
Щелкните форму в области навигации правой кнопкой мыши и выберите в контекстном меню пункт Конструктор .
Убедитесь, что на вкладке Конструктор в группе Элементы управления параметр
Использовать мастера не установлен или отмените его выбор.
org/ListItem»>
На вкладке Конструктор в группе Элементы управления щелкните элемент Кнопка.
Щелкните форму в том месте, где должна находиться кнопка.
Access добавит кнопку в форму.
Поскольку параметр Использовать мастера не установлен, больше ничего сделано не будет. Если при добавлении кнопки в форму запустится мастер создания кнопок, можете нажать в нем кнопку Отмена.
Выделите кнопку и нажмите F4, чтобы отобразить окно ее свойств.
Откройте вкладку Все, чтобы отобразить все свойства кнопки.
Задайте нужные свойства, руководствуясь указаниями в таблице ниже.
Свойство
Описание
Имя
По умолчанию Access назначает новой кнопке имя Кнопка и добавляет к нему число, например Кнопка34. Рекомендуется изменить такое имя на что-либо более выразительное (например, Отчет о продажах или Закрыть форму). Это поможет, когда кнопку нужно будет использовать в макросе или процедуре обработки событий.
Подпись
Введите метку, которая будет отображаться на кнопке. Например, «Отчет о продажах» или «Закрыть форму».
Примечание: Если свойству Рисунок кнопки назначено изображение, подпись не отображается.
Нажатие кнопки
В этом свойстве можно указать, что должно происходить при нажатии кнопки. Чтобы установить его, щелкните в поле свойства и выполните одно из указанных ниже действий.
Чтобы кнопка запускала сохраненный макрос, щелкните стрелку вниз и выберите имя нужного макроса.
Чтобы кнопка запускала встроенную функцию или функцию VBA, введите знак равенства (=) и имя функции, например =MsgBox(«Привет, мир») или =MyFunction(аргументы).
Чтобы создать выражение, нажмите и выберите пункт Выражения.
Чтобы начать создание процедуры обработки событий на Visual Basic для приложений (VBA), нажмите и выберите пункт Программы. Чтобы создать внедренный макрос с действиями, которые будет запускать кнопка, нажмите и выберите пункт Макросы.
Примечание: Базам данных Access, содержащим код VBA, для выполнения кода необходимо предоставить статус надежных.
Чтобы получить справку по свойствам, которые здесь не описаны, поместите курсор в поле свойства и нажмите клавишу F1.
К началу страницы
Настройка кнопки
С помощью разнообразных средств настройки кнопок в Access можно изменять вид и функции кнопок. Например, можно расположить кнопки в строку или в столбик либо сделать их похожими на гиперссылки.
Щелкните форму в области навигации правой кнопкой мыши и выберите пункт Конструктор .
Выполните одну из описанных ниже процедур.
Создание горизонтального (табличного) или вертикального (в столбик) макета кнопок
Добавив кнопки в табличный макет или макет в столбик, можно создать строку или столбец точно выровненных кнопок. Затем их можно перемещать как группу, что упрощает изменение форм. Кроме того, вы можете применить форматирование сразу ко всей строке или столбцу кнопок либо отделить кнопки с помощью линий сетки.
Щелкните правой кнопкой мыши одну из кнопок, которые нужно добавить в макет, и наведите указатель на пункт Макет в контекстном меню.
Выберите пункт В виде таблицы или В столбик , чтобы создать соответственно строку или столбец кнопок.
Access отобразит границы кнопки, чтобы показать ее макет. У каждой кнопки есть метка, которую нельзя удалить, но можно ужать до очень маленького размера, если она не нужна.
На рисунке ниже показаны кнопка и связанная с ней метка в табличном макете. Как видите, метка находится в соседнем разделе выше — это позволяет не повторять метки для каждой записи.
На рисунке ниже показаны кнопка и связанная с ней метка в макете в столбик. В таком макете метка и кнопка всегда расположены в одном разделе.
org/ListItem»>
Добавьте в макет другие кнопки, перетащив их в область макета. При перетаскивании кнопки по области макета в Access отображается горизонтальная (для табличного макета) или вертикальная (для макета в столбик) полоса вставки, которая показывает, где окажется кнопка, когда вы отпустите кнопку мыши.
Когда вы отпустите кнопку мыши, элемент управления будет добавлен в макет.
Перемещение кнопок в раздел выше или ниже в табличном макете. Если вы хотите оставить кнопку в табличном макете, но переместить ее в другой раздел формы (например, из раздела сведений в раздел заголовка формы), выполните указанные ниже действия.
Выделите кнопку.
На вкладке Упорядочить выберите команду Вверх или Вниз.
Кнопка переместится в соседний раздел выше или ниже, но останется в табличном макете. Если в том месте, куда вы перемещаете кнопку, уже есть элемент управления, они поменяются местами.
Примечание: В макете в столбик команды Вверх и Вниз отключены.
Перемещение всего макета кнопок
org/ItemList»>
Щелкните любую из кнопок в макете.
В левом верхнем углу макета появится значок селектора.
Чтобы переместить макет в другое место, перетащите селектор.
Добавление линий сетки в макет кнопок
Выделите любую из кнопок в макете.
На вкладке Упорядочить нажмите кнопку Сетка и выберите стиль линий сетки.
Создание прозрачной кнопки
Прозрачную кнопку можно поместить поверх любого объекта в форме, чтобы придать ему функциональные свойства кнопки. Допустим, вы хотите разделить изображение на области, при нажатии которых будут запускаться разные макросы. Для этого можно поместить поверх изображения несколько прозрачных кнопок.
Щелкните кнопку, которую нужно сделать прозрачной, и нажмите F4, чтобы отобразить окно ее свойств.
Щелкните в окне свойств на вкладке Макет поле свойства Прозрачный.
Выберите в раскрывающемся списке значение Да.
Вы по-прежнему будете видеть контур кнопки в режиме конструктора, но в режиме формы она будет невидима.
Примечание: Выбор для свойства «Прозрачность» для кнопки «Да» — не то же самое, что для свойства «Видимый» — «Нет». Обе операции скрывают кнопку, но если для свойства «Прозрачность» установить «Да», кнопка остается включенной. Если для свойства «Видимый» установить «Нет», кнопка будет отключена.
org/ListItem»>
Отображение кнопки в виде гиперссылки
При желании можно скрыть кнопку, но оставить ее подпись. В результате получится элемент управления, который выглядит как надпись, но работает как кнопка. Можно также подчеркнуть текст подписи и изменить его цвет, чтобы он выглядел как гиперссылка.
Щелкните кнопку, чтобы выделить ее, и нажмите F4, чтобы открыть окно ее свойств.
В окне свойств на вкладке Макет щелкните поле Тип фона.
org/ListItem»>
В раскрывающемся списке выберите вариант Прозрачный.
Кнопка будет скрыта, но ее подпись останется видимой.
Чтобы подчеркнуть текст подписи или изменить его цвет, воспользуйтесь инструментами из группы Шрифт на вкладке Формат.
Создание кнопки «Отмена»
Щелкните кнопку и нажмите F4, чтобы открыть окно ее свойств.
В поле свойства Отмена выберите значение Да.
Если свойство «Отмена» для кнопки имеет значение «Да» и форма является активной, пользователь может выбрать ее, щелкнув ее, нажав клавишу ESC или клавишу ВВОД, когда кнопка фокус. Если для свойства «Отмена» одной кнопки установлено «Да», для всех остальных кнопок формы оно автоматически получает ответ «Нет».
Чтобы кнопка «Отмена» отменяла все действия, выполненные в форме или диалоговом окне, нужно создать соответствующий макрос или процедуру обработки событий и связать их со свойством Нажатие кнопки.
Примечание: Если в форме разрешены необратимые операции (например, удаление), рекомендуется сделать кнопку «Отмена» используемой по умолчанию. Чтобы сделать это, установите значение Да для свойств По умолчанию и Отмена.
Отображение рисунка на кнопке. Введите в поле свойства Рисунок имя файла изображения (например, в формате BMP, ICO или DIB) и путь к нему. Если вы не помните точно имя файла или путь, нажмите кнопку , чтобы открыть построитель рисунков.
Нажмите кнопку Обзор, чтобы найти нужное изображение, или щелкните одно из профессиональных изображений в списке Имеющиеся рисунки, и оно появится в окне предварительного просмотра. Когда найдете нужный рисунок, нажмите ОК, чтобы добавить его на кнопку.
По умолчанию в Access свойство Тип рисунка имеет значение Внедренное. Когда вы назначаете изображение свойству Рисунок, его копия сохраняется в файле базы данных Access. Все последующие изменения исходного рисунка не отражаются на кнопке. Чтобы его изменения отражались и на кнопке, выберите для свойства Тип рисунка значение Связанное. Перемещать исходный рисунок нельзя. Если вы переместите или переименуете файл рисунка, при открытии базы данных в Access появится сообщение об ошибке, а на кнопке вместо рисунка будет показана ее подпись.
Отображение на кнопке и рисунка, и подписи
На кнопке можно отобразить и рисунок, и подпись. Чтобы сделать это, выполните указанные ниже действия.
Добавьте рисунок на кнопку по приведенным ранее инструкциям
org/ListItem»>
Выделите кнопку. Если окно ее свойств не отобразится, нажмите клавишу F4.
В окне свойств кнопки на вкладке Макет введите нужную подпись в поле свойства Подпись.
Щелкните стрелку вниз в поле свойства «Расположение подписей рисунков» и выберите нужный уклад. Например, чтобы подпись отображалась под рисунком, выберите «Снизу». Чтобы отобразить подпись справа от рисунка, выберите «Справа». Чтобы расположение было зависеть от системного региональных порядоков, выберите «Общие». При использовании этого параметра подпись будет отображаться справа на языках с текстом слева направо, а слева на языках, которые читают текст справа налево.
К началу страницы
Цвет кнопки на сайте: почему важно выбрать правильный
Из этого материала вы узнаете:
Что такое кнопка призыва к действию
Подходящие места на сайте для кнопки призыва к действию
Общие правила цветового оформления кнопки призыва к действию на сайте
Психология цвета в маркетинге
Результаты тестов по поводу цвета кнопки призыва к действию на сайте
Немного о полупрозрачных кнопках на сайте
12 полезных советов по созданию эффективной кнопки призыва к действию
Каким сделать цвет кнопки на сайте, чтобы увеличить конверсию? На первый взгляд вопрос может показаться странным, но это далеко не так. От того, выполнит посетитель ресурса ожидаемое от него действие или нет, зависит слишком многое — а потому маркетологи цепляются буквально за любую возможность убедить людей принять верное решение.
Значимую роль в данном случае играет множество факторов: и расположение заветной кнопки, и сопровождающая ее надпись, и, разумеется, цвет. Однако не надо думать, что стоит выделить клавишу призыва к действию кислотно-красным, и человек автоматически ее нажмет. Люди — не собаки Павлова. И подход тут нужен совершенно другой.
Что такое кнопка призыва к действию
Люди, как правило, заходят на сайты с какой-то определенной целью. Для ее достижения необходимо выполнить ряд действий, первое из которых — нажатие на кнопку call to action.
Например, пользователь хочет зарегистрироваться на сайте, загрузить приложение на телефон или же купить что-то в интернет-магазине. Практически во всех случаях он прежде нажимает на кнопку призыва к действию.
Основная задача такой кнопки — повысить конверсию сайта, направляя пользователей к нужному действию и конвертируя их в клиентов. Вот характерные примеры CTA:
«Установите приложение».
«Скачайте книгу или инструкцию».
«Оформите подписку на обновления».
«Нажмите для получения консультации».
Стоит заметить, что чаще всего вместо кнопок используются ссылки. Если первые являются, по сути, изображениями на сайте и для их создания необходимо приложить определенные усилия, то вторые создаются за мгновение. Задачи при этом у тех и других абсолютно идентичные.
Возникает вопрос, когда следует использовать кнопки, а где достаточно гиперссылки. Большое количество CTA-кнопок на сайте замедляет загрузку страницы, а также может запутать пользователя, который теряется и не знает, куда лучше нажать. Поэтому данные элементы нужно внедрять лишь для призыва посетителя к важному действию: оформлению заказа, загрузке файла, подписке на рассылку или регистрации на ресурсе. Для всех остальных задач смело пользуйтесь обычными ссылками.
В идеале кнопка CTA не отвлекает посетителя и органично вписывается в дизайн страницы. Цвет кнопки на сайте и ее оформление нужно сделать таким образом, чтобы пользователь взаимодействовал с этим элементом на бессознательном уровне, не оценивая его внешний вид.
Подходящие места на сайте для кнопки призыва к действию
1. Главная страница
При первом посещении интернет-магазина посетитель, вероятно, заинтересуется качеством сервиса данной площадки. Пока речь о покупке какого-то товара не идет, нужно произвести на пользователя приятное впечатление, получив от него при этом контактные данные. Сделать это можно через форму подписки.
2. Страница с категориями товаров
Пользователь на данном этапе хочет ознакомиться с представленным ассортиментом, изучить характеристики позиций, сравнить их по цене, чтобы затем определиться и выбрать что-то одно. В частности, ему интересны предлагаемые скидки или выгодные акции в определенном товарном сегменте. Привлечь внимание пользователя можно кнопкой «Купить» с изображением продуктовой корзины.
3. Карточка продукта
Здесь потенциальный клиент уже выбрал искомый товар или услугу, и теперь ему нужны более детальная характеристика, фотографии продукта, условия оплаты и доставки, информация о наличии данной позиции на складе. Пользователя в данном случае можно заинтересовать уникальным предложением, включив для дополнительной мотивации обратный счетчик, если по данному товару имеется ограниченная акция. На этом этапе важно убедить клиента, не перегружая его лишней информацией.
4. Корзина
Это заключительный этап воронки продаж, поэтому здесь уже не нужно отвлекать покупателя никакими дополнительными предложениями. Должна быть только необходимая информация для оформления заказа: характеристика товара, форма оплаты и условия доставки. В противном случае посетитель может растеряться и отправиться за поиском конкретики в другое место, так и не завершив покупку.
5. Запись в блоге
Как правило, блог посещают для получения информации, а не для покупки товара или заказа услуги. Поэтому публикацией статей нужно мотивировать читателей хотя бы подписаться на рассылку. А им легче всего это сделать, нажав на ту же CTA-кнопку.
6. Пост в социальной сети
Сегодня многие интернет-магазины предпочитают продвигать свою продукцию в основном через социальные сети. Не следует перегружать паблик рекламными публикациями, призывающими к действию. Но время от времени такие посты должны публиковаться, и кнопка для подписки на данную страницу будет здесь весьма кстати.
7. Посадочная страница
Лендинг демонстрирует преимущества продукта, а также отвечает на возникающие у посетителей вопросы. Здесь ключевую роль играет правильный порядок подачи информации, в том числе грамотное размещение кнопок CTA в достаточном, не слишком большом количестве.
Общие правила цветового оформления кнопки призыва к действию на сайте
Значительную часть информации человек получает через зрение. Этим объясняется стремление владельцев продающих сайтов сделать свои ресурсы максимально привлекательными и показать товар или услугу в наиболее выгодных ракурсах, создавая подходящий зрительный образ.
Но какими бы красочными ни были фотографии продукта, рядом должна быть кнопка, эффективно призывающая к заказу. Если ее цвет не привлекает внимания, посетитель не нажмет на нее и не станет вашим клиентом.
Создать эту кнопку, лишь следуя гармоничности оформления и сохранению дизайна, недостаточно. Есть большая вероятность, что данный элемент останется незамеченным. Посетитель, не увидев предложения купить товар, просто покинет сайт.
Чтобы функция призыва к действию работала, цвет кнопки на сайте обязан отвечать следующим требованиям:
Оттенки не должны быть слишком темными и тусклыми.
Лучше избегать использования серого цвета. Кнопка в таком случае будет восприниматься как неактивная, не вызывающая желания на нее нажимать.
Тени и градиенты в оформлении следует использовать с осторожностью. Например, эффект вогнутости объемного элемента будет восприниматься посетителями как нажатая, а значит, неактивная кнопка. Поэтому она должна выглядеть либо изначально выпуклой, либо плоской и однотонной.
Лучше не обрамлять кнопку простой рамкой. Она делает элемент плохо заметным и не призывающим к действию.
Сегодня принято считать, что контрастность элемента на фоне страницы имеет большее значение, нежели цвет. По этой причине качественные руководства рекомендуют делать кнопку более контрастной, в то время как рассуждения по поводу правильного подбора цвета встречаются нечасто.
Контраст в свою очередь может достигаться по-разному и дает разную эффективность. Например, выделение цветом, даже очень ярким и выразительным, все равно не сделает кнопку очень заметной. Иной эффект дает создание контраста с помощью яркости (luminance contrast). Попробуйте выключить весь цвет на своем сайте и обратите внимание на кнопку. Если она продолжает быть заметной, значит, яркостный контраст подобран верно. При этом контрастировать должна не только кнопка в целом со страницей, но и фон элемента с надписью на нем. Преимущество яркостного контраста состоит еще в том, что он работает и для людей с нарушениями зрительного восприятия цвета.
Но если выделение кнопки с помощью яркости так важно, отчего практически никто не использует черный цвет на белом фоне? Тут ответ очевиден. На странице имеется текст, который обычно тоже черный. А если сайт изобилует цветными фотографиями и изображениями, черная кнопка на нем просто останется незаметной.
Таким образом, кнопка CTA будет выделяться, если она контрастирует с фоном страницы по яркости и с остальными элементами сайта по цвету.
При этом не следует забывать и о внешней привлекательности CTA-кнопки. Важно, чтобы она не столько была красива, сколько привлекала посетителей своим оформлением и заставляла на себя нажать. Слишком яркий, диссонирующий цвет будет скорее отталкивать, поэтому нужно придерживаться цветовой гармонии и естественности.
Психология цвета в маркетинге
Уже абсолютно точно можно сказать, что каждый цвет рождает в человеке определенные эмоции. Как правило, это действует на всех людей одинаково, чем пользуются дизайнеры при проектировании интерфейсов. Однако у каждого человека есть свои особенности восприятия, связанные с событиями, сильно повлиявшими на его жизнь, с какими-либо личными ассоциациями. Для упрощения же примем, что все люди воспринимают цвета более или менее одинаково, находясь в едином информационном пространстве.
Желтый цвет
Ассоциируется с солнцем и позитивным настроением. Данный цвет, сильно контрастирующий с черным, сегодня принято использовать для привлечения внимания посетителей к выгодам и уникальному торговому предложению продукта.
При этом важно соблюсти правильный оттенок. Скажем, желто-зеленый уже будет выглядеть нездоровым, вызывать нежелательные ассоциации. Оттенки должны быть более комфортными и теплыми.
Красный цвет
Этот цвет обладает энергией, вызывая у человека мотив либо срочно что-то сделать, либо, наоборот, немедленно прекратить какой-либо процесс. Во всех случаях красный элемент привлекает внимание. Цвет используется для возбуждения в посетителе сайта желания немедленно сделать заказ.
Но здесь важно не перегибать палку и не насыщать сайт красным. Следует помнить о пожилых людях, для которых этот цвет будет ассоциироваться уже с опасностью и агрессией.
Синий цвет
Часто использование этого цвета способствует росту продаж. У посетителей возникают ассоциации со стабильностью и спокойствием. Избавляя от тревоги, синий цвет отлично подойдет в качестве фонового. А вот для призыва к действию он не подходит. Настраивающий на спокойствие, синий цвет кнопки на сайте не отвлекает на себя внимание посетителя. Использовать его стоит на ресурсах по страхованию, медицинских и финансовых порталах.
Зеленый цвет
Издавна зеленый ассоциируется с природой, органичностью и натуральностью. Считается, что данный цвет благотворно влияет на зрение, в целом обладает целительными свойствами. Поэтому его имеет смысл внедрять в рекламе лекарств, аптек, клиник, а также органических продуктов питания. Зеленая кнопка отлично контрастирует на белом фоне, привлекая внимание и одновременно не раздражая глаза.
Использование этого цвета для призыва действия зависит от ваших задач. Если импульсивная покупка не нужна, а клиент ожидает вашего одобрения, зеленая кнопка будет как нельзя кстати. В рекламе же использовать данный цвет в качестве основного не следует: это может выглядеть вычурно.
Оранжевый цвет
Придает жизненный тонус и дарит оптимизм. Издревле этот цвет ассоциируется со здоровьем и творческим развитием. Оранжевые тона отлично подойдут для продвижения медикаментов, услуг здравоохранения, образовательных продуктов, товаров для детей. Придавая активности, этот цвет одновременно способствует душевному расслаблению и внутреннему равновесию.
Оранжевые кнопки CTA успешно выполняют свою функцию, выделяясь практически на любом фоне. На достаточно простых сайтах, выполненных в светлых тонах, они обеспечивают хорошую конверсию. Оранжевый цвет приятен для большей части людей, поэтому сайты, где этот цвет активно используется, могут иметь очевидные преимущества.
Однако определенный процент посетителей не видит в таком цветовом решении особой привлекательности (а это 22 % мужской и 33 % женской аудитории), некоторые же и вовсе считают его слишком бедным (22 % от общего числа посетителей). Поэтому использовать этот цвет следует в меру.
Фиолетовый цвет
В сознании общества олицетворяет собой благородство, силу, успех. Это достаточно яркий цвет, хорошо контрастирующий с желтым и зеленым, сочетающийся с синим и розовым. Фиолетовые элементы сайта заметно выделяются в случае преобладания белого и черного цветов в оформлении и поэтому отлично подходят для повышения конверсии.
Но нужно помнить, что мужскую аудиторию изобилие оттенков фиолетового, а также оранжевого и коричневого в целом отталкивает. Поэтому, если основу целевых посетителей сайта составляют мужчины, данного цветового решения лучше избегать.
Черный цвет
Ассоциируется со строгостью, аристократизмом и утонченностью. Зачастую используется для выделения более светлых и жизнеутверждающих оттенков. Черный цвет хорошо работает на мужскую целевую аудиторию для продвижения товаров верхней ценовой категории. Если же сайт не предлагает продукты класса премиум (например, дорогие модели автомобилей), использование черного в оформлении лучше ограничить. Тем не менее отдельные элементы, выполненные в данном цвете, могут дать хороший эффект.
Следует помнить, что помимо классической респектабельности черный несет в себе часто траурное настроение, особенно сильно воспринимаемое старшей возрастной категорией пользователей.
Белый цвет
Наряду с черным это второй цвет, считающийся основным. Обычно он олицетворяет свежесть и чистоту. Достаточно часто используется как вторичный, поскольку дает множество оттенков остальных цветов. При правильном использовании дизайнерами белый способен дать мощный позитивный эффект. Вместе с тем чрезмерное изобилие этого цвета способно лишить сайт живости, привнести в него мертвую стерильность и пустоту.
Маркетинговая сила цвета часто мотивирует посетителей сайтов купить тот или иной продукт, вызывая у людей определенные чувства. При грамотном использовании цветовых решений реклама становится гораздо более эффективной — соответственно, увеличиваются и продажи. Для этого необходимо изучить особенности основных цветов, а затем определить требуемый эффект, который будет оказываться на аудиторию. Последнюю в свою очередь следует тщательно проанализировать, понять ее потребности. Только на основе этой информации вы сможете подобрать оптимальную цветовую гамму, которая даст нужный результат.
Результаты тестов по поводу цвета кнопки призыва к действию на сайте
Какой цвет кнопки на сайте дает лучшую конверсию? На этот почти философский вопрос у каждого будет свой ответ. Например, начинающие специалисты в маркетинге с ходу скажут, что это красный. В то же время опытные маркетологи ответят, что кнопка CTA должна быть как минимум контрастной. Были проведены исследования на эту тему среди нескольких тысяч пользователей. Результаты получились весьма интересные.
Красный нужен, чтобы побеждать?
Выше мы рассматривали красную кнопку как дающую наилучшую конверсию. Причина такого эффекта заключается в ассоциациях и эмоциях, порождаемых этим цветом. В частности, красный сигнализирует об опасности, необходимости срочно остановиться; в то же время он вызывает в человеке повышенную страстность. Считается, что в основном эти качества оказывают положительное влияние на интернет-маркетинг, давая лучшие результаты. Но нужно учитывать, что красный у многих людей также порождает тревожное, иногда даже паническое настроение.
Так на самом ли деле красная кнопка обеспечивает самую высокую конверсию? В действительности это не так. По поводу психологии цвета написано множество публикаций. Специалисты сходятся в мнении: на конверсию в первую очередь влияет контрастность кнопки, а не ее конкретный цвет. Другими словами, чем контрастнее элемент CTA, тем лучше маркетинговые результаты. Но и это правило срабатывает не всегда.
Как быть, если контраст для сайта дают несколько различных цветов? Какой из них лучше и в какой степени? Ответить на эти вопросы позволит А/Б-тестирование, в процессе которого сравниваются 2 варианта цветового решения одного элемента.
Такие же тесты были проведены и для определения зависимости конверсии от выбранного цвета CTA-кнопки. Для этих целей на сайтах двух интернет-магазинов создали несколько одинаковых всплывающих окон, отличающихся лишь кнопкой. Цвета выбирались следующие:
Красный и синий
Тестирование проводилось на зеленовато-голубом фоне, который затемнялся поп-апом. Фон самого всплывающего окна имел серо-синий цвет. Предполагали, что такое сочетание даст наибольший контраст, при котором красная кнопка обеспечит наилучшую конверсию.
Результаты теста на удивление получились иными. Лучшую конверсию дала синяя кнопка (на 9,7 % выше, чем у красной). При этом посещаемость сайта была достаточно высокой: число участников составило 6506 человек. Такая значимая выборка дала итоговую конверсию победившей кнопки в 4,18 %.
Какой тут можно сделать вывод? Контрастность не всегда обеспечивает наилучший результат, но использовать ее все же стоит во всех случаях.
Здесь очень важно знать целевую аудиторию, ее ожидания, ассоциации, возникающие с определенными цветами, и соответствие данных цветовых решений ожиданиям. Например, пользователи привыкли видеть зеленый и синий, поскольку они были основой сайта до появления всплывающего окна. Вполне вероятно, эти цвета закрепились у них как дружественные на уровне подсознания.
Синий и зеленый
Победившую на предыдущем этапе синюю кнопку теперь сравнивали с зеленой, являющейся в данных условиях более контрастной. Но, учитывая неожиданные результаты проведенного теста, исследователи не были уверены в безоговорочной победе зеленой кнопки в текущем поединке.
Тем не менее этот раунд дал максимальный результат. Конверсия зеленой кнопки оказалась выше, чем у синей, на целых 65 %. Правда, количество участников в данном тесте составило всего 1322 человека и при большем числе посетителей разница была бы меньшей. Но факт остается фактом: зеленая CTA-кнопка показала лучший результат, обеспечив конверсию 4,24 %.
Красный и зеленый
Дальнейший этап тестирования проводился на втором сайте: сравнивались зеленая кнопка с красной. Голубой фон данного интернет-магазина также затенялся всплывающими окнами. Для привлечения аудитории демонстрировалась скидка с помощью изображенных на поп-апе красных шариков. Здесь преимущество с точки зрения контраста было однозначно у зеленой кнопки.
Таким образом, по результатам теста зеленая кнопка обеспечила конверсию на 11,4 % выше, чем красная. За время тестирования сайт посетили 6488 человек. Конверсия победившей кнопки составила 3,61 %.
Зеленый и синий
Прежние соперники тестировались снова, но уже на втором сайте. Оба варианта хорошо контрастировали с фоном, но лучший результат показала зеленая кнопка (на 11,4 % по сравнению с синей). В тесте принимали участие 7350 посетителей, дав итоговую конверсию победителя раунда на уровне 3,4 %.
Итоги тестирования
Какой вывод можно сделать? По этим результатам нельзя сказать, что зеленая кнопка — наилучший по показателям вариант абсолютно для всех сайтов. Также по итогам первого этапа не следует думать, что контрастность не срабатывает. Она должна быть учтена, но лишь после анализа целевой аудитории.
Универсальный рецепт здесь только один. Результаты любых тестирований, как бы убедительно они ни выглядели, желательно еще раз проверять на собственном опыте. На данный момент не существует стопроцентно работающих решений, равно как и волшебных таблеток от всего.
Немного о полупрозрачных кнопках на сайте
В современном веб-дизайне прослеживается тенденция использования фотографий для фона, а также прозрачных кнопок. В отличие от полностью залитых цветом элементов такие «призрачные» веб-кнопки не привлекают к себе внимания.
Недостаток этих кнопок состоит в их незаметности. Пользователи не оценивают в полной мере значимость элементов с прозрачным оформлением, отвлекаясь на красочные фоновые фотографии.
Иногда кнопки выглядят так, что даже не приходит в голову на них нажать. Например, они воспринимаются как обычный выделенный текст. Это главное проблемное место пользовательской эргономичности прозрачных кнопок.
Но вместе с тем прозрачность этого элемента отлично сочетается с «фотообоями» сайта. Можно ли, сохранив это качество, как-то выделить прозрачную кнопку, чтобы посетители хотели на нее нажать?
Да, существует компромиссное и вполне рабочее решение. Оно заключается в использовании полупрозрачного элемента, размещенного поверх фона и действительно напоминающего кнопку.
Полупрозрачность такой CTA-кнопки дает возможность видеть фон сквозь нее. Тем самым сохраняется внешняя привлекательность «кнопки-призрака», но при этом пользователь отчетливо понимает, что сюда можно кликнуть.
12 полезных советов по созданию эффективной кнопки призыва к действию
Приведенные ниже простые принципы помогут вам создать эффективно работающую CTA-кнопку.
1. Соответствуйте бренду
Кнопка должна быть оформлена в соответствии со своим контекстом. То есть при создании элемента нужно продумать цветовую гамму и графический стиль, а также по возможности внедрить утвержденный дизайн логотипа. Вполне вероятно, что форма логотипа отлично впишется в общее оформление элемента и даст хороший эффект. Здесь перед вами открывается широкий простор для творчества.
Так, если дизайн вашего сайта предполагает преобладание плоских элементов, большие выпуклые кнопки, как у Apple, будут смотреться чужеродно. Если возможно, вписывайте детали логотипа в интерфейс (отдельные формы, линии, цвета и т. д.).
2. Соответствуйте интерфейсу
Помимо логотипа учитывайте интерфейс сайта. Вполне возможно, что кнопка хорошо отобразится лишь на мобильных устройствах, в то время как на ПК она работать не будет. В таком случае необходимо предусмотреть для нее рабочую замену.
3. Проверьте контрастность
Благодаря усилиям дизайнеров Apple и повальному распространению этой техники кнопки сейчас окружают нас повсюду. И среди этого изобилия ваш элемент CTA может легко затеряться. Поэтому пробуйте экспериментировать с цветом кнопки на сайте, ее размером, шрифтом и другими параметрами, позволяющими однозначно выделить кнопку. Обеспечьте ее контраст с остальными элементами сайта.
4. Задумайтесь о форме
Если интерфейс сайта предполагает использование закругленных кнопок, можно выделить CTA-элемент, сделав его прямоугольным, круглым или даже треугольным. Это еще один способ создания контраста, привлекающего внимание пользователя.
5. Скройте все малозначимые элементы сайта
Сюда относятся пункты меню, всевозможные контроллеры и бегунки. Их нужно по возможности скрывать либо оформлять в едином стиле с общим интерфейсом так, чтобы они не выделялись (например, использовать одинаковые радиусы закруглений, но различные тени, градиенты и т. п.).
6. Добавьте «воздуха»
Акцент на кнопке можно создать, окружив ее обширным пустым пространством. Так элемент гарантированно станет заметнее.
7. Оформите границы кнопки
Большая часть веб-кнопок обрамляется обводкой. И здесь существует важное правило: когда кнопка темнее фона, ее следует обрамлять еще более темной обводкой. Если же фон более темный, то граница кнопки должна быть темнее именно его.
8. Анимируйте кнопку
Возможность анимации многие упускают из вида. Помните, что кнопку следует оживить, добавив эффекты увеличения, моргания или иного движения при наведении курсора мыши либо независимо от действий пользователя.
9. Используйте размытые тени аккуратно
Существует так называемый закон теней, в соответствии с которым тень максимально эффективна, когда обрамляемый ею элемент светлее фона. В иных случаях затенением следует пользоваться с большой аккуратностью.
10. Добавляйте вспомогательные пиктограммы
Небольшие иконки на кнопках помогут посетителю сориентироваться. К примеру, стрелка вправо даст пользователю знать, что после нажатия на элемент произойдет переход на следующую страницу либо выход с текущей. А нажав на кнопку с пиктограммой стрелки вниз, посетитель попадет в выпадающее меню.
11. Распределяйте элементы по степени важности
При создании интерфейса нужно задать некий приоритет функциям, определив для них первичный, вторичный и третичный стили. В первой, наиболее приоритетной группе кнопки CTA должны быть окрашены в самые сильные цвета. Ослабляйте цветовую гамму с уменьшением значимости элементов. Снижайте акцент кнопок также путем уменьшения их размеров и пустого пространства вокруг них. Уменьшая шрифт надписей и уровень тиснения, вы также снизите визуальный вес элементов.
12. Явно отображайте текущее состояние кнопки
Многим будет очевидно, что кнопка должна визуально выглядеть как нажатая или отжатая в зависимости от ее состояния. Применительно к CTA-элементу эта наглядность особенно важна для пользователя. Реализовать данный эффект можно с помощью функционала CSS (тени, градиенты, границы). В качестве альтернативы при наличии достаточного места используются, хотя и достаточно редко, две кнопки вместо одной.
Подытожим. В нынешнее время, когда интерфейсы пересыщены отвлекающими элементами, маркетологам приходится противостоять баннерной слепоте, возникающей у пользователей. Современные условия вынуждают владельцев продающих сайтов использовать все доступные средства для захвата внимания аудитории. Красивой и яркой упаковки продукта, снабженной цепляющим креативом, сегодня недостаточно. Необходимо обращать внимание на самые мелкие детали для мотивации пользователей, в том числе на цвет кнопки на сайте.
Уменьшение объема хранилища или аннулирование тарифного плана iCloud+
Если у вас больше пространства в хранилище iCloud, чем требуется, вы можете аннулировать тарифный план iCloud+ или сменить его на план с меньшим объемом пространства.
Прежде чем аннулировать iCloud+ или перейти на тарифный план с меньшим объемом пространства, скачайте или удалите содержимое, которое не поместится в хранилище нового объема. Чтобы не потерять информацию, узнайте, как скопировать данные, хранящиеся в iCloud.
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на iPhone, iPad или iPod touch
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на компьютере Mac
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на компьютере с Windows
Что происходит при уменьшении объема хранилища или аннулировании тарифного плана iCloud+
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на iPhone, iPad или iPod touch
Откройте приложение «Настройки».
Нажмите свое имя.
Нажмите iCloud.
Нажмите «Управлять хранилищем учетной записи» или «Управлять хранилищем».
Нажмите «Сменить план хранилища».
Нажмите «Выбрать бесплатный план» и введите пароль идентификатора Apple ID.
Выберите другой тарифный план:
Чтобы перейти на тарифный план с меньшим объемом хранилища, выберите новый объем.
Чтобы отменить подписку iCloud+, выберите бесплатный тарифный план на 5 ГБ или вариант «Нет».
Нажмите «Готово». Если вы не можете нажать «Готово», убедитесь, что вход выполнен с тем же идентификатором Apple ID, который используется для тарифного плана iCloud+. Вы также можете попробовать выполнить эти действия на другом устройстве. Если вам все еще нужна помощь, обратитесь в службу поддержки Apple.
В случае аннулирования тарифного плана iCloud+ или уменьшения объема хранилища изменения вступят в силу по окончании текущего расчетного периода подписки1.
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на компьютере Mac
Выберите меню Apple > «Системные настройки».
Нажмите Apple ID. Если у вас установлена macOS Mojave или более ранней версии, нажимать Apple ID не нужно.
Нажмите iCloud.
Нажмите «Управлять».
Нажмите «Сменить план хранилища».
Нажмите «Выбрать бесплатный план».
Введите пароль идентификатора Apple ID и нажмите «Управлять».
Выберите другой тарифный план:
Чтобы перейти на тарифный план с меньшим объемом хранилища, выберите новый объем.
Чтобы отменить подписку iCloud+, выберите бесплатный тарифный план на 5 ГБ или вариант «Нет».
Нажмите «Готово». Если вы не можете нажать «Готово», убедитесь, что выполнен вход с тем же идентификатором Apple ID, который используется для тарифного плана iCloud+. Вы также можете попробовать выполнить эти действия на другом устройстве. Если вам все еще нужна помощь, обратитесь в службу поддержки Apple.
В случае аннулирования тарифного плана iCloud+ или уменьшения объема хранилища изменения вступят в силу по окончании текущего расчетного периода подписки1.
Как аннулировать тарифный план iCloud+ или перейти на тарифный план с меньшим объемом пространства на компьютере с Windows
Откройте приложение iCloud для Windows.
Нажмите «Хранилище».
Нажмите «Сменить план хранилища».
Нажмите «Выбрать бесплатный план».
Введите пароль идентификатора Apple ID и нажмите «Управлять».
Выберите другой тарифный план:
Чтобы перейти на тарифный план с меньшим объемом хранилища, выберите новый объем.
Чтобы отменить подписку iCloud+, выберите бесплатный тарифный план на 5 ГБ или вариант «Нет».
Нажмите «Готово». Если вы не можете нажать «Готово», убедитесь, что выполнен вход с тем же идентификатором Apple ID, который используется для тарифного плана iCloud+. Вы также можете попробовать выполнить эти действия на другом устройстве. Если вам все еще нужна помощь, обратитесь в службу поддержки Apple.
В случае аннулирования тарифного плана iCloud+ или уменьшения объема хранилища изменения вступят в силу по окончании текущего расчетного периода подписки1.
Что происходит при уменьшении объема хранилища или аннулировании тарифного плана iCloud+
Если объем данных в iCloud превысит объем хранилища по новому тарифному плану, iCloud не будет синхронизировать и обновлять данные. Обновление возобновится, когда вы увеличите объем хранилища или освободите место, удалив данные.
При переходе на бесплатный тарифный план iCloud вы потеряете доступ к таким функциям iCloud+, как «Скрыть e-mail», «Частный узел» и «Защищенное видео HomeKit».2.
Если вы платите за подписку Apple One и тарифный план iCloud+ одновременно, можно уменьшить объем хранилища или аннулировать тарифный план iCloud+ и просто пользоваться тарифным планом iCloud+, включенным в подписку Apple One.
1. Частичный возврат средств осуществляется в установленном законом порядке. Если вы недавно сменили тарифный план хранилища iCloud+, обратитесь за возвратом средств в компанию Apple в течение 14 дней. Узнайте, как запросить возмещение.
2. Некоторые функции доступны не во всех странах и регионах.
Информация о продуктах, произведенных не компанией Apple, или о независимых веб-сайтах, неподконтрольных и не тестируемых компанией Apple, не носит рекомендательного или одобрительного характера. Компания Apple не несет никакой ответственности за выбор, функциональность и использование веб-сайтов или продукции сторонних производителей. Компания Apple также не несет ответственности за точность или достоверность данных, размещенных на веб-сайтах сторонних производителей. Обратитесь к поставщику за дополнительной информацией.
Дата публикации:
Кнопки на пульте телевизора LG Smart TV — журнал LG MAGAZINE Россия
Телевизоры LG Smart TV – модели с интегрированным интернетом, позволяющие не только смотреть программы кабельного, спутникового телевидения, но и скачивать и устанавливать приложения, играть в игры, слушать музыку на стриминговых сервисах и многое другое. Все современные модели телевизоров LG оснащены этой опцией.
Выпуск смарт-телевизоров начался сравнительно недавно, но очень быстро стал массовым: по оценкам специалистов в 2010 году функциями Smart TV было снабжено около 40% производимых в мире телевизоров, в 2011-м – уже 90%. С тех пор технологии непрерывно совершенствуются, и функционал телевизоров LG становится все шире с каждым годом.
Первые smart-телевизоры LG шли в комплекте с обычными пультами дистанционного управления. Но уже с 7 серии каждый телевизор LG Smart TV снабжен дополнительно пультом Magic Remote (LG Magic Motion), с помощью которого можно легко управлять не только смарт-функциями телевизора LG, но и другими устройствами, подключенными к телевизору, к примеру, Blu-Ray проигрывателем, домашним кинотеатром или приставкой. Подробнее о том, как настроить пульт LG Magic Remote, читайте здесь.
Если у вас телевизор более ранней версии, то пульт Magic Remote можно приобрести отдельно или использовать вместо него смартфон, скачав и установив на него приложение LG WebOS Magic Remote (https://play. google.com/store/apps/details?id=com.lgerp.mobilemagicremote&hl=ru)
Преимущества пульта LG Magic Remote
Встроенный гироскоп, с помощью которого можно перемещать курсор на экране телевизора, просто двигая рукой с пультом в пространстве.
Колесико, идентичное колесику на компьютерной мыши, облегчающее серфинг в интернете.
Голосовой поиск.
Опция управления жестами (доступна на самых новых пультах LG Magic Remote).
Но и при помощи стандартного пульта можно пользоваться всеми функциями вашего телевизора LG Smart TV. Главное, разобраться в функционале кнопок, а их на пульте немало!
Функции каждой кнопки пульта прописаны в Руководстве пользователя к вашему телевизору LG. Однако, если по какой-то причине у вас нет возможности ознакомиться с ней, то вот подробное описание каждой кнопки на пульте дистанционного управления телевизора LG Smart TV.
Все кнопки на вашем пульте ДУ можно условно разбить на шесть неравномерных блоков в зависимости от их функционала.
В левом верхнем углу пульта расположена круглая кнопка включения / выключения телевизора. Она крупнее остальных и помечена пиктограммой разомкнутый круг и вертикальная полоса.
Кнопка Input (пиктограмма «Прямоугольник и направленная него горизонтальная стрелка») отвечает за изменение источника входного сигнала.
Settingsдает доступ к главному меню настроек телевизора.
INFO отображает информацию о текущей программе или входе.
Subtitleпредназначена для субтитров (работает на цифровых каналах).
TV / Rad переключает режимы цифровое телевидение / аналоговое телевидение / радио.
Ниже находится блок числовых кнопок.
В нем также находится кнопка «Пробел» (пиктограмма пробел), а также кнопки Guide – отображение программы передач и Q. View – возврат к ранее просматриваемой программе.
В центральном блоке располагаются кнопки увеличения / уменьшения громкости (пиктограмма «Треугольник») и последовательного переключения каналов. Эти клавиши – самые крупные на пульте, так как они используются чаще остальных.
Также в этом блоке располагаются следующие кнопки:
FAV открывает доступ к списку избранных каналов.
3D – включение / выключение 3D-режима.
Mute(пиктограмма «Перечеркнутый динамик») позволяет полностью выключить звук (повторное нажатие включает звук на том же уровне громкости)
Recent отображает предыдущие действия.
Smart (пиктограмма «Дом») дает доступ к функциям смарт-тв.
Live—Menu отображает списки рекомендуемых каналов / поиск / записанные (различается в зависимости от страны).
Ниже располагаются кнопки навигации (джойстик): вверх – вниз – влево — вправо. С их помощью можно перемещаться в меню телевизора LG Smart TV в выбранном направлении.
КнопкаOK – подтверждение действия.
Здесь же располагаются кнопки телетекста ТEXT/ T.OPT. Они используются для работы с телетекстом.
Кнопка Back позволяет вернуться на один уровень выше в меню.
EXIT закрывает окна просмотра на экране и возвращает к просмотру ТВ.
Нижний блок клавиш предназначен для управления специальными функциями вашего телевизора.
AD включает функцию аудио описаний.
REC/* предназначена для записи и отображения меню записи. (Только для телевизоров с поддержкой функции Time Machine)
Кнопки с пиктограммами «квадрат», «треугольник», «два треугольника» позволяют управлять содержимым премимум-контента, Time Machine, меню Smart Share или Simplink-совместитыми устройствами.
Цветные клавиши (красная (пиктограмма «Одна точка», зеленая (Пиктограмма «Две точки»), желтая (пиктограмма «Три точки») и синяя (пиктограмма «Четыре точки») дают доступ к специальным функциям меню.
В зависимости от модели вашего телевизора LG и года выпуска блоки кнопок на пульте могут располагаться в другой последовательности.
FAQ: Настройки — Темы, Дизайн страницы Таплинк, как настроить оформление
— Все —Оформление страницыPixelМодулиПлатежиВставка HTML-кодаПодключение домена, SEO
Как включить анимацию для кнопок?
Для включения анимации для блоков «Ссылка» перейдите на вкладку «Настройки» этого блока, включите переключатель «Анимация» и выберите подходящий эффект.
Как включить новогоднюю тему оформления?
Выберите понравившуюся тему на странице Дизайн — Animation — CHRISTMAS.
Как поменять тему оформления страницы?
Настройки оформления страницы находятся на странице «Дизайн» личного кабинета Taplink.
Как настроить оформление страницы на базовом (бесплатном BASIC) тарифе?
На базовом (бесплатном BASIC) тарифе можно выбрать одну из стандартных тем оформления страницы.
Выбор темы оформления осуществляется на странице «Дизайн«.
Для перехода режим предварительного просмотра оформления страницы нажимают кнопку «Просмотр«, листать варианты оформления выбранной темы можно с помощью кнопок-стрелочек. Для выбора понравившегося варианта дизайна служит кнопка «Выбрать«
Как выбрать тему оформления?
Настройки оформления выполняют на странице «Дизайн» личного кабинета.
Стандартные варианты темы оформления сгруппированы на вкладках Simple (простые), Advanced (расширенные), Animation (анимированные). Персонализированные вами варианты тем оформления доступны на странице «Мои дизайны«.
Для предварительного просмотра темы оформления (ее примерки на свою страницу) служит кнопка «Просмотр«. Если тема оформления имеет несколько вариантов их можно листать с помощью кнопок стрелочек по бокам экрана.
Для выбора понравившегося варианта темы оформления нажимают кнопку «Выбрать«.
Как отредактировать тему оформления страницы?
Для настройки персонализированного оформления страницы Taplink необходимо наличие платного тарифа (PRO или BUSINESS). Настройки оформления выполняют на странице «Дизайн» личного кабинета.
В качестве исходной темы оформления можно выбрать любую стандартную тему оформления, размещенную на вкладках Simple (простые), Advanced (расширенные), Animation (анимированные). Чтобы внести в нее правки нажимают кнопку «Редактировать«. Персонализированные вами варианты тем оформления доступны на странице «Мои дизайны«. Вы можете создать несколько вариантов своего дизайна и вносить изменения в них в любое время.
Как создать свою тему оформления «с нуля», не выбирая за основу стандартную тему?
Перейдите на страницу «Дизайн» — «Мои дизайны«, нажмите кнопку «+» на изображении пустой темы оформления, подтвердите создание нового дизайна и внесите нужные вам коррективы.
Как удалить тему оформления?
Для удаления собственной темы оформления переходят в «Дизайн» — «Мои дизайны«, кликают по нужной теме и нажимают кнопку с изображением корзины.
Как настроить оформление кнопок (ссылок)?
Для настройки оформления кнопок переходят в режим редактирования темы оформления (страница «Дизайн«, где нажимают кнопку «Редактировать» для нужной темы оформления) и указывают нужные параметры в секции «Ссылка«. Можно задать шрифты и цвета надписей на кнопках, степень прозрачности кнопки (0 — непрозрачная, 100% — полностью прозрачная, только контур отображается), закругление (0px — прямоугольная, 50px — максимальное закругление) и стиль ссылки (текст по центру или выравнивать влево с отображением стрелки). После внесения всех правок нажимают «Сохранить«.
Как сделать прозрачную кнопку?
Для добавления кнопкам прозрачности переходят в режим редактирования темы оформления и задают нужные параметры в разделе «Ссылка».
Прозрачность кнопки задаётся в % (0 — непрозрачная, 100% полностью прозрачная).
Также можно настроить толщину границы кнопки (0px — граница кнопки не отображается, видны только кликабельный заголовок/подзаголовок.)
Для применения изменений нажимают кнопку «Сохранить«.
Как сделать кнопку, отличающуюся от других?
Для создания кнопки в цветах отличающихся от заданных в теме оформления необходимо на вкладке «Настройки» этого блока включить «Свои настройки дизайна» и задать цвета фона /надписи.
Как сделать часть кнопок прозрачными, а часть со сплошной заливкой фоновым цветом?
Для создания прозрачных кнопок необходимо:
1. Включить прозрачность для кнопок в настройках темы оформления (прозрачные кнопки создаются только так).
2. Для кнопок, которые должны получить фоновую заливку, активировать «Свои настройки дизайна» в настройках этих кнопок.
Кнопки мессенджеров не меняют цвет, задаю в «Своих настройках дизайна». Почему?
Необходимо выбрать стиль оформления отличный от «Иконки приложений».
Если вводите свои коды цветов — не проверьте, чтобы была указана # перед кодом цвета.
Как сделать закругление блоков?
Для настройки закругления блоков переходят в режим редактирования темы оформления и задают нужные параметры в разделе «Блоки«. Закругление задается в px, 0 — блоки прямоугольные, 50px — максимальное закругление. Для применения изменений нажимают кнопку «Сохранить«.
Как настроить цвета в блоке «Карусель картинок»?
Для настройки цветов элементом блока «Карусель картинок» переходят в режим редактирования темы оформления и задают нужные параметры в разделе «Блоки«. Для применения изменений нажимают кнопку «Сохранить«.
Как задать свой код цвета?
Для задания своего кода цвета в окне выбора цвета переходят на вкладку «Свой цвет«, где выбирают его из палитры или вводят вручную. При вводе своего кода цвета используется код вида #******, с # в начале, 6 знаков. Прозрачность (альфа-канал) задается в настройках параметров в секции «Ссылка«, а не коде цвета.
Как настроить цвет фона или фоновое изображение?
Для настройки цвета фона и фоновой картинки переходят в режим редактирования темы оформления и задают нужные параметры в разделе «Фон«.
Для фоновой заливки можно выбрать заливку одним цветом или двухцветный градиент.
Для фонового изображения задается само изображение, его размещение на странице (адаптивно по ширине, растянуть на всю ширину, растянуть на весь экран или замостить плиткой), выравнивание, режим повтора и степень прозрачности (0% — непрозрачное).
Формат фоновой картинки должен соответствовать длине вашего Taplink. Чем больше информации на странице, тем она должна быть длиннее. Мы не рекомендуем использовать большие фоновые картинки, это ухудшает время загрузки вашей страницы при медленном интернет-подключении и на слабых устройствах. Лучше ориентироваться на возможность бесшовного «сращивания» изображений по высоте.По ширине — рекомендуем ориентироваться на 540 или 1080 точек. Цвет фоновой заливки рекомендуется выбрать соответствующим цвету фона выбранного изображения.
Для применения изменений нажимают кнопку «Сохранить«.
Какое должно быть разрешение фоновой картинки?
Формат фоновой картинки должен соответствовать длине вашего Taplink.
Чем больше информации на странице, тем она должна быть длиннее. Но мы не рекомендуем использовать большие фоновые изображения, это ухудшает время загрузки вашей страницы при медленном интернет-подключении и на слабых устройствах.
Лучше ориентироваться на возможность бесшовного «сращивания» изображений по высоте.По ширине — рекомендуем ориентироваться на 540 или 1080 точек.
Цвет фоновой заливки рекомендуется выбрать соответствующим цвету фона выбранного изображения. Это очень важно, так как ваши посетители могут также не увидеть текст в том случае если картинка будет не загружена (например по причине плохого качества интернета или низкой скорости). Если же цвет фона указать близкий к картинке, то люди сначала увидят читаемый текст, цвет фона, а уже когда картинка будет загружена — увидят картинку в фоне.
Что такое «Секции»?
С помощью «Секций» можно объединить несколько блоков в единую тему оформления, выделив их фоном произвольного цвета или фоновой картинкой.
Секции могут быть локальными (созданными прямо на странице для одного или нескольких блоков) или глобальными (создаются в теме оформления, их удобно применять в один клик к нужным блокам).
Как создать глобальную секцию и применить ее к блоку?
Для создания глобальной секции переходят в Дизайн — Мои дизайны, нажимают «Редактировать» для выбранной темы оформления и нажимают кнопку «Добавить Секцию«. Наименования секций идут по номерам, в порядке их добавления.
Для каждой секции можно задать отступы (сверху, снизу и сбоку — если отступ с боку отключен — то секция растягивается на весь экран), параметры фона (цвет, картинку), шрифты (для текстовых блоков) и параметры оформления кнопок. После настройки секции нажимают кнопку «Сохранить» настроек темы оформления.
Чтобы применить созданную секцию к блоку переходят на вкладку «Секция» этого блока, выбирают нужную секцию из списка и нажимают кнопку «Сохранить«. При необходимости параметры секции можно отредактировать прямо в настройках блока.
Празднование Дня Рождения, Воздушный Шар, Синий, День Рождения, Синие латексные шары, игрушечный шар, большой воздушный шар, темно-синий, баллон, день рождения
, синий png
983x1024px
796.51KB
синие воздушные шары арт, воздушный шар темно-синий партия оттенки синего, воздушный шар, синий, свадьба, чирок png
600x600px
318.36KB
сине-серая подарочная коробка, воздушный шар Синий подарок с днем рождения, голубой подарочный шар, плавающий, желание, декоративный png
908x1000px
3.48MB
Легко расширяйте элементы управления формы, добавляя текст, кнопки или группы кнопок по обе стороны от текстовых вводов, настраиваемых элементов выбора и настраиваемых вводов файлов.
Базовый пример
Разместите по одной надстройке или кнопке по обе стороны от входа. Вы также можете разместить по одному с обеих сторон входа. Мы не поддерживаем несколько элементов управления формами в одной группе ввода и s должны находиться за пределами группы ввода.
@example.com
Ваш персональный URL
https://example.com/users/
С текстовой областью
<дел>
<дел>
@
<дел>
<дел>
@example.com
<дел>
<дел>
https://example.com/users/
<дел>
<дел>
$
<дел>
. 00
<дел>
<дел>
С текстовой областью
дел>
Размер
Добавьте классы относительного размера формы к самой группе .input-group , и содержимое автоматически изменит размер — нет необходимости повторять классы размера элемента управления формой для каждого элемента.
Изменение размеров отдельных элементов входной группы не поддерживается.
По умолчанию
<дел>
<дел>
Маленький
<дел>
<дел>
По умолчанию
<дел>
<дел>
Большой
дел>
Флажки и радио
Поместите любой флажок или переключатель в надстройку группы ввода вместо текста.
<дел>
<дел>
<дел>
<дел>
<дел>
<дел>
дел>
Несколько входов
Хотя несколько поддерживаются визуально, стили проверки доступны только для групп ввода с одним .
Имя и фамилия
<дел>
<дел>
Имя и фамилия
<тип ввода="текст">
<тип ввода="текст">
дел>
Несколько надстроек
Поддерживается несколько надстроек, которые можно смешивать с версиями флажков и радиовходов.
Программы чтения с экрана будут иметь проблемы с вашими формами, если вы не включите метку для каждого ввода. Для этих групп ввода убедитесь, что любые дополнительные метки или функции передаются вспомогательным технологиям.
Точный метод, который будет использоваться ( элементов, скрытых с помощью класса .sr-only или использования aria-label и aria-labelledby атрибутов, возможно, в сочетании с aria-describedby ) и то, какая дополнительная информация должна быть передана, зависит от конкретного типа интерфейсного виджета, который вы реализуете. Примеры в этом разделе предлагают несколько подходов для конкретных случаев.
Кнопка выбора | Документация Mendix
Последнее изменение: 29 июня 2022 г.
Кнопка выбора подтверждает выбор строки сетки, когда она используется для выбора объекта для селектора ссылок или селектора набора ссылок. По этой причине кнопку выбора можно разместить только в сетке на странице, которая подключена к селектору ссылок или к кнопке «Добавить» селектора набора ссылок.
Общие свойства
Класс
Свойство класса позволяет указать один или несколько классов каскадной таблицы стилей (CSS) для виджета. Классы должны быть разделены пробелом. Классы будут применены к виджету в браузере, и виджет получит соответствующий стиль. Классы должны быть классами в теме, которая используется в проекте. Он отменяет стиль виджета по умолчанию.
Вы можете увидеть, к каким виджетам на странице применен стиль, с помощью свойства класса или стиля, щелкнув значок Показать стили кнопки.
{{< figure src="/attachments/refguide7/desktop-modeler/pages/show-styles.png" alt="Расположение и действие кнопки Показать стили" >}}
Стиль
Свойство стиля позволяет вам указать дополнительные стили CSS. Если также указан класс, этот стиль применяется после класса.
Например:
background-color:lightblue; красный цвет;
приведет к красному тексту на синем фоне.
Вы можете увидеть, к каким виджетам на странице применен стиль, с помощью свойства стиля или класса, нажав кнопку Показать стили .
Общие свойства
Заголовок
Заголовок определяет отображаемый текст. Шаблон может содержать параметры, которые записываются в виде числа между фигурными скобками, например. {1}. Первый параметр имеет номер 1, второй 2 и так далее. Обратите внимание, что для использования параметров шаблона виджет должен быть помещен в контекст объекта, например. внутри представления данных или представления списка. Параметры будут заменены значениями атрибутов.
Tooltip
Свойство tooltip определяет текст, который вы увидите во всплывающей подсказке, которая появляется при наведении курсора на кнопку. Текст всплывающей подсказки является переводимым. См. Переводимые тексты. Если всплывающая подсказка не указана, при наведении курсора на кнопку всплывающая подсказка отображаться не будет.
Изображение
Это свойство указывает, какое изображение будет отображаться перед заголовком кнопки.
Icon
Свойство icon определяет значок, который будет отображаться перед заголовком кнопки. Есть три варианта: без значка, значок глифа или (растровое) изображение. Иконки глифов взяты из коллекции Bootstrap Halflings. Преимущества значка глифа по сравнению с растровым изображением заключаются в том, что глифы масштабируемы, выглядят четко на экранах с высоким разрешением, а их цвет можно изменить, изменив цвет шрифта. Преимущество значка изображения в том, что он может иметь несколько цветов.
Стиль кнопки
Это свойство применяет к кнопке предопределенный стиль.
Кнопка по умолчанию
Это свойство указывает, является ли эта кнопка кнопкой по умолчанию для сетки или селектора набора ссылок. Селектор сетки или набора ссылок может иметь только одну кнопку по умолчанию. Кнопка по умолчанию срабатывает при щелчке или двойном щелчке по строке. Независимо от того, срабатывает ли щелчок или двойной щелчок, это зависит от свойства «триггер кнопки по умолчанию» сетки данных, сетки шаблона или селектора набора ссылок.
Кнопка по умолчанию помечена суффиксом «[по умолчанию]» в Modeler, так что вы можете легко найти ее. На снимке экрана ниже кнопка «Изменить» является кнопкой по умолчанию, а кнопка «Удалить» имеет стиль кнопки «Предупреждение».
{{< Figure src="/attachments/refguide7/desktop-modeler/pages/is-default-button-property.png" >}}
Значение по умолчанию: False
Свойства видимости
Видимый
По умолчанию , то, отображается ли элемент в браузере, определяется дизайном страницы и ролями пользователя в приложении. Однако страницу можно настроить так, чтобы элемент скрывался, если не выполняется определенное условие.
Контекст
Виджет можно сделать видимым только в том случае, если объект представления данных, содержащий виджет, удовлетворяет заданным критериям.
Практическим примером может служить интернет-магазин, в котором пользователь должен предоставить как информацию для выставления счетов, так и информацию о доставке. В этом случае вы, возможно, не захотите беспокоить пользователя вторым набором полей ввода адреса, если они не указывают, что адрес для выставления счета и адрес доставки не совпадают. Этого можно добиться, сделав поля адреса доставки видимыми по условию на основе логического атрибута 9.0037 СамеБиллингандДеливериАдресс .
На основе значения атрибута
При выборе этого виджета отображается виджет, в то время как определенный атрибут имеет определенное значение. Для этой цели можно использовать только логические атрибуты и атрибуты перечисления.
Основано на выражении
Добавлено в Mendix 7.1.
Если выбрано, отображается виджет, пока предоставленное выражение оценивается как истинное. Объект содержащего представления данных доступен внутри выражения как $currentObject переменная.
Обратите внимание, что выражение оценивается в браузере, поэтому мы не рекомендуем использовать в нем «секретные» значения (например, ключи доступа). В частности, мы запрещаем использование констант. Кроме того, выражения на стороне клиента в настоящее время не поддерживают все функции, доступные в микропотоках. Пожалуйста, обратитесь к списку автозаполнения, чтобы узнать, какие функции поддерживаются в вашей версии.
Роли модулей
Виджет можно сделать видимым для подмножества ролей пользователей, доступных в вашем приложении. При активации этот параметр сделает виджет невидимым для всех пользователей, которые не связаны ни с одной из выбранных ролей пользователя.
Добавить флажок или кнопку выбора (элементы управления формы)
Excel для Microsoft 365 Excel для Интернета Excel 2021 Excel 2019 Excel 2016 Excel 2013 Excel 2010 Excel 2007 Дополнительно…Меньше
Вы можете вставлять элементы управления формы, такие как флажки или переключатели, чтобы упростить ввод данных. Флажки хорошо подходят для форм с несколькими параметрами. Кнопки выбора лучше, когда у пользователя есть только один выбор.
Чтобы добавить флажок или кнопку выбора, вам понадобится 9Вкладка 0265 Разработчик на вашей ленте.
Примечания: Чтобы включить вкладку «Разработчик», следуйте этим инструкциям:
org/ListItem»>.
В Excel 2010 и последующих версиях щелкните Файл > Параметры > Настроить ленту , установите флажок Разработчик и щелкните OK .
В Excel 2007 нажмите кнопку Microsoft Office > Параметры Excel > Популярные > Показать вкладку «Разработчик» на ленте .
Чтобы добавить флажок, щелкните вкладку Разработчик , щелкните Вставить и в разделе Элементы управления формой щелкните .
Чтобы добавить кнопку выбора, нажмите кнопку Вкладка Разработчик щелкните Вставить и в разделе Элементы управления формой щелкните .
Щелкните ячейку, в которую вы хотите добавить флажок или переключатель.
Совет: Одновременно можно добавить только один флажок или переключатель. Чтобы ускорить процесс, после добавления первого элемента управления щелкните его правой кнопкой мыши и выберите Копировать > Вставить .
Чтобы изменить или удалить текст по умолчанию для элемента управления, щелкните элемент управления, а затем при необходимости обновите текст.
Совет: Если вы не видите весь текст, нажмите и перетащите один из маркеров управления, пока не сможете прочитать весь текст. Размер элемента управления и его расстояние от текста изменить нельзя.
Форматирование элемента управления
После того, как вы вставите флажок или кнопку выбора, вы можете убедиться, что они работают так, как вы хотите. Например, вы можете настроить внешний вид или свойства.
Примечание. Размер переключателя внутри элемента управления и его расстояние от соответствующего текста изменить нельзя.
Чтобы отформатировать элемент управления, щелкните его правой кнопкой мыши и выберите Формат элемента управления .
org/ListItem»>
В диалоговом окне Управление форматом на вкладке Управление можно изменить любой из доступных параметров:
Checked : Отображает выбранную кнопку выбора.
Unchecked : Отображает неактивную кнопку выбора.
В поле Ссылка на ячейку введите ссылку на ячейку, содержащую текущее состояние переключателя.
Связанная ячейка возвращает номер выбранной кнопки выбора в группе параметров. Используйте одну и ту же связанную ячейку для всех параметров в группе. Первая кнопка выбора возвращает 1, вторая кнопка выбора возвращает 2 и так далее. Если у вас есть две или более групп параметров на одном листе, используйте разные связанные ячейки для каждой группы параметров.
Используйте возвращенное число в формуле для ответа на выбранный параметр.
Например, форма персонала с групповым полем Тип работы содержит две кнопки выбора с метками Полный рабочий день и Неполный рабочий день , связанные с ячейкой C1. После того как пользователь выбирает один из двух вариантов, следующая формула в ячейке D1 оценивается как «Полный рабочий день», если выбран первый переключатель, или «Неполный рабочий день», если выбран второй переключатель.
=ЕСЛИ(C1=1,»Полный рабочий день»,»Неполный рабочий день»)
Если у вас есть три или более параметров для оценки в одной группе параметров, вы можете использовать функции ВЫБОР или ПРОСМОТР аналогичным образом.
Нажмите OK .
Удаление элемента управления
В настоящее время вы не можете использовать элементы управления флажками в Excel для Интернета. Если вы работаете в Excel в Интернете и открываете книгу с флажками или другими элементами управления (объектами), вы не сможете редактировать книгу, не удаляя эти элементы управления.
Важно: Если вы видите сообщение «Изменить в браузере?» или сообщение «Неподдерживаемые функции» и в любом случае выберите редактирование книги в браузере, все объекты, такие как флажки и поля со списком, будут немедленно потеряны. Если это произойдет, и вы хотите вернуть эти объекты, используйте Предыдущие версии для восстановления более ранней версии.
Если у вас настольное приложение Excel, щелкните Открыть в Excel и добавьте флажки или переключатели.
Нужна дополнительная помощь?
Вы всегда можете обратиться к эксперту в техническом сообществе Excel или получить поддержку в сообществе ответов.
См. также
Добавьте флажок, параметр или кнопку-переключатель (элементы управления ActiveX)
Выбор одного или нескольких полей значений или заполнителей
shadow
Выбор — это элементы управления формы для выбора параметра или параметров из набора параметров, аналогично собственному элементу . Когда пользователь нажимает кнопку выбора, появляется диалоговое окно со всеми параметрами в большом, удобном для выбора списке.
Выбор должен использоваться с дочерними элементами . Если для дочернего варианта не задано значение value атрибут, то его текст будет использоваться как значение.
Если значение установлено на , выбранная опция будет выбрана на основе этого значения.
По умолчанию выбор позволяет пользователю выбрать только один вариант. Интерфейс предупреждений представляет пользователям список параметров в виде переключателя. Значение компонента select получает значение значения выбранного параметра.
По умолчанию select использует ion-alert, чтобы открыть наложение опций в предупреждении. Интерфейс можно изменить для использования ion-action-sheet или ion-popover, передав action-sheet или popover , соответственно, к свойству интерфейса . Прочтите другие разделы об ограничениях различных интерфейсов.
Список действий
Popover
Добавляя атрибут Multiple для выбора, пользователи могут выбирать несколько вариантов. Когда можно выбрать несколько параметров, наложение предупреждений представляет пользователям список параметров в виде флажков. Значение компонента select получает массив всех выбранных значений параметра.
Примечание: интерфейсы листа действий и popover не будут работать с множественным выбором.
Основными способами обработки взаимодействия пользователя с элементом выбора являются события ionChange , ionDismiss и ionCancel . Дополнительные сведения об этих и других событиях, в ходе которых выбираются пожары, см. в разделе События.
При использовании объектов для выбранных значений возможно изменение идентификаторов этих объектов, если они поступают с сервера или базы данных, в то время как идентификатор выбранного значения остается прежним. Например, это может произойти, когда существующая запись с требуемым значением объекта загружается в выборку, но только что извлеченные параметры выбора теперь имеют другие идентификаторы. Это приведет к тому, что выбор не будет иметь никакого значения, даже если исходный выбор останется нетронутым.
По умолчанию выбор использует равенство объектов ( === ), чтобы определить, выбран ли параметр. Это можно переопределить, указав имя свойства или функцию для свойства compareWith . . Текст каждой кнопки можно настроить с помощью свойств cancelText и okText .
Интерфейсы action-sheet и popover не имеют кнопки OK , щелчок по любому из параметров автоматически закроет наложение и выберет это значение. Интерфейс popover не имеет кнопки Cancel , нажатие на фон закроет оверлей.
Поскольку select использует интерфейсы предупреждений, листа действий и всплывающих окон, параметры могут быть переданы этим компонентам через свойство interfaceOptions . Это можно использовать для передачи пользовательского заголовка, подзаголовка, класса CSS и многого другого.
См. документы ion-alert, ion-action-sheet и ion-popover для получения информации о свойствах, которые принимает каждый интерфейс.
Примечание. Параметры интерфейса не переопределяют входы или кнопки с интерфейсом оповещения .
Компонент Select состоит из двух модулей, каждый из которых требует отдельного стиля. Элемент ion-select представлен в представлении выбранным значением (значениями) или заполнителем, если его нет, и значком раскрывающегося списка. Интерфейс, определенный в разделе «Интерфейсы» выше, представляет собой диалоговое окно, которое открывается при нажатии кнопки 9.0037 ион-селект . Интерфейс содержит все параметры, определенные путем добавления элементов ion-select-option . В следующих разделах будут рассмотрены различия между стилями.
Элемент выбора стиля
Как уже упоминалось, элемент ion-select состоит только из значения (значений) или заполнителя и значка, отображаемого в представлении. Чтобы настроить это, настройте стиль, используя комбинацию CSS и любых пользовательских свойств CSS.
В качестве альтернативы, в зависимости от необходимой поддержки браузера, можно использовать теневые части CSS для стилизации выделения. Обратите внимание, что с помощью ::part , можно использовать любое свойство CSS элемента.
Стилизация интерфейса выбора
Настройка диалогового окна интерфейса должна выполняться в соответствии с разделом «Настройка» в документации по этому интерфейсу:
Настройка предупреждений
class для упрощения стиля и позволяет передать класс параметру наложения, см. документацию по параметрам выбора для примеров использования параметров настройки.
Хотя этот интерфейс не является обязательным, его можно использовать вместо интерфейса CustomEvent для более надежной типизации с событиями Ionic, генерируемыми этим компонентом.
Если true , пользователь не может взаимодействовать с выбором.
Attribute
disabled
Type
boolean
Default
false
interface
Description
Интерфейс, который должен использовать выбор: лист действий , всплывающее окно или оповещение .
Attribute
interface
Type
"action-sheet" | "alert" | "popover"
Default
'alert'
Параметры интерфейса0038 ,
лист действий или popover интерфейс может взять. См. документы ion-alert, документы ion-action-sheet и ion-popover, чтобы узнать о параметрах создания для каждого интерфейса.
Примечание. Параметры интерфейса не переопределяют входы или кнопки с интерфейсом оповещения .
Атрибут
опции интерфейса
Тип
Любое
По умолчанию
{}
MODE
9059
MODE
.
Attribute
mode
Type
"ios" | "md"
Default
undefined
несколько
Описание
Если true , выбор может принимать несколько значений.
Attribute
multiple
Type
boolean
Default
false
name
Описание
Имя элемента управления, которое передается вместе с данными формы.
Attribute
name
Type
string
Default
this.inputId
okText
Описание
Текст, отображаемый на кнопке ОК.
Attribute
ok-text
Type
string
Default
'OK'
placeholder
Описание
Текст, отображаемый, когда выбор пуст.
Атрибут
заполнитель
Type
string | undefined
Default
undefined
selectedText
Description
The text to display instead of the значение выбранного параметра.
Атрибут
выбранный текст
Тип
null | string | undefined
Default
undefined
value
Description
the value of the select.
Attribute
value
Type
any
Default
undefined
Имя
Описание
ionBlur
5 теряет фокус.
ionCancel
Генерируется при отмене выбора.
ionChange
Генерируется при изменении значения.
ionDismiss
Генерируется при закрытии наложения.
ionFocus
Испускается, когда выделение имеет фокус.
открыть
Описание
Открытие выбранного наложения. Наложение представляет собой предупреждение, лист действий или всплывающее окно, в зависимости от свойства interface на ion-select .
Подпись
open(event?: UIEvent) => Promise
Имя
Описание
значок
Контейнер значков выбора.
заполнитель
Текст, отображаемый при выборе, когда нет значения.
текст
Отображаемое значение выбора.
Наименование
Описание
--padding-bottom
Нижнее заполнение селекта
--padding-end
Правое заполнение, если направление слева направо, а направление слева направо слева от выбора
--padding-start
Отступ слева, если направление слева направо, и отступ справа, если направление выбора справа налево
- -верхняя обивка
Top padding of the select
--placeholder-color
Color of the select placeholder text
--placeholder-opacity
Opacity of the select placeholder text
Нет доступных слотов для этого компонента.
Ссылка: Блочные элементы | Slack
Блочные элементы можно использовать внутри раздела , контекста , ввода и действий блоков макета.
Наш обзор поверхностей приложений, поддерживающих Block Kit, показывает, где можно добавлять блоки.
Наконец, наше руководство по интерактивности для пользователя поможет вам подготовить ваше приложение к использованию интерактивных компонентов, перечисленных ниже.
Приведенные ниже списки полей и значений описывают JSON, который приложения могут использовать для создания каждого элемента:
Кнопка
Флажки
Выбор даты
Изображение
Меню множественного выбора
Меню переполнения
Ввод обычного текста
Группа радиокнопок
Меню выбора
Выбор времени
Элемент кнопки
Работает с типами блоков: Раздел Действия
Интерактивный компонент, который вставляет кнопку. Кнопка может быть триггером для чего угодно: от открытия простой ссылки до запуска сложного рабочего процесса.
Чтобы использовать интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку вашего приложения. Прочтите наше руководство по включению интерактивности.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда кнопка .
текст
Объект
Да
Текстовый объект, определяющий текст кнопки. Может быть только тип: обычный_текст . текст может обрезаться примерно на 30 символов. Максимальная длина текста в этом поле составляет 75 символов.
action_id
Строка
Да
Идентификатор для этого действия. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
адрес
Строка
№
URL-адрес для загрузки в браузере пользователя при нажатии кнопки. Максимальная длина этого поля составляет 3000 символов. Если вы используете url , вы по-прежнему будете получать полезные данные о взаимодействии и должны будете отправить ответ с подтверждением.
значение
Строка
№
Значение для отправки вместе с полезной нагрузкой взаимодействия. Максимальная длина этого поля составляет 2000 символов.
стиль
Строка
№
Украшает кнопки альтернативными визуальными цветовыми схемами. Используйте этот вариант сдержанно.
первичный придает кнопкам зеленый контур и текст, что идеально подходит для действий подтверждения или подтверждения. первичный следует использовать только для одной кнопки в наборе.
опасность придает кнопкам красный контур и текст, и его следует использовать, когда действие разрушительно. Используйте опасность даже более экономно, чем основной .
Если не указать это поле, будет использоваться стиль кнопки по умолчанию.
На изображении выше показаны три различных варианта стиля.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения после нажатия кнопки.
ярлык_доступности
Строка
№
Метка для более длинного описательного текста об элементе кнопки. Эта метка будет прочитана программами чтения с экрана вместо кнопки текста объекта. Максимальная длина этого поля составляет 75 символов.
Группа флажков, которая позволяет пользователю выбирать несколько элементов из списка возможных вариантов.
Флажки поддерживаются только на следующих поверхностях приложения: Вкладки «Главная» Модальные окна Сообщения
Чтобы использовать подобные интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае введите всегда флажков .
action_id
Строка
Да
Идентификатор действия, запускаемого при изменении группы флажков. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
опции
Объект[]
Да
Массив объектов параметров. Допускается не более 10 вариантов.
начальные_опции
Объект[]
№
Массив объектов параметров, который точно соответствует одному или нескольким параметрам в пределах параметров . Эти параметры будут выбраны при первоначальной загрузке группы флажков.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после установки одного из флажков в этом элементе.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию ложь .
Элемент, который позволяет пользователям легко выбирать дату из пользовательского интерфейса в стиле календаря.
Чтобы использовать такие интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае type всегда datepicker .
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
заполнитель
Объект
№
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в средстве выбора даты. Максимальная длина текста в этом поле составляет 150 символов.
начальная_дата
Строка
№
Начальная дата, выбираемая при загрузке элемента. Это должно быть в формате ГГГГ-ММ-ДД .
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора даты.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию ложь .
Меню с множественным выбором позволяет пользователю выбирать несколько элементов из списка параметров. Как и обычные меню выбора, меню с множественным выбором также включают функцию опережающего ввода, когда пользователь может ввести часть или всю строку параметров для фильтрации списка.
Чтобы использовать интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку вашего приложения. Прочтите наше руководство по включению интерактивности.
Существуют различные типы меню с множественным выбором, которые зависят от различных источников данных для своих списков параметров:
Меню со статическими параметрами
Меню с внешним источником данных
Меню со списком пользователей
Меню со списком разговоров
Меню со списком каналов
Статические параметры
Работает с типами блоков: Section Input
Это простейшая форма меню выбора со статическим списком параметров, передаваемых при определении элемента.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В данном случае тип всегда multi_static_select .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
опции
Объект[]
Да
Массив объектов параметров. Максимальное количество опций 100. Если указано option_groups , этого поля быть не должно.
группы_опций
Объект[]
№
Массив объектов группы параметров. Максимальное количество групп опций — 100. Если указано options , этого поля быть не должно.
начальные_опции
Объект[]
№
Массив объектов параметров, которые точно соответствуют одному или нескольким параметрам в пределах options или option_groups . Эти параметры будут выбраны при первоначальной загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательное диалоговое окно подтверждения, которое появляется перед отправкой вариантов множественного выбора.
max_selected_items
Целое число
№
Задает максимальное количество элементов, которые можно выбрать в меню. Минимальное количество 1.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Это меню загружает свои параметры из внешнего источника данных, что позволяет использовать динамический список параметров.
Настройка
Чтобы использовать этот тип меню, вам необходимо сначала настроить приложение:
Перейдите на страницу настроек вашего приложения и выберите Интерактивность и ярлыки на боковой панели.
Добавить URL в Опции Загрузить URL в меню выбора.
Сохранить изменения.
Каждый раз, когда открывается меню этого типа или пользователь начинает вводить текст в поле ввода, мы отправляем запрос на указанный вами URL-адрес. Ваше приложение должно возвращать ответ HTTP 200 OK вместе с телом сообщения application/json с объектом, содержащим либо массив options , либо массив option_groups . Вот пример ответа:
Тип элемента. В этом случае тип всегда multi_external_select .
заполнитель
Объект
Да
A обычный_текст единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
min_query_length
Целое число
№
При использовании поля typehead запрос будет отправляться при каждом изменении символа. Если вы предпочитаете меньшее количество запросов или более продуманные запросы, используйте атрибут min_query_length , чтобы указать Slack наименьшее количество введенных символов, необходимое перед отправкой. Значение по умолчанию: 3 .
начальные_опции
Объект[]
№
Массив объектов параметров, которые точно соответствуют одному или нескольким параметрам в пределах options или option_groups . Эти параметры будут выбраны при первоначальной загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательное диалоговое окно подтверждения, которое появляется перед отправкой вариантов множественного выбора.
max_selected_items
Целое число
№
Задает максимальное количество элементов, которые можно выбрать в меню. Минимальное количество 1.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню множественного выбора в блоке раздела с внешним источником данных:
Это меню с множественным выбором заполнит свои параметры списком пользователей Slack, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда multi_users_select .
заполнитель
Объект
Да
A обычный_текст единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальные_пользователи
Строка[]
№
Массив идентификаторов любых допустимых пользователей, которые будут предварительно выбраны при загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательное диалоговое окно подтверждения, которое появляется перед отправкой вариантов множественного выбора.
max_selected_items
Целое число
№
Задает максимальное количество элементов, которые можно выбрать в меню. Минимальное количество 1.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню множественного выбора в блоке раздела, показывающее список пользователей:
Это меню с множественным выбором будет содержать его параметры со списком общедоступных и частных каналов, DM и MPIM, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае введите всегда multi_conversations_select .
заполнитель
Объект
Да
A обычный_текст единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальные_беседы
Строка[]
№
Массив из одного или нескольких идентификаторов любых действительных разговоров, которые будут предварительно выбраны при загрузке меню. Если также указано default_to_current_conversation , initial_conversations будет игнорироваться.
default_to_current_conversation
Логическое значение
№
Предварительно заполняет меню выбора разговором, который пользователь просматривал при открытии модального окна, если оно доступно. По умолчанию ложь .
подтвердить
Объект
№
Объект подтверждения, определяющий необязательное диалоговое окно подтверждения, которое появляется перед отправкой вариантов множественного выбора.
max_selected_items
Целое число
№
Задает максимальное количество элементов, которые можно выбрать в меню. Минимальное количество 1.
фильтр
Объект
№
Объект фильтра, сокращающий список доступных диалогов по заданным критериям.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню с множественным выбором в блоке раздела, показывающее список разговоров:
Это меню с множественным выбором заполнит его параметры списком общедоступных каналов, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда multi_channels_select .
заполнитель
Объект
Да
A обычный_текст единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальные_каналы
Строка[]
№
Массив из одного или нескольких идентификаторов любого допустимого общедоступного канала для предварительного выбора при загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательное диалоговое окно подтверждения, которое появляется перед отправкой вариантов множественного выбора.
max_selected_items
Целое число
№
Задает максимальное количество элементов, которые можно выбрать в меню. Минимальное количество 1.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню множественного выбора в блоке раздела, показывающее список каналов:
Это нечто среднее между кнопкой и меню выбора — когда пользователь нажимает эту кнопку дополнительного меню, ему будет представлен список опций для Выбери из. В отличие от меню выбора, здесь нет поля ввода, и кнопка всегда отображается с многоточием («…»), а не с настраиваемым текстом.
Таким образом, он обычно используется, если вам нужен более компактный макет, чем меню выбора, или для предоставления списка менее визуально важных действий после ряда кнопок. Вы также можете указать простые URL-ссылки в качестве параметров дополнительного меню вместо действий.
Чтобы использовать такие интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда переполнение .
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
опции
Объект[]
Да
Массив до пяти опций для отображения в меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
Ввод обычного текста, аналогичный HTML-тегу , создает поле, в которое пользователь может ввести произвольную форму данные. Он может отображаться как однострочное поле или большая текстовая область с использованием многострочного флага .
Чтобы использовать такие интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Элементы ввода в виде обычного текста поддерживаются на следующих поверхностях приложения: Вкладки «Главная» Сообщения Модальные окна
Чтобы использовать элементы ввода в виде обычного текста в модальных окнах, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите о подготовке вашего приложения для модальных окон.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда равен plain_text_input .
action_id
Строка
Да
Идентификатор для входного значения при отправке родительского модального окна. Вы можете использовать это, когда получаете полезную нагрузку view_submission , чтобы определить значение элемента ввода. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
заполнитель
Объект
№
A plain_text единственный текстовый объект, который определяет текст-заполнитель, отображаемый в текстовом вводе. Максимальная длина текста в этом поле составляет 150 символов.
начальное_значение
Строка
№
Начальное значение в обычном текстовом вводе при его загрузке.
многострочный
Логическое значение
№
Указывает, будет ли ввод одной строкой ( false ) или текстовой областью большего размера ( true ). По умолчанию false .
мин_длина
Целое число
№
Минимальная длина ввода, которую должен указать пользователь. Если пользователь предоставит меньше, он получит сообщение об ошибке. Максимальное значение 3000.
максимальная_длина
Целое число
№
Максимальная длина ввода, которую может предоставить пользователь. Если пользователь предоставит больше, он получит сообщение об ошибке.
dispatch_action_config
Объект
№
Объект конфигурации отправки, который определяет, когда во время ввода текста элемент возвращает полезную нагрузку block_actions .
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Блок ввода, содержащий элемент ввода в виде простого текста.
Группа радиокнопок, которая позволяет пользователю выбрать один элемент из списка возможных вариантов.
Переключатели поддерживаются на следующих поверхностях приложения: Вкладки «Главная» Модальные окна Сообщения
Чтобы использовать подобные интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Поля
Полевой
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда radio_buttons .
action_id
Строка
Да
Идентификатор действия, запускаемого при изменении группы переключателей. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
опции
Объект[]
Да
Массив объектов параметров. Допускается не более 10 вариантов.
начальная_опция
Объект
№
Объект опции, который точно соответствует одной из опций в пределах options . Этот параметр будет выбран при первоначальной загрузке группы переключателей.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после щелчка одного из переключателей в этом элементе.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию ложь .
Меню выбора, как и в случае со стандартным HTML-тегом , создает раскрывающееся меню со списком параметров, которые может выбрать пользователь. Меню выбора также включает функцию опережающего ввода, когда пользователь может ввести часть или всю строку параметров для фильтрации списка.
Чтобы использовать интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку вашего приложения. Прочтите наше руководство по включению интерактивности.
Существуют различные типы меню выбора, которые зависят от различных источников данных для их списков параметров:
Меню со статическими параметрами
Меню с внешним источником данных
Меню со списком пользователей
Меню со списком разговоров
Меню со списком каналов
Статические параметры
Работает с типами блоков: Раздел Действия Ввод
Это простейшая форма меню выбора со статическим списком параметров, передаваемых при определении элемента.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда static_select .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текст в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
опции
Объект[]
Да
Массив объектов параметров. Максимальное количество опций 100. Если указано option_groups , этого поля быть не должно.
группы_опций
Объект[]
№
Массив объектов группы параметров. Максимальное количество групп опций равно 100. Если указано опций , этого поля быть не должно.
начальная_опция
Объект
№
Единственная опция, которая точно соответствует одной из опций в пределах options или option_groups . Эта опция будет выбрана при первоначальной загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Это меню выбора загрузит свои параметры из внешнего источника данных, позволяя динамический список параметров.
Настройка
Если у вас не включен режим сокета, вам необходимо настроить приложение для использования этого типа меню:
Перейдите на страницу настроек вашего приложения и выберите Интерактивность и ярлыки на боковой панели.
Добавить URL в Опции Загрузить URL в меню выбора.
Сохранить изменения.
Каждый раз, когда открывается меню выбора этого типа или пользователь начинает вводить текст в поле ввода, мы отправляем запрос на указанный вами URL-адрес. Ваше приложение должно возвращать ответ HTTP 200 OK вместе с телом сообщения application/json с объектом, содержащим либо массив options , либо массив option_groups . Вот пример ответа:
Тип элемента. В этом случае тип всегда external_select .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текст в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальная_опция
Объект
№
Один параметр, который точно соответствует одному из параметров options или option_groups , загруженных из внешнего источника данных. Эта опция будет выбрана при первоначальной загрузке меню.
min_query_length
Целое число
№
При использовании поля typehead запрос будет отправляться при каждом изменении символа. Если вы предпочитаете меньшее количество запросов или более продуманные запросы, используйте min_query_length атрибут, чтобы сообщить Slack наименьшее количество введенных символов, необходимое перед отправкой. Значение по умолчанию: 3 .
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента установлен автофокус в пределах просмотреть объект . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню выбора в блоке раздела с внешним источником данных:
Это меню выбора заполнит свои параметры списком пользователей Slack, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В данном случае тип всегда users_select .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальный_пользователь
Строка
№
Идентификатор любого допустимого пользователя для предварительного выбора при загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню выбора в блоке раздела со списком пользователей:
Это меню выбора будет содержать его параметры со списком общедоступных и частных каналов, DM и MPIM, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда разговоры_выберите .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальный_разговор
Строка
№
Идентификатор любого допустимого разговора, который будет предварительно выбран при загрузке меню. Если 9Также предоставляется 0037 default_to_current_conversation , initial_conversation будет иметь приоритет.
default_to_current_conversation
Логическое значение
№
Предварительно заполняет меню выбора разговором, который пользователь просматривал при открытии модального окна, если оно доступно. По умолчанию false .
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
response_url_enabled
Логическое значение
№
Это поле работает только с меню в блоках ввода в модальных окнах.
Если установлено значение true , полезная нагрузка view_submission из родительского представления меню будет содержать response_url . Этот response_url можно использовать для ответов на сообщения. Целевой разговор для сообщения будет определяться значением этого меню выбора.
фильтр
Объект
№
Объект фильтра, сокращающий список доступных диалогов по заданным критериям.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню выбора в блоке раздела, показывающее список разговоров:
Это меню выбора заполнит свои параметры списком общедоступных каналов, видимых текущему пользователю в активной рабочей области.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В данном случае тип всегда channels_select .
заполнитель
Объект
Да
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в меню. Максимальная длина текста в этом поле составляет 150 символов.
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе пункта меню. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
начальный_канал
Строка
№
Идентификатор любого действительного общедоступного канала, который будет предварительно выбран при загрузке меню.
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора пункта меню.
response_url_enabled
Логическое значение
№
Это поле работает только с меню в блоках ввода в модальных окнах.
Если установлено значение true , полезная нагрузка view_submission из родительского представления меню будет содержать response_url . Этот response_url можно использовать для ответов на сообщения. Целевой канал для сообщения будет определяться значением этого меню выбора.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента задана автоматическая фокусировка в пределах объекта просмотра . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Меню выбора в блоке раздела, показывающее список каналов:
В клиентах для настольных ПК на этот раз средство выбора времени будет иметь форму раскрывающегося списка с вводом произвольного текста для точного выбора. В мобильных клиентах средство выбора времени будет использовать собственные пользовательские интерфейсы средства выбора времени.
Чтобы использовать такие интерактивные компоненты, вам потребуется внести некоторые изменения в подготовку приложения. Прочтите наше руководство по включению интерактивности.
Поля
Поле
Тип
Требуется?
Описание
тип
Строка
Да
Тип элемента. В этом случае тип всегда timepicker .
action_id
Строка
Да
Идентификатор действия, запускаемого при выборе времени. Вы можете использовать это, когда получаете полезные данные взаимодействия, чтобы определить источник действия. Должен быть уникальным среди всех остальных action_id s в содержащем блоке. Максимальная длина этого поля составляет 255 символов.
заполнитель
Объект
№
A plain_text единственный текстовый объект, определяющий текст-заполнитель, отображаемый в хронометре. Максимальная длина текста в этом поле составляет 150 символов.
начальное_время
Строка
№
Начальное время, которое выбирается при загрузке элемента. Это должно быть в формате HH:mm , где HH — 24-часовой формат часа (от 00 до 23), а mm — минуты с ведущими нулями (от 00 до 59), например, 22:25 для 22:25 .
подтвердить
Объект
№
Объект подтверждения, определяющий необязательный диалог подтверждения, который появляется после выбора времени.
focus_on_load
Логическое значение
№
Указывает, будет ли для элемента установлен автофокус в пределах объекта вида . Только одному элементу может быть присвоено значение true . По умолчанию false .
Пример
Блок раздела, содержащий элемент выбора времени, с начальным временем, установленным на 11:40:
Независимо от того, создаете ли вы опрос, форму регистрации или любой другой тип формы, вы можете включить 3 типа входных данных формы, которые позволяют вашему сайту посетители делают один или несколько вариантов выбора.
В этом уроке
Флажки — для вариантов ответа «да» или «нет» или нескольких вариантов
Радиокнопки — для вопросов типа «выбери один вариант»
Списки выбора — для выпадающих списков с одним или несколькими вариантами выбора
И бонусный раздел «Настройка флажков и переключателей».
Перед началом работы
Имейте в виду, что все входные данные формы могут быть размещены только внутри блока формы . Обязательно прочтите введение в Формы, чтобы узнать, как можно использовать эти другие входные данные формы.
Кроме того, ознакомьтесь со стилем форм, чтобы узнать больше о стилях других элементов формы.
Флажки
Флажки позволяют пользователю выбрать несколько вариантов.
Установите Name для каждого флажка, чтобы их можно было идентифицировать в данных отправки формы.
Флажки имеют стиль по умолчанию . Чтобы переопределить этот стиль по умолчанию , выберите параметр Custom в настройках флажка.
Вы также можете указать, должен ли флажок быть установлен по умолчанию, установив флажок Start Checked .
Если вы хотите, чтобы ваши пользователи ставили галочку, чтобы подтвердить, например, что предоставленная информация верна, вы можете проверить Обязательное поле в настройках флажка.
Обязательно установите имя флажка на панели настроек.
Радиокнопки
Радиокнопки позволяют пользователю выбрать один вариант из нескольких вариантов.
Вы можете установить Значение выбора для каждой опции для каждой кнопки, а также сгруппировать эти кнопки, присвоив им одно и то же Имя группы .
Радиокнопки имеют стиль по умолчанию . Чтобы переопределить это значение по умолчанию стиль , выберите опцию Custom в настройках радио.
Обязательно установите имя группы и значение выбора для каждой радиокнопки, чтобы получать точные формы.
Допустим, вы хотите создать группу переключателей для вопроса со значениями да и нет . Вы можете сгруппировать две кнопки, добавив к обеим одно и то же Имя группы : «Вам нравятся долгие прогулки по пляжу?» и установить Choice Value для одного из них значение «Да», а для другого — «Нет».
Теперь предположим, что вы хотите добавить еще одну группу параметров в качестве ответа на вопрос «Придете ли вы на следующую конференцию?» Значения будут: да, возможно и нет. Итак, вы добавляете три переключателя и убедитесь, что все три из них имеют одно и то же имя группы: «Посещающие». Затем вы устанавливаете значение каждого из них отдельно.
Списки выбора
Вы также можете добавить раскрывающийся список вариантов.
По умолчанию в этом раскрывающемся списке можно выбрать один вариант. Однако вы можете Разрешить множественный выбор а также путем включения параметра на панели настроек «Выбрать поле».
Назовите свое поле выбора и укажите, хотите ли вы разрешить множественный выбор или нет.
Вы можете установить варианты выбора для поля выбора в дополнительных настройках ввода на панели настроек справа.
Щелкните значок плюса (+), чтобы добавить вариант
Щелкните значок карандаша, чтобы изменить вариант
Щелкните значок корзины, чтобы удалить вариант
Щелкните и перетащите пунктирную линию, чтобы изменить положение варианта
Задайте параметры, которые должны выбирать пользователи, в поле «Выбор» вашей формы
Настройте флажки и переключатели формы
Чтобы переопределить стиль флажков или переключателей по умолчанию, включите параметр Пользовательский стиль в флажке или переключателе настройки кнопки. Затем перейдите на панель «Стиль» и настройте кнопки по своему усмотрению.
И если вы когда-нибудь захотите вернуться к стилю по умолчанию, вы можете сделать это, выбрав Default 9вариант 0036.
Если вы установили пользовательский стиль, затем повторно используйте то же имя класса в другой форме — убедитесь, что пользовательский параметр выбран снова.
Настройте состояние «отмечено», чтобы управлять тем, как выглядят флажки и переключатели, когда они выбраны. вы можете использовать для управления тем, как выглядят эти элементы, когда они выбраны.
Чтобы радиокнопки и флажки были доступны для людей, использующих клавиши со стрелками для навигации по формам, сфокусированное состояние обоих элементов имеет синюю тень по умолчанию.
Попробуйте Webflow — это бесплатно
Был ли этот урок полезен? Дайте нам знать!
Спасибо за отзыв! Это поможет нам улучшить наш контент.