Как поменять фон меню в подвале темы Hueman.

- cluv1 · 09.05.2019

Решил написать для себя напоминалку по тем или иным работам с темой hueman, забывается со временем, приходится снова заниматься поисками в интернет, а это долго. Может кому тоже пригодиться.

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

Решил поискать в интернете, как можно исправить данное неудобство. Потратил некоторое время и понял, что ничего не найти, а если есть, то… Вот тут и всплыла ещё одно проблема, из-за которой пишу данную статью. Оказалось, что тема hueman несколько отличается от большинства тем.

Например, при создании формы контактов (напишу отдельно) рекомендуют скопировать файл page.php и внести необходимые изменения, в hueman никаких изменений в данный файл не внести, там всего четыре строчки. Так же, как и в style.css там просто сплошной текст.

Вернемся к изменению фона. Открываем для редактирования файл main.min.css, (скопируйте его сначала, чтобы исправить всё, вполне возможно что-то пойдет не так, если не знаете как, просто выделите код (ctrl+A) и перенесите в блокнот) вот путь в управлении хостинга:

/wp-content/themes/hueman/assets/front/css/main.min.css.

В редакторе wordpress:
внешний вид - редактор тем – assets – front – css - main.min.css.

Находим такую строчку:

{background:#fff;border-top:1px solid #eee}

Для этого нажимаем ctrl + F и в форму поиска забиваем {background:#fff;border-top:1px solid #eee}, данная строчка высветится отдельным цветом. Нам надо заменить #fff – это белый цвет. Чтобы меню сливалось с фоном подвала, заходите в консоль wordpress:

Внешний вид – настроить – дизайн подвала – параметры подвала

Находим цвет фона для подвала, нажимаем, появляется цветовая таблица, где вверху обозначение цвета на данный момент, у меня это: #03a88f. Заменяем в строке {background:#fff;border-top:1px solid #eee} белый цвет #fff на #03a88f (у Вас он другой). Таким образом, перебирая палитру цветов можете сделать меню любого удобного для Вас цвета.Цвет фона поменяли, но осталась маленькая белая полоска сверху, убираем её заменой в той же строке 1px на 0px. Вот так выглядит окончательная строчка: