Как сделать всплывающее окно в битрикс24
Обновлено: 12.05.2024
Скорее всего вы столкнулись с проблемой, что обычным способом не получается вызвать popup-форму при нажатии на кнопку в стандартном блоке Битрикс24.
У нас была задача на главной странице сделать кнопку, при нажатии которой всплывала наша форма. Чтобы вас не грузить работой с кодом, мы решили написать инструкцию и выложили необходимый код для вас.
Первым делом создайте CRM-форму, скопируйте код для «Клика по кнопке или ссылке» и вставьте в любой текстовый редактор
К данному коду вставьте ниже вот этот скрипт:
Теперь важна ваша внимательность:
Все пункты указаны на скрине выше:
b24-web-form-popup-btn-7 – значение берется из пункта 4 на скрине (это class кнопки предложен из CRM-формы, при создание новой формы он меняется)
В нашем случае, если вставите код на сайт и опубликуете, но на сайте появится кнопка «Мы перезвоним вам», для того чтобы её убрать нужно вставить в button код style="display:none"
Последним этапом требуется скопировать полностью весь код, вставить в блок html на сайте и опубликовать. Если вы сделали все правильно, то теперь при нажатии на кнопку у вас будет всплывать нужная вам форма.
Наше digital-агентство Webstripe профессионально занимается разработкой сайтов любой сложности. Если у вас возникли трудности на каком-либо этапе или вам просто нужна консультация специалиста, то напишите нам в чат. Мы обязательно поможем вам и дадим все необходимые рекомендации.
Просмотр уведомлений
Для просмотра истории нотификаций необходимо кликнуть на кнопку панели уведомлений либо в окне чата на кнопку Уведомления. Сверху списка находятся последние уведомления:
По умолчанию в настройках чата включена опция Автоматическое прочтение уведомлений – прочтенными становятся только те уведомления, которые видны на экране. Таким образом, вы не пропустите ни одного уведомления!
Если уведомлений много и вам нужно прочитать их все сразу (сбросить счетчик уведомлений), то для этого есть дополнительная кнопка Прочитать все:
Также вы можете изменить статус Прочитано вручную – дважды кликните по уведомлению, и оно снова станет непрочтенным, и наоборот.
Фильтрация уведомлений
В центре уведомлений вы можете фильтровать и искать уведомления – по типу, по тексту и по дате. Для этого нажмите на специальную кнопку Открыть фильтр:
Временное отключение уведомлений
Вы можете временно отключить всплывающие уведомления – поставьте статус Не беспокоить в мессенджере. Все уведомления при этом будут заглушены, прочитать их можно во вкладке Уведомления.
Не беспокоить и Фокусировка внимания
В приложении Битрикс24 есть поддержка режимов Не беспокоить для macOS и Фокусировка внимания для Windows – при включении этих режимов будут заблокированы все уведомления Битрикс24, как будто вы включили ручной статус в чате Не беспокоить. Если в чате явно упомянуть сотрудника, то такое уведомление будет показано.
Для поддержки режимов Не беспокоить для macOS и Фокусировка внимания для Windows необходимо приложение Битрикс24 версии 12 и выше.
Настройка уведомлений
Управлять уведомлениями можно в меню Настройка уведомлений своего профиля или в настройках мессенджера в соответствующей вкладке.
Доступны 2 режима настроек – простой и расширенный. В простом режиме выбирается только канал, куда будут отправляться уведомления – сайт, мобильное или десктоп-приложение, почта, push. Расширенный режим позволяет делать настройки каждого типа уведомлений для конкретных инструментов, а также канал их получения.
Обратите внимание, уведомления на электронную почту по умолчанию отключены в облачных Битрикс24, но вы можете всегда включить их, если вам они необходимы. Отключенные уведомления не сохраняются в истории.
Для тех кто хочет узнать как работают всплывающие окна на основе стандартной битриксовой библиотеки.
Сия библиотека полезна, когда лень подключать сторонние плагины и нужно быстро сваять окошко, не заморачиваясь с кастомизацией дизайна.
Что-то типа такого:
Начинается все с подключения самой библиотеки:
Пройдемся по параметрам:
my_answer - строка - уникальный id DOM-элемента, в который будет обернуто окно. Ежли на странице будет 2 и больше окон такого плана, то у каждого должен быть свой id.
closeIcon: - показывает нужна ли вам иконка закрытия окна и ее положение в окне.
titleBar: Это заголовок окна’, 'props': >)> - собссно это создание заголовка окна. BX .create - функция создания DOM-элемента. В данном случае создание . Если хотите чтоб ваше окно можно было перетаскивать по странице, то класс лучше не менять.
zIndex: 0,
offsetLeft: 0,
offsetTop: 0,
draggable: - эти параметры указывают, что окно можно передвигать по странице.
buttons - кнопки для управления содержимым окна. На каждую кнопку создаем новый объект new BX .PopupWindowButton с параметрами:
text - ‘название кнопки’
className - класс на кнопке, из стандартных возможны варианты: popup-window-button-accept - зеленая кнопка как на скрине, popup-window-button-cancel - белая кнопка, popup-window-button-link-cancel - просто ссылка. Само-собой можно приклеить свой стиль.
events: this.popupWindow .close();
>>
Это параметр, отвечающий за действие, произошедшее при нажатии кнопки. В данном случае this.popupWindow .close(); - говорит о закрытии окна. Но тут возможны различные варианты в зависимости от фантазии и задач. На пример, если в окне форма, можно сделать ajax-отправку контента через
Здесь BX ("myForm" - id-формы, data - данные, BX ( 'ajax-add-answer').innerHTML = data; - вставка ответа сервера в окно.
Либо можно сделать что-то свое в зависимости от нужд. Эта библиотека отлично работает в сочетании с jQuery, поэтому тут можно свободно использовать ее функции.
Далее приведу пример открытия окна по ссылке, загрузку в него ajax-конетнта и отправку формы.
CRM-формы представляют собой классическую форму обратной связи, которую легко разместить на сайте. Такую форму вы можете создать в вашем Битрикс24, и она будет сразу интегрирована с CRM-системой.
После отправки данных с такой формы они попадают в CRM, и менеджер может сразу же перейти к работе с потенциальным клиентом.
Как сделать CRM-форму в Битрикс24.
Для создания и работы с формами перейдите на вкладку CRM – CRM-формы в вашем Битрикс24.
На этой странице вы увидите все созданные вами формы. По умолчанию, там уже настроены три классические формы, которые вы не сможете удалить или отредактировать.
Для каждой из ваших CRM-форм представлена информация о конверсии, дате создания и количестве элементов.
Для того, чтобы создать новую форму, выберите пункт «Создать форму»:
В редакторе создавайте вашу CRM-форму и размещайте ее на сайте.
Как разместить CRM-форму Битрикс24 на сайте
Какие виды форм бывают
Если у вас возникают трудности с установкой CRM-форм или вам нужна дополнительная настройка – пишите нам. Консультация бесплатна!
Индивидуальная настройка уведомлений
Корпоративный портал предполагает обширную настройку уведомлений в Битрикс24. Детально разберем каждый инструмент.
Уведомления в задачах
Настроить напоминания можно как себе, так и ответственному исполнителю или постановщику задачи.
Чтобы не отвлекаться на второстепенные задачи можно включить режим «Без звука».
При отключении звука напоминание о задаче сработает в фоновом режиме. Отключить звуковое оповещение можно для каждой задачи по отдельности.
Настройка живой ленты
Работа живой ленты может быть настроена индивидуально под каждого работника компании. Для этого работает:
Помимо интерактивных настроек каждую запись можно добавить в избранное или скрыть из личной ленты.
Для добавления нетривиальных опций или расширения функциональности живой ленты может потребоваться настройка Битрикс24. Специалисты Первый БИТ реализуют задачу любой сложности, включая добавление новых модулей.
При работе с desktop-приложения отключить показ оповещений из Битрикс24 можно активировал статус «Не беспокоить».
Оповещения по почте, на сайте и Push-уведомления
Отключить уведомления, которые не связаны с облачной версией Битрикс24 можно через Центр настроек. Для этого необходимо нажать на аккаунт пользователя и выбрать в меню пункт «Настройка уведомлений».
Для быстрой настройки требуется галочками отметить параметры получения уведомлений, для более точной — перейти в расширенный режим.
Через расширенный режим можно настроить все оповещения из приложений Битрикс24, на сайте или Push-уведомления. Пользователю остается только отметить галочкой тип уведомления и его способ получения, после чего сохранить выбранные параметры.
Система позволяет настроить отправку уведомлений на любую версию продукта по следующим категориям:
Если у вас возникли трудности с настройкой корпоративного портала, оставьте заявку в форме ниже или позвоните по телефону в шапке сайта. Мы проводим обучение работе в Битрикс24 — расскажем обо всех возможностях корпоративного портала и научим использовать его функции на практике, а если у вас еще нет портала – поможем внедрить.
Читайте также: