Добавить свой пункт в меню Геткурса? Легко!

GetCourse

Если вам не хватает стандартных пунктов меню на Геткурсе, то можно добавить свои.

Сегодня разберем как добавить новый пункт в Обучение.

Добавить новый пункт можно либо до, либо после имеющихся пунктов.

На скриншоте добавлены пункты Мы в ВК и Мы в FB

Для добавления нового пункта нужно добавить скрипт в Настройки аккаунта — Счетчики и прочие скрипты.

Код скрипта под спойлером:

Код скрипта
<script>
  (function () {
    let data = [
      {
        class: 'menu-item-vk',
        link: 'https://vk.com/',
        title: 'Мы в ВК',
        place: 'afterbegin',
      },

      {
        class: 'menu-item-yandex',
        link: 'https://yandex.ru/',
        title: 'Мы в FB',
        place: 'beforeend',
      },
    ];

   let menuItem = 'profile';

    const tmp = function (data) {
      return (`
        <li class="${data.class}">
          <a class="subitem-link" target="_self" href="${data.link}">${data.title}</a>
        </li>
        `)
    };

    const render = function (container, tmp, place) {
      container.insertAdjacentHTML(place, tmp);
    };

    document.addEventListener('click', function (evt) {
      setTimeout(function () {
        let submenu = document.querySelector('.gc-account-user-submenu-bar-' + menuItem);
        let userSumenu = document.querySelector('.gc-account-user-submenu-bar-' + menuItem + ' .gc-account-user-submenu');

        if (userSumenu && submenu.style.display !== 'none') {
          for (let i = 0; i < data.length; i++) {
            let item = document.querySelector('.' + data[i].class)

            if (Boolean(item) === false) {
              render(userSumenu, tmp(data[i]), data[i].place);
            }
          }
        }
      }, 1);
    });
  })();
</script>

Теперь разберем важные пункты в скрипте.

1. class — класс элемента (нужен для обработки скриптом), также по нему можно будет стилизовать CSS-ом пункт меню.

2. link — ссылка, куда будет вести пункт меню

3. title — текст внутри ссылки, заголовок 

4. place — место, куда добавить элемент. Возможные значения:
afterbegin — в самое начало
beforeend — в самый конец

5. menuItem — в каком пункте меню появится новый пункт-ссылка. Возможные значения:
profile — Профиль
cms — Сайт
teach — Обучение
user — Пользователи
tasks — Задачи
notifications — Сообщения
sales — Продажи
chatium — Chatium

Для добавления новой ссылки, копируем

{
class: ‘menu-item-yandex’,
link: ‘https://yandex.ru/’,
title: ‘Yandex’,
place: ‘beforeend’,
},

меняем параметры и вставляем (запятую не терять!)

На скриншоте ниже показано куда именно вставляем код выше.

Вот и все!

Пробуйте, тестируйте! Не забывайте писать комментарии, предложения, а также присоединяться к нашим сообществам!

Оцените статью