感谢维安雨轩提供思路
修改主题设置
在后台的主题设置中打开展开导航菜单
修改header.php
打开header.php,找到<header class="site-header no-select" role="banner">,将其替换为
<?php if (is_front_page()){ ?>
<header class="site-header no-select is-homepage" role="banner">
<?php }else{ ?>
<header class="site-header no-select" role="banner">
<?php } ?>
然后搜索</div><!-- .site-branding -->
在下一行添加
<div class="lower-cantiner">
并将
<div class="lower"><?php if(!akina_option('shownav')){ ?>
<div id="show-nav" class="showNav">
<div class="line line1"></div>
<div class="line line2"></div>
<div class="line line3"></div>
</div><?php } ?>
<nav><?php wp_nav_menu( array( 'depth' => 2, 'theme_location' => 'primary', 'container' => false ) ); ?></nav><!-- #site-navigation -->
</div>
修改为
<div class="lower"><?php if(!akina_option('shownav')){ ?>
<div id="show-nav" class="showNav">
<div class="line line1"></div>
<div class="line line2"></div>
<div class="line line3"></div>
</div><?php } ?>
<nav class="mobile-fit-control hide"><?php wp_nav_menu( array( 'depth' => 2, 'theme_location' => 'primary', 'container' => false ) ); ?></nav><!-- #site-navigation -->
</div>
然后移到
<?php header_user_menu(); if(akina_option('top_search') == 'yes') { ?>
<div class="searchbox"><i class="iconfont js-toggle-search iconsearch icon-search"></i></div>
<?php } ?>
的上方
修改style.css
添加代码
在style.css文件尾部添加下列代码
.site-header.is-homepage .lower-cantiner {
display: none;
}
.site-header.is-homepage.yya .lower-cantiner {
display: block;
}
.site-header:hover.is-homepage .lower-cantiner {
display: block;
}
.site-top .lower-cantiner {
position: absolute;
left: 50%;
min-width: 758.4px;
pointer-events: none;
}
#show-nav.mobile-fit {
position: fixed !important;
right: 120px;
opacity: 0;
pointer-events: none;
}
修改代码
搜索 .site-top .lower { 并将其修改为
.site-top .lower {
position: relative;
display: inline-block;
margin: 15px 0 0 10px;
font-size: 16px;
left: -50%;
pointer-events: auto !important;
}
搜索 @media(max-width:1200px) { 并将其修改为
@media(max-width:1200px) {
.site-top .lower nav{
position: absolute;
float: right;
animation: searchbox .2s;
min-width: 860px;
z-index: -1
}
.site-top .lower nav.navbar {
right: calc(-50px - 100%);
}
.site-top .lower nav.navbar ul {
background: #fff;
}
}
Comments 2 条评论
这是一条私密评论
#私密#