Kif WordPress isejjaħ menu tad-dwana tal-bar tan-navigazzjoni sekondarju/b'ħafna livelli?

ħafna minn网络 营销in-nies jagħżluWordPressEjjatibni websajt, iżda l-bar tan-navigazzjoni ta 'xi temi ma jappoġġjax menus sekondarji/b'ħafna livelli.Jekk m'intix sodisfatt, tista' tipprova żżid u timmodifika manwalment l-istil tal-menu tat-tema.

Il-modifika tibda minn header.php Funzjoni importanti f'dan il-fajl template hija l-wiri tal-menu.

Jekk tuża l-kodiċi biex issejjaħ il-kategorija bħala menu, huwa possibbli wkoll, iżda mhuwiex konvenjenti li tissortja l-oġġetti tal-menu.

Direttorji b'sottokategoriji mhumiex faċli biex jimmaniġġaw, għalhekk irrid inżid ukoll funzjonijiet tal-menu tad-dwana mat-tema tiegħi bħal temi oħra.

Mhuwiex diffiċli li żżid funzjoni ta 'personalizzazzjoni tal-menu mat-tema li għadha kif saret, prinċipalment hemm 2 passi.

L-ewwel pass, reġistrazzjoni tal-menu WordPress

Biex tuża l-menu, l-ewwel trid tirreġistra, tiftaħ il-fajl tal-funzjonijiet taħt it-tema, u tehmeż il-kodiċi li ġej ▼

<?php
//自定义菜单
if (function_exists('register_nav_menus')) {
register_nav_menus( array( 'top_navi' => __('顶部菜单') ) );
register_nav_menus( array( 'menu_navi' => __('站点导航') ) );
register_nav_menus( array( 'foot_navi' => __('底部菜单') ) );
}
?>

• Jekk m'hemm l-ebda fajl functions.php taħt it-tema, oħloq wieħed ġdid u kkopja l-kodiċi ta 'hawn fuq biex issalvah.

登录Backend ta 'WordPress, u mbagħad mur Dehra→Menu.

Jekk tista' tara l-iskrin hawn taħt, dan ifisser li rreġistrajt bħala ▼

Dan t'hawn fuq jirreġistra 2 menus:

1. A top menu Top Menubar.
2. menu prinċipali Main menubar.

It-tieni pass, is-sejħa tal-menu WordPress

Wara li l-menu jiġi rreġistrat, jista 'jissejjaħ fil-fajl tal-mudell tat-tema Poġġi l-kodiċi li ġej fil-fajl header.php, u tista' ssejħilha fejn trid turi l-menu.

Fil-fajl header.php, sejjaħ il-"menu ta' fuq"▼

//顶部菜单调用
<?php wp_nav_menu(array('theme_location' => 'top_navi')); ?>

Fil-fajl header.php, sejjaħ il-"menu prinċipali"▼

//主菜单调用
<div id="menu"><?php if(function_exists('wp_nav_menu')) {
wp_nav_menu(array('theme_location'=>'menu_navi','menu_id'=>'nav','container'=>'ul'));
} ?> </div>

'menu_navi')); ?>

Sejħa l-"menu tal-qiegħ" fil-fajl footer.php▼

//底部菜单调用
<?php wp_nav_menu(array('theme_location' => 'foot_navi')); ?>

Pass XNUMX: Menu Settings

Wara li l-menu jiġi rreġistrat u l-pożizzjoni tal-wiri tal-menu tkun definita fil-fajl tat-tema, tista 'toħloq oġġett ġdid tal-menu fl-isfond ta' WordPress.

Imbagħad, assenja l-oġġett tal-menu maħluq ġdid għall-menu reġistrat, u tissuġġerixxi r-relazzjoni korrispondenti ▼

Agħmel bar ta 'navigazzjoni tal-menu ta' diversi livelli ta 'wordpress

Issa ejja nitkellmu dwar kif tagħmel menu ta 'diversi livelli ta' WordPress:

L-ewwel ħassar il-kodiċi oriġinali tal-menu fil-fajl tal-funzjonijiet tat-tema WordPress tiegħek stess.

jew żid dan il-kodiċi direttament ▼

<?php if ( function_exists('register_nav_menus') ) {register_nav_menus(array('primary' => '主导航菜单'));}?>

• Nota: trid tkun ġewwaMiżjud barra.

Imbagħad sib il-kodiċi PHP għat-tema biex issejjaħ il-menu, jekk huwa mhux maħdum, ġeneralment ikun bħal dan ▼

<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

neħħiha u tibdilha b'▼

<div id="menu"><?php if(function_exists('wp_nav_menu')) {
wp_nav_menu(array('theme_location'=>'primary','menu_id'=>'nav','container'=>'ul'));
} ?> </div>

• Nota: Kun żgur li dan il-kodiċi ma fihx divs oħra, inkella se jkun imdawwar mill-div ta 'barra.

Il-pass li jmiss huwa li żżid il-kodiċi tal-funzjoni JS dropdown u żid il-kodiċi li ġej mal-fajl JS tat-tema ▼

jQuery(document).ready(function($) {
$('#nav li').hover(function() {
$('ul', this).slideDown(200)},
function() {$('ul', this).slideUp(300)});});

WordPress stili CSS menu

Fl-aħħarnett, tisbiħ stil CSS.

X'tip ta 'effett għandu jkun, agħti rwol sħiħ lill-immaġinazzjoni tiegħek, CSS tista' tagħmel dan ▼

#menu {position:relative;width:99%;margin:0 5px 0 5px;height:36px;background: #f6f6f6 url("images/jtyu.jpg");}
#menu li{border-right:0px #ace solid;}
#nav{margin-left:30px;width:900px;height:36px;}
#nav li{font-size:14px;width:100px;line-height:30px;float:left;background: #f6f6f6 url("images/iol.jpg");border-bottom:0px #fff solid}
#nav li a{line-height:36px;color:#fff;text-align:center;display:block;background:url("images/beg.png") no-repeat;margin:0;}
#nav li a:hover{background:url("images/oilu.png") no-repeat center;color:#f03;}
.sub-menu {height:36px;float:left;position:absolute;text-align:center;display:none;}
.sub-menu a {border-top:0px #fff solid;height:36px;color:#fff; text-decoration:none; line-height:36px; text-align:center; padding:0 20px; display:block; _width:48px;}

• Żid il-kodiċi CSS ta 'hawn fuq mal-fajl style.css tat-tema u ssejvjah.

Wara li ssejvja, aġġorna l-paġna ta 'quddiem tal-websajt tiegħek, tista' tara l-effett, huwa sempliċi ħafna?