Как поставить два элемента в виджете рядом друг с другом

Рассмотрим по шагам, как сделать виджет с двумя кнопками, которые расположены рядом друг с другом. В качестве примера, создадим элементы с характеристиками «Женщина» и «Мужчина». Виджет автоматически запомнит, на какую кнопку нажал посетитель и запишет в Convead выбранный пол.

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

Создаем такой виджет:

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

Для первой кнопки, она будет находиться справа, в поле CSS прописываем код:
position:relative; z-index:1;
float: right;margin-right

Для второй кнопки, она будет находиться слева, в поле CSS прописываем код:
position:relative; z-index:2;
float: left;margin-left

Двигать блок на необходимое место в виджете можно с помощью внешних отступов.

Передача выбранной опции в Convead

Теперь необходимо передать в Convead, что при нажатии на синюю кнопку нужно запоминать, что посетитель – мужчина, а при нажатии на голубую – женщина.

Выбираем по очереди каждую из кнопок, в правом сайдбаре находим пункт «Действие при нажатии», выбираем «Выполнить JavaScript». В поле ниже вставляем код:
convead(‘event’, ‘update_info’, {}, {gender: «female»});
Для женщин значение в кавычках – female, для мужчин – male.

Теперь как только посетитель нажмет на одну из кнопок «Женщина» или «Мужчина», Convead автоматически запишет значение male или female в стандартное поле gender (пол). По этому полю в Convead можно сегментировать посетителей, чтобы более адресно с ними работать.

Нажатие на любую из кнопок считается «отправкой» виджета. Вы можете далее настроить отправку рассылки в соответствии с выбранной опцией. Причем дамам можно отправлять одно, а джентльменам – другое.