Блог

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

Чтобы избежать исчезновения содержимого за заголовком, я добавил пустой div в верхней части шаблона страницы, называемый header-push, затем в моем header.php , я добавил следующую функцию, которую я запускаю при загрузке страницы. Он проверяет высоту заголовка в пикселях и устанавливает мой заголовок-push div на ту же высоту. Возможно, не самое элегантное решение, но оно простое и оно работает!

 function headerPad(){
     var headerHeight = document.getElementById('masthead').clientHeight;
     jQuery('.header-push').height(headerHeight);
}
 

По крайней мере, это работает на большинстве страниц, пока мы не перейдем к woocommerce. Я бы хотел, чтобы любые уведомления woocommerce отображались в самом верху страницы, под заголовком. Чтобы это сработало, я добавил следующие строки в функцию заголовка.

 jQuery('.woocommerce-notices-wrapper').css('margin-top', headerHeight );
jQuery('.woocommerce-NoticeGroup').css('margin-top', headerHeight );
 

Первая строка работает для общих уведомлений, таких как «Вы добавили X в свою корзину» и т. Д. Ошибки (например, если вы пытаетесь отправить заказ, не заполнив обязательное поле) ведут себя по-разному. Вместо того, чтобы находиться внутри woocommerce-notices-wrapper, эти ошибки отображаются как ul внутри woocommerce-NoticeGroup div. Для этого и предназначена вторая строка, но она не работает.

Глядя на настройки страницы по умолчанию, woocommerce-notices-wrapper всегда существует как пустой div на странице, который загружается при загрузке страницы. woocommerce-NoticeGroup этого не делает. Я добавил пустой раздел woocommerce-NoticeGroup в свой шаблон страницы woocommerce, и он загружается с правильным позиционированием при загрузке страницы, но затем, если я создаю ошибку, на страницу добавляется второй раздел woocommerce-NoticeGroup, который не наследует правильное позиционирование.

В результате все ошибки исчезают за заголовком. Как я могу добиться того, чтобы высота заголовка всегда применялась в верхней части ошибок?