0

Всем доброго времени суток.Сайта на Wp. Нужно "растянуть" меню на всю ширину экрана и опустить вниз.Сверху в левом углу название магазина( "Магазин часов" ) Слева номер телефона,как в css,это написать,заранее благодарю. Сам код шапки из файла header.php

   <hgroup>

         <?php
            $logo = esc_url( get_template_directory_uri() . '/images/logo.png' );
            if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' ) { $logo = $woo_options['woo_logo']; }
            if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' && is_ssl() ) { $logo = preg_replace("/^http:/", "https:", $woo_options['woo_logo']); }
        ?>
        <?php if ( ! isset( $woo_options['woo_texttitle'] ) || $woo_options['woo_texttitle'] != 'true' ) { ?>
            <a id="logo" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php esc_attr( get_bloginfo( 'description' ) ); ?>">
                <img src="<?php echo $logo; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" />
            </a>
        <?php } ?>

        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>

        <h4 >+7(968)394-13-74<br>круглосуточно</h4>

        <h3 class="nav-toggle"><a href="#navigation">&#9776; <span><?php _e('Navigation', 'woothemes'); ?></span></a></h3>

    </hgroup>

    <?php woo_nav_before(); ?>

    <nav id="navigation" class="col-full" role="navigation">

        <?php
        if ( function_exists( 'has_nav_menu' ) && has_nav_menu( 'primary-menu' ) ) {
            wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'menu_id' => 'main-nav', 'menu_class' => 'nav fr', 'theme_location' => 'primary-menu' ) );
        } else {
        ?>
        <ul id="main-nav" class="nav fl">
            <?php if ( is_page() ) $highlight = 'page_item'; else $highlight = 'page_item current_page_item'; ?>
            <li class="<?php echo $highlight; ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php _e( 'Home', 'woothemes' ); ?></a></li>
            <?php wp_list_pages( 'sort_column=menu_order&depth=6&title_li=&exclude=' ); ?>
        </ul><!-- /#nav -->
        <?php } ?>

    </nav><!-- /#navigation -->

    <?php woo_nav_after(); ?>

</header><!-- /#header -->

Заранее благодарю за ответы. введите сюда описание изображения

1 ответ 1

2

В предыдущих вопросах вы указывали ссылку на сайт, советую её и в будущем указывать, так будет проще отвечать на ваши вопросы

  1. Для начала зайдите в свой файл стилей CSS (/mystile/css/layout.css) и уберите там ненужные свойства:

строка 601:

    #header hgroup {
     /* float: left; */
    }

строка 604:

    #header #navigation {
     /* float: right;
     clear: none; */
     border: 0;
     background: 0;
     -webkit-box-shadow: none;
     box-shadow: none;
     width: auto;
    }

Строка 193:

    #header #navigation ul.nav {
     /* float: right; */
    }
  1. Дальше делайте разметку левого и правого блоков:

    <hgroup>
     <div class="inner-left">
      <?php
       $logo = esc_url( get_template_directory_uri() . '/images/logo.png' );
        if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' ) { $logo = $woo_options['woo_logo']; }
        if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' && is_ssl() ) { $logo = preg_replace("/^http:/", "https:", $woo_options['woo_logo']); }
      ?>
      <?php if ( ! isset( $woo_options['woo_texttitle'] ) || $woo_options['woo_texttitle'] != 'true' ) { ?>
       <a id="logo" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php esc_attr( get_bloginfo( 'description' ) ); ?>">
        <img src="<?php echo $logo; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" />
       </a>
      <?php } ?>
    
      <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
    
      <h3 class="nav-toggle"><a href="#navigation">&#9776; <span><?php _e('Navigation', 'woothemes'); ?></span></a></h3>
    
     </div>
     <div class="inner-right">          
    
      <h4 >+7(968)394-13-74<br>круглосуточно</h4>
    
     </div>
    </hgroup>
    
  2. Ну а это соответственно Ваше меню:

    <?php woo_nav_before(); ?>
    
    <nav id="navigation" class="col-full" role="navigation">
    
     <?php
    
      if ( function_exists( 'has_nav_menu' ) && has_nav_menu( 'primary-menu' ) ) {
       wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'menu_id' => 'main-nav', 'menu_class' => 'nav fr', 'theme_location' => 'primary-menu' ) );
    
      } else {
    
     ?>
    
     <ul id="main-nav" class="nav fl">
    
      <?php if ( is_page() ) $highlight = 'page_item'; else $highlight = 'page_item current_page_item'; ?>
    
       <li class="<?php echo $highlight; ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php _e( 'Home', 'woothemes' ); ?></a></li>
    
      <?php wp_list_pages( 'sort_column=menu_order&depth=6&title_li=&exclude=' ); ?>
    
     </ul><!-- /#nav -->
    
     ?php } ?>
    
    </nav><!-- /#navigation -->
    
    <?php woo_nav_after(); ?>
    
  3. Управляйте своими блоками через CSS

10
  • Я очень и очень Вам признателен за помощь,еще сам только начинаю разбираться в ВП,но для меня это пока что сложно) Не могли бы подсказать,я исправил в теге <hgroup>,что вы дали(2 пункт),так же скопировал все в теге <nav> (3 пункт).Но сайт просто падает,и перестает работать,в чем может быть причина? Заранее благодарю за ответ.
    – tweeker
    1 ноя 2016 в 21:03
  • Все,не стал изменять <nav> .В ксс указал контакты float:left.Все благодарю за развернутый ответ :)
    – tweeker
    2 ноя 2016 в 7:05
  • Извиняюсь за наглость,но все же.Хочу футер перенести на свою страницу html.Скопировал все из файла footer.php и добавил в свой файл( tiarsekj.bget.ru ) Но он встал криво,в чем может быть проблема?Заранее благодарю за ответ
    – tweeker
    2 ноя 2016 в 7:16
  • По порядку, 1. сайт перестал падать? Не думаю что это как-то связано с шапкой, если вы ничего лишнего не удалили 2 ноя 2016 в 10:12
  • Контакты float:left!? Вы вроде на макете рисовали, что хотите их вправо перенести!? 2 ноя 2016 в 10:14

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.