2017-09-14 11 views
0

私はマテリアライズを使って新しいテーマを作っていますが、問題が発生しました。
以下、問題のスクリーンショットを追加しました。Wordpressのadmin barの下でサイドバイサイドをマテリアライズ

The issue

今、私の質問は、私はこの問題を解決することができ、どのようにでしょうか?
ナビゲーションバーを管理バーの下に完全に配置します。
paddingまたはmarginを使用できますが、管理バーが無効になっていると表示されます(これは、私以外のすべてのユーザーに適用されます)。

私は誰かが私はそれを修正:)

乾杯

EDIT役立つことを願っ:

<header> 
 
    <div class="navbar-fixed"> 
 
     <nav> 
 
      <div class="nav-wrapper container"> 
 
       <a href="<?php echo esc_url(get_home_url(null, null, 'relative')); ?>" class="brand-img img-responsive"> 
 
        <img src="https://www.finlaydag33k.nl/wp-content/uploads/2016/08/logo-FDG-300-01-300x300.png"> 
 
       </a>     
 
       <ul id="nav-mobile" class="right hide-on-med-and-down"> 
 
        <li> 
 
         <a href="#" data-activates="side-nav-150" class="button-collapse show-on-large"><i class="material-icons"><?php _e('menu', 'finlaydag33k'); ?></i></a> 
 
        </li>      
 
       </ul>     
 
      </div>    
 
     </nav> 
 
    </div> 
 
    <ul class="side-nav" id="side-nav-150"> 
 
     <?php wp_nav_menu(array(
 
       'menu' => 'Main Menu', 
 
       'container' => '', 
 
       'fallback_cb' => 'wp_bootstrap_navwalker::fallback', 
 
       'walker' => new wp_bootstrap_navwalker() 
 
     )); ?> 
 
     <?php if (is_active_sidebar('right_sidebar')) : ?> 
 
      <div id="sidebar"> 
 
       <?php dynamic_sidebar('right_sidebar'); ?> 
 
      </div> 
 
     <?php endif; ?> 
 
    </ul> 
 
</header>
:私は(いくつかのWordpressのもので)使用しているコードを持って、ここを

+0

ログインしている場合は、クラスは 'に追加されます身体。ログインしているときにCSSを使用してヘッダーをターゲットに設定することができます。 – disinfor

+0

うーん...私はそれをどうすればいいのか分かりませんが、試してみることができます –

答えて

0

の外sidenavを移動してみてください、私のために問題を修正しました:)

0

navbar-classをnavbar-fixedに変更すると、ナビを固定している間に他のコンテンツがオフセットされます。

+0

どちらを添付すればいいですか? '.navbar'(私のロゴを含むもの、サイドナビを開くボタン)や' .side-nav'? '.navbar'にはすでに' navbar-fixed'クラスがあります。 '.side-nav 'に追加すると、サイドナビゲータに常に表示されるようになります –

+0

新しい回答に示されているように.navbar-fixedの外にsidenavを移動してみてください – zuif

0

<body>タグに<?php body_class(); ?>を追加.navbar-固定

<header> 
    <div class="navbar-fixed"> 
     <nav> 
      <div class="nav-wrapper"> <a href="#!" class="brand-logo">Logo</a> 
       <a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a> 
       <ul class="right hide-on-med-and-down"> 
        <li><a href="sass.html">Sass</a></li> 
        <li><a href="badges.html">Components</a></li> 
        <li><a href="collapsible.html">Javascript</a></li> 
        <li><a href="mobile.html">Mobile</a></li> 
       </ul> 
      </div> 
     </nav> 
    </div> 


    <ul class="side-nav" id="mobile-demo"> 
     <li><a href="sass.html">Sass</a></li> 
     <li><a href="badges.html">Components</a></li> 
     <li><a href="collapsible.html">Javascript</a></li> 
     <li><a href="mobile.html">Mobile</a></li> 
    </ul> 
</header> 
+0

OPを更新しました私が使用しているコード(私はその笑を追加するのを忘れてしまった)。 ご覧のとおり、私はすでにあなたのようにかなり手を振っています。 –

関連する問題