Всем привет.
Я добавил код в соответствующие поля, но это не сработало. Где я ошибаюсь?
Я также попробовал плагин, но он ломает область строки поиска.
Хм, да, я подозреваю, что вам, вероятно, придется проделать дополнительную работу с CSS, чтобы заголовок корректно работал со ссылками.
Вопрос: вы также разрабатываете версию для мобильных устройств? Потому что в заголовке на мобильных устройствах гораздо меньше места для добавления элементов. Не стоит создавать отличный сайт для десктопа, только чтобы обнаружить, что мобильная версия выглядит запутанной.
Я не помню точно, но, возможно, там также есть плагин-выход, который можно использовать. 
Привет, Лилли.
Я хочу сделать это только для десктопной версии.
Мобильный вид сейчас в порядке, я не хочу сужать область заголовка там.
Кстати, если это не получится, ничего страшного. Эта кнопка будет перенаправлять в категорию форума.
Мне просто хотелось, чтобы эта кнопка создавала приятную атмосферу.
Вы имеете в виду иконку в этой области, например?
Можете подробнее объяснить, что именно вы ищете?
Плагин-аутлет в этой области — before-header-panel.
Его используют компоненты Custom Header Links и Header Search.
Рекомендуем использовать Custom Header Links!
Как отметила Лилли, вам потребуется внести правки в CSS.
Судя по всему, компонент Header Links применяет некоторые стили CSS к контейнеру аутлета, что, возможно, и вызывает сбой поиска.
Не могли бы вы, если не трудно, снова включить компонент, чтобы я мог напрямую посмотреть на ваш форум?
Здесь это объясняется, но когда я ввожу необходимый код, он не работает.
Я уже включил, можете посмотреть, спасибо за помощь 
Когда я использую этот код, для анонимного пользователя всё выглядит нормально. Но для авторизованного пользователя это не так. Причина в том, что я использовал этот код для центрирования строки поиска.
Я вошёл в систему, и всё отображается как положено. Поиск виден по центру. Смотрите мой скриншот.
Да, он вручную добавил margin-right: -35px;, чтобы компенсировать панель заголовков, и теперь, с добавлением ссылки, значение нужно скорректировать ещё раз.
Причина, по которой я это делаю, заключается в том, что строка поиска не сдвигается влево или вправо для авторизованного пользователя. Строка поиска остаётся на одном и том же месте как до, так и после входа в систему.
Похоже, это также влияет на плагин Custom Header Links. Думаю, пока я не буду добавлять туда кнопку. Если мы сможем добавить её с помощью CSS и HTML, я бы хотел попробовать.
Спасибо, что уделили время. 
Вы также можете вынести строку поиска из потока с помощью абсолютного позиционирования.
Вам больше не понадобится свойство margin.
.floating-search-input-wrapper {
position: absolute;
left: 0;
top: calc((4em - 2.6rem - 2px - 2px) / 2); /* высота заголовка - высота поиска - отступ - граница */
width: 100%;
}
Возможно, вам потребуется добавить медиа-запрос для управления шириной на экранах с низким разрешением и убедиться, что элемент не накладывается на другие элементы.
Это здорово, большое спасибо, я проверю.
Но когда я включаю «Custom Header Links», заголовок выглядит некорректно.
Это не большая проблема. Я просто хотел добавить что-то визуальное в секцию заголовка.
Привет, @Arkshine, я только что заметил. После этого кода логотип перестал быть кликабельным.
Думаю, это связано с кодом position: absolute;.
Вы можете добавить этот CSS, чтобы логотип располагался над полем поиска.
.home-logo-wrapper-outlet {
z-index: 1;
}
У вас есть ещё одно решение с использованием CSS для floating-search-input, чтобы не возиться с боковыми отступами (обязательно удалите стили для floating-search-input-wrapper):
.floating-search-input {
position: absolute;
left: 0;
transform: translateX(calc(50vw - (33rem / 2)));
}
Огромное спасибо, Arkshine