В этом видео я расскажу как для поля Телефон на странице Оформления заказа WooCommerce сделать Маску ввода телефона.

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

Советы в этом видео подойдут для Интернет-магазина, который работает под управлением WordPress и на плагине WooCommerce.

Скриншот

Маска ввода телефона на странице оформления заказа WooCommerce

Алгоритм действий

  • Скачиваем скрипт jquery.maskedinput.js и загружаем его на сайт (через FTP или с помощью файлового менеджера).
  • Подключаем скрипт на сайте с помощью специальной функции.
  • Наслаждаемся результатом 😉

Смотреть видео

Маска ввода телефона на странице оформления заказа WooCommerce
Смотреть это видео на YouTube.
Подпишитесь на канал InwebPress, чтобы узнать больше о создании и настройке сайтов!

Полезные ссылки

1.Скачать скрипт jquery.maskedinput.js

В скачанном архиве он находится в папке: /jquery.maskedinput-master/dist/

2.Страница плагина Code Snippets

3.Функция подключения скрипта:

// Маска ввода телефона на странице оформления
add_action('wp_enqueue_scripts', 'my_maskedinput');
function my_maskedinput() {
    if (is_checkout()) {
        wp_enqueue_script('maskedinput', '/wp-content/themes/woodmart-child/js/jquery.maskedinput.js', array('jquery'));
        add_action( 'wp_footer', 'masked_script', 999);
    }
}
 function masked_script() {
    if ( wp_script_is( 'jquery', 'done' ) ) {
?>
    <script type="text/javascript">
        jQuery( function( $ ) {
            $("#billing_phone").mask("+7(999)999-99-99");
        });
    </script>
<?php
    }
}

Обратите внимание на путь в коде: /wp-content/themes/woodmart-child/js/jquery.maskedinput.js

У вас он может быть другим.

Примечание:

Если в вашем магазине покупатели будут указывать различные коды стран, то лучше в маске телефона указывать так: +9(999)999-99-99

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

Для Украины можно указать так: +38(999)999-99-99

 

Занимаешься созданием сайтов? Не пропусти важные новости!

Подпишись на Youtube-канал

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

Подпишись на Telegram-канал

Получай новости на свой телефон - это удобно и быстро!
Новости из мира WordPress, полезные видео о создании сайтов, интересные статьи о разработке и безопасности.



Похожие записи

Подписаться
Уведомить о
guest
12 комментариев
Старые
Новые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии