Как добавить логотип в навигационную панель перед пунктами меню в Twenty Thirteen?

Question

Как добавить логотип в навигационную панель перед пунктами меню в Twenty Thirteen?

16 дек. 2013 г., 18:40:11

Просмотры: 14.4K

Голосов: 0

Я настраиваю тему Twenty Thirteen и хочу добавить изображение логотипа в навигационную панель перед пунктами меню, как показано в этой ссылке.

Пробовал разные подходы, но ничего не сработало.

Буду признателен за любые предложения по этому вопросу.

Mohammad Mursaleen

764

тема-twenty-thirteen

Комментарии

покажи свой код... что ты уже пробовал.

Moaz Ateeq

16 дек. 2013 г. 18:42:28

Я пробовал .nav-menu ul:before чтобы отобразить изображение перед ul с пунктами меню, но это создавало проблемы

Mohammad Mursaleen

16 дек. 2013 г. 18:52:07

покажи свой код, приятель.

Moaz Ateeq

16 дек. 2013 г. 18:54:39

также пробовал выводить изображение в разных местах внутри header.php в <div id="navbar" class="navbar">

Mohammad Mursaleen

16 дек. 2013 г. 18:56:46

Рекомендую вносить изменения в дочернюю тему. Иначе изменения пропадут при следующем обновлении TwentyThirteen.

Mayeenul Islam

16 дек. 2013 г. 19:08:02

Все ответы на вопрос

Комментарии

Спасибо, Брэд. Уже сделал, но это может помочь кому-то еще в сообществе.

Mohammad Mursaleen

12 янв. 2014 г. 06:32:23

Ты что-то забыл?

Brad Dalton

3 мая 2014 г. 23:39:59

Я считаю, что:

.nav-logo {
float: left;
margin-right: 20px;
}

должно быть:

.nav-image {
float: left;
margin-right: 20px;
}

Именно это сработало у меня.

Tornrise

1

26 дек. 2015 г. 16:37:36

Brad Dalton 6.97K · Accepted Answer · 2013-12-31T17:11:29Z

Проверено на дочерних темах Twenty Thirteen и Twenty Twelve.

Логотип в меню

Попробуйте добавить этот код в файл functions.php вашей дочерней темы.

Изображение можно добавить различными способами.

add_filter( 'wp_nav_menu_items', 'wpsites_add_logo_nav_menu', 10, 2 );

function wpsites_add_logo_nav_menu( $menu, stdClass $args ){

if ( 'primary' != $args->theme_location )
    return $menu;


$menu .= '<nav class="nav-image"><img src="' . get_stylesheet_directory_uri() . '/images/header.png" /></nav>';

return $menu;

}

Пример CSS для вашего файла style.css дочерней темы:

.nav-logo {
float: left;
margin-right: 20px;
}

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

Вот результат на Twenty Twelve:

Логотип в меню Twenty Twelve