サポート » 使い方全般 » ナビゲーションを上部に

12件の返信を表示中 - 1 - 12件目 (全12件中)
  • CG

    (@du-bist-der-lenz)

    ヘッダー画像は残したいということでしょうか

    ご返答ありがとうございます。
    ヘッダー画像というのでしょうか、大きな画像は残したままでメニューバーだけ上に配置したいのです。
    よろしくお願い致します。

    CG

    (@du-bist-der-lenz)

    ヘッダー画像と、ナビバーを入れ替えたら良いでしょう

    ご返答ありがとうございます。
    素人な質問ですみませんが具体的な方法を教えて頂けますか?

    CG

    (@du-bist-der-lenz)

    具体的に示す必要がありますか

    なにぶん初心者なものでできればヒントだけでも教えて頂けると助かります。

    RICK

    (@rickaddison7634)

    横から失礼します。
    実験がてらやってみました。
    ①できれば子テーマを作成する(CSSの読み込みは親テーマ→子テーマが望ましい)
    ②header.phpの31行目以下を編集(子テーマを作成した場合は子テーマにコピーしてから編集)
    【編集前】

    
    		<?php get_template_part( 'template-parts/header/header', 'image' ); ?>
    
    		<?php if ( has_nav_menu( 'top' ) ) : ?>
    			<div class="navigation-top">
    				<div class="wrap">
    					<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
    				</div><!-- .wrap -->
    			</div><!-- .navigation-top -->
    		<?php endif; ?>
    


    【編集後】

    
    		<?php if ( has_nav_menu( 'top' ) ) : ?>
    			<div class="navigation-top">
    				<div class="wrap">
    					<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
    				</div><!-- .wrap -->
    			</div><!-- .navigation-top -->
    		<?php endif; ?>
    
    		<?php get_template_part( 'template-parts/header/header', 'image' ); ?>
    


    ③WPのダッシュボード→外観→カスタマイズ→追加CSSに以下のコードを追加
    (子テーマでもOKだがこちらのほうが簡単)

    
    @media screen and (min-width: 48em){
    	.navigation-top {
        		position: relative;
    	}
    }
    

    上記の変更だとモバイルメニューが表示されなくなるので取り消しました。

    WPのダッシュボード→外観→カスタマイズ→追加CSSに以下のコードを追加すればOKです。
    この場合スマホではヘッダ画像の下にメニューが表示されます。

    
    @media screen and (min-width: 48em){
    	.navigation-top {
    		top:0;
    		bottom:inherit;
    	}
    }
    
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。理由: 誤り訂正
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    RICK

    (@rickaddison7634)

    思った以上に複雑だったので、以前の投稿は無視してください。

    ①できれば子テーマを作成する
    (CSSの読み込み順は親テーマ→子テーマが望ましい)

    ②header.phpの31行目以下を編集
    (子テーマを作成した場合は子テーマにコピーしてから編集)

    【編集前】

    
    		<?php get_template_part( 'template-parts/header/header', 'image' ); ?>
    
    		<?php if ( has_nav_menu( 'top' ) ) : ?>
    			<div class="navigation-top">
    				<div class="wrap">
    					<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
    				</div><!-- .wrap -->
    			</div><!-- .navigation-top -->
    		<?php endif; ?>
    

    【編集後】

    
    		<?php if ( has_nav_menu( 'top' ) ) : ?>
    			<div class="navigation-top">
    				<div class="wrap">
    					<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
    				</div><!-- .wrap -->
    			</div><!-- .navigation-top -->
    		<?php endif; ?>
    
    		<?php get_template_part( 'template-parts/header/header', 'image' ); ?>
    

    ③WPのダッシュボード→外観→カスタマイズ→追加CSSに以下のコードを追加
    (CSSの読み込み順が親テーマ→子テーマの場合子テーマでもOK)

    
    @media screen and (min-width: 48em){
    	.navigation-top {
        		position: relative;
    	}
    			
    }
    .navigation-top {
        	z-index:9999;
    }
    
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    • この返信は3 ヶ月、 1 週前に  RICK さんが編集しました。
    hachikuma

    (@hachikuma)

    RICKさん、うまくいきました!
    ありがとうございます!

    心から感謝申し上げます。

    hachikuma

    (@hachikuma)

    RICKさん、もう1点質問を投稿したのですが、
    こちらもおわかりになればご解答頂けないでしょうか?
    ↓↓

    wordpress テーマ「sydney」のメニューの背景を変えたいと思っています。

    このように
    https://drive.google.com/open?id=1crQqGg-9xYFv3PlUu4NTu5Wl5bBMyLlk

    スタート時点だとメニューやロゴが黒字の場合、画像が暗かったりすると見づらいのです。
    標準だとスクロールすると白い透かしの背景に変化するのですが、最初からうっすらとした白い透かしがあればいいなぁと思っています。

    どなたかそのような方法を教えて頂けないでしょうか?
    宜しくお願い致します。

    RICK

    (@rickaddison7634)

    このトピックの問題はもう解決したようなので解決済みにしてください。
    次の質問には気が向いたときに回答させていただきます。

    hachikuma

    (@hachikuma)

    そうでしたね 汗
    失礼しました。

12件の返信を表示中 - 1 - 12件目 (全12件中)
  • このトピックに返信するにはログインが必要です。