Переместить существующие пункты меню-бургера

Внести вклад UX
1

Возможно ли удалить или переместить уже существующие элементы в меню-гамбургере? Например, переместить «О проекте» или «Часто задаваемые вопросы» наверх, убрать «Горячие клавиши» и т. д.

1 лайк
2

Перестановка меню, скорее всего, не предусмотрена, но удаление элементов из любого раздела интерфейса обычно можно выполнить с помощью правил CSS в разделе «Администрирование» → «Настроить».

3 лайка
3

С помощью CSS можно сделать что-то вроде…

.hamburger-panel .panel-body-contents {
  display: flex; /* Настройка flex-раскладки для изменения порядка элементов */
  flex-direction: column;
  .menu-container-footer-links {
    order: -1;  /* перемещает ссылки в подвале в начало */
    .keyboard-shortcuts-link {
     display: none !important; /* Скрывает ссылку на горячие клавиши */
    }
  }
}

Возможно, потребуется скорректировать некоторые другие параметры (границы, отступы), но, думаю, это решение решит 90% задачи.

8 лайков
Custom Hamburger Menu Links
Custom sidebar sections being tested on meta
4

Ты просто спаситель, Крис, огромное спасибо!! Так, аналогично, я мог бы использовать что-то вроде:

.hamburger-panel .panel-body-contents {
  display: flex; /* Настраиваем flex-раскладку, чтобы можно было менять порядок элементов */
  flex-direction: column;
  .menu-container-footer-links {
    order: -1;  /* перемещает ссылки в футере наверх */
    .about-link {
    }
  }
}

если бы я хотел переместить «О нас» или «FAQ» в общие ссылки, а не в футер?

5

Нет, CSS может лишь перемещать целые секции — вы не сможете переместить ссылки в другие разделы (думаю, именно это вы и имеете в виду).

3 лайка
6

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

1 лайк
7

Ах, понял! Спасибо за уточнение. Вы правы — моя конечная цель заключалась в перемещении разделов About и FAQ из footer в general, хотя, судя по вашему первоначальному примеру CSS, я могу удалить оба раздела, а затем использовать что-то вроде этого:

чтобы создать ссылки About и FAQ в разделе general. Немного кустарно, но вроде как осуществимо.

3 лайка
8

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

4 лайка
9

@awesomerobot, спасибо за помощь. Можно добавить к этому вопрос: как мог бы выглядеть код, чтобы просто скрыть некоторые элементы в верхнем гамбургер-меню?

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

Спасибо

3 лайка
10

Если вы щёлкните правой кнопкой мыши по одной из ссылок и выберете «Просмотреть код» (Inspect), вы увидите имена классов, связанные с каждой из них… Например, ссылка «Последние» получает класс latest-topics-link

58%20PM
58%20PM818×328 28.9 KB

Чтобы скрыть её с помощью CSS, выполните следующее:

.menu-panel li a.widget-link.latest-topics-link {
  display: none;
}
6 лайков
11

Ах да, я всегда забываю про функцию инспекции.

Отлично, спасибо!

2 лайка
12

Есть ли какие-либо советы по настройке меню-бургера теперь, когда оно интегрировано в боковую панель?

Можно ли переместить элементы из раскрывающегося списка Ещё, чтобы они отображались на верхнем уровне?

А как насчёт скрытия элементов? Я пробовал это сделать, но без успеха:

.d-sidebar .sidebar-sections .sidebar-section-link li a.sidebar-section-link-faq{
  display: none;
}

Редактирование: OK, это сработало для скрытия ссылки «О нас»:

.sidebar-wrapper li a.sidebar-section-link-about {
    display: none;
}

Огромное спасибо!

1 лайк