Как добавить блок бесплатной доставки в WooCommerce

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

Добавление блока бесплатной доставки в WooCommmerce

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

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

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

Создание учетной записи OptinMonster и подключение WordPress

Сначала перейдите на официальный сайт OptinMonster и создайте учетную запись. Затем установите и активируйте бесплатный плагин OptinMonster для WordPress.

Этот плагин соединяет сервис OptinMonster с вашим WordPress-сайтом. После его активации перейдите в меню OptinMonster в панели инструментов WordPress. Затем нажмите на кнопку Connect Your Account и подключитесь к своей учетной записи OptinMonster.

Создание блока бесплатной доставки для WooCommerce

Сначала перейдите на страницу OptinMonster в панели инструментов WordPress, а затем нажмите на кнопку Create New Campaign.

После этого в качестве типа кампании выберите вариант Floating Bar.

Далее прокрутите страницу вниз и выберите шаблон кампании. В данном случае мы исползаем шаблон Alert. Наведите на него курсор мыши и нажмите кнопку Use Template.

Плагин OptinMonster предложит название создаваемой кампании. Но вы можете использовать собственный вариант.

Затем выберите, на каких сайтах необходимо запустить кампанию и нажмите кнопку Start Building. После этого вы увидите пользовательский интерфейс конструктора OptinMonster.

По умолчанию плавающая панель будет прикреплена к нижней части экрана. Чтобы она располагалась вверху экрана, перейдите в раздел Floating Settings. Затем активируйте вариант Load Floating Bar at Top of Page.

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

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

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

Чтобы направить клиентов на страницу с информацией о бесплатной доставке, перейдите на вкладку Action. Затем введите URL-адрес перенаправления.

Чтобы изменить цвет панели бесплатной доставки, нажмите кнопку Home.

Затем перейдите к настройкам Optin Settings> Optin View Styles.

После этого кликните по полю Background Color и введите шестнадцатеричный код цвета.

Нажмите кнопку Save, расположенную в правом верхнем углу.

Далее нужно задать правила отображения панель бесплатной доставки на вашем сайте. Для этого перейдите на вкладку Display Rules.

По умолчанию OptinMonster выводит плавающую панель после 5 секунд пребывания пользователя на любой странице WordPress-сайта. Чтобы этот блок загружался сразу, удалите стандартное правило. Для этого нажмите на значок «минус», расположенный с правой стороны:

Теперь у вас должно остаться правило Current URL path is any page.

Чтобы запустить созданную кампанию, перейдите на вкладку Publish, расположенную в верхней части экрана.

Чтобы разместить панель бесплатной доставки на своем WordPress-сайте, перейдите на страницу OptinMonster> Campaigns в панели инструментов WordPress. Затем нажмите кнопку Refresh Campaigns, чтобы увидеть список доступных кампаний.