Добавляем тур по сайту

Вот пример:

Скрытый текст

1. Идем в globalTemplate

2. В <head></head> секции добавляем строку:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intro.js/2.9.3/introjs.css" integrity="sha256-OYXGS5m4oWZAAqoAKpf7Y3bIdzdd9jBfly/xCavEpGw=" crossorigin="anonymous"/>

3. Теперь в globalTemplate ищем

<!--ipsQueryLog-->

и добавляем выше:

<script src="https://cdnjs.cloudflare.com/ajax/libs/intro.js/2.9.3/intro.min.js" integrity="sha256-fOPHmaamqkHPv4QYGxkiSKm7O/3GAJ4554pQXYleoLo=" crossorigin="anonymous"></script>
<script type="text/javascript">
	function startIntro(){
        var intro = introJs();
        intro.setOptions({
            steps: [
              { 
                intro: "Step 1 text"
              },
              {
                element: document.querySelector('#elNavSecondary_71'),
                intro: "Step 2 text."
              },
              {
                element: document.querySelectorAll('#elNavSecondary_63')[0],
                intro: "Step 3 text",
                position: 'right'
              },
              {
                element: '#elNavSecondary_56',
                intro: 'Step 4 text',
                position: 'left'
              },
              {
                element: '#step4',
                intro: "Step 5 text",
                position: 'bottom'
              },
              {
                element: '#step5',
                intro: 'Step 6 text'
              }
            ]
          });
        intro.start();
      }
</script>

Чтобы выбрать свои собственные элементы на вашем форуме, просто измените id элементов в элементе: '#elementid'

Для запуска функции вы можете использовать кнопку:

Цитата

<a class="ipsButton ipsButton_normal ipsButton_medium" href="javascript:void(0);" onclick="startIntro();" rel="">Start a tour</a>

Вы можете найти полную документацию IntroJS ТУТ

Было ли это полезно?

От Sipsb

24 августа 2020

Отзывы пользователей

0 комментариев

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Добавляем тур по сайту

Отзывы пользователей

Рекомендованные комментарии

Создайте аккаунт или войдите в него для комментирования

Создать аккаунт

Войти

Сообщество

Файлы

Новости

Документация