4 заметки с тегом

js

JS: Одна всплывающая форма и разные заголовки

Каждый раз, создавая или оптимизируя сайты, всегда сталкиваюсь с задачами, которые можно и нужно оптимизировать, сокращать, минимизировать и так далее. Например, вы хотите сделать на лендинге 5 форм, у которых по сути отличается только заголовок. Неужели вы будете лепить все 5 форм? Не надо! Можно обойтись несколькими строчками кода.

  1. Дадим заголовку вашей формы идентификатор
<h2 id="windowHeader">Ваш заголовок формы</h2>
  1. Повесим на ваши кнопки названия заголовка каждой из них. Например, для обратного звонка — «Обратный звонок», для бесплатной консультации — «Бесплатная консультация»:
<a onClick="windowHeader('Бесплатная консультация');">Заказать бесплатную консультацию</a>
<a onClick="windowHeader('Обратный звонок');">Заказать звонок</a>
  1. Создадим JS функцию, которая при нажатии той или иной кнопки будет подменять нам название формы:
function windowHeader(name) {
          document.getElementById('windowHeader').innerHTML = name;
}
  1. Жамкаем по кнопкам, смотрим на форму.
6 мая   js

JivoSite: отключить звук появления окна

В JivoSite есть раздражающий звук, который реально заёбывает своим навязчивым пиканием. Покопавшись в настройках, я не нашёл никакого функционала, который бы позволил мне это отключить. Странно, что разработчики об этом не позаботились.

Что ж, будем решать через DOM:

Открываем существующий код JivoSite и добавим в него пару строчек:

<script type='text/javascript'>
(function() { var widget_id = 'YOUR_ID'; var d = document; var w = window;
    function l() { var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = '//code.jivosite.com/script/widget/' + widget_id; var ss = document.getElementsByTagName('script')[0];
        ss.parentNode.insertBefore(s, ss); } if (d.readyState == 'complete') { l(); } else { if (w.attachEvent) { w.attachEvent('onload', l); } else { w.addEventListener('load', l, false); } } })();

// Ниже код, который нужно добавить после вашего скрипта
function jivo_onLoadCallback() {
document.jivo_container.HTMLAudioElement.prototype.play = function () {};
}
</script>

После этого никакие звуки не будут раздражать вас и вашего пользователя.

17 апреля   jivosite   js

JS: Настройки Fancybox 3

Чтобы не писать каждый раз, запишу здесь:

$("[data-fancybox]").fancybox({
    loop: true,
    gutter: 30,
    buttons: [
        "zoom",
        "share",
        "slideShow",
        "fullScreen",
        "thumbs",
        "close"
    ],
    protect: true,
    transitionEffect: "circular",
    slideShow: {
        autoStart: true,
        speed: 5000
    },
    lang: "ru",
    i18n: {
        ru: {
            CLOSE: "Закрыть",
            NEXT: "Вперед",
            PREV: "Назад",
            ERROR: "Ошибка загрузки. <br/> Повторите запрос позднее.",
            PLAY_START: "Начать демонстрацию",
            PLAY_STOP: "Приостановить демонстрацию",
            FULL_SCREEN: "На полный экран",
            THUMBS: "Миниатюры",
            DOWNLOAD: "Скачать",
            SHARE: "Поделиться",
            ZOOM: "Увеличить"
        },
    }
};
16 апреля   fancybox   js

JS: Вешаем события GA через DOM для плагина Wordpress Contact Form 7

После опыта с LP Generator, нашёл такое же решение для самого популярного плагина Wordpress Contact Form 7. Согласно официальной документации плагина, начиная с версии 7.5.0 они убрали возможность установки событий onsubmit и onclick через интерфейс админки. И предлагают вешать его через скрипт. Пример:

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
    yaCounterXXXXXX.reachGoal('ORDER'); gtag('event', 'order', { 'event_category': 'ORDER', 'event_action': 'ORDER', });
}, false );
</script>

Зачем убрали — не понятно, но точно ясно, что усложнили жизнь новичкам.

4 апреля   js   wordpress