WordPress e bitsa menyu ea mantlha / ea maemo a mangata joang?

tse ngata tsa网络 营销batho ba khethaWordpressTloohaha sebaka sa marang-rang, empa sebaka sa ho tsamaya sa meralo e meng ha se tshehetse dimenu tsa bobedi/maemo a mangata.Ha o sa kgotsofala, o ka leka ho kenya le ho fetola setaele sa menu ya tema ka bowena.

Phetoho e qala ho header.php Mosebetsi oa bohlokoa faeleng ena ea template ke pontšo ea menu.

Haeba u sebelisa khoutu ho bitsa sehlopha e le menu, hoa khoneha, empa ha ho bonolo ho hlophisa lintho tsa menu.

Li-directory tse nang le likaroloana ha li bonolo ho sebetsana le tsona, ka hona ke batla ho kenyelletsa mesebetsi ea li-menu ho sehlooho sa ka joalo ka lihlooho tse ling.

Ha ho thata ho eketsa ts'ebetso ea ho etsa li-menu ho sehlooho se sa tsoa etsoa, ​​​​ho na le mehato e 2 haholo.

Mohato oa pele, ngoliso ea menu ea WordPress

Ho sebelisa menyu, o tlameha ho qala ho ingolisa, bula faele ea tšebetso tlasa sehlooho, ebe o kenya khoutu e latelang ▼

<?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' => __('底部菜单') ) );
}
?>
  • Haeba ho se na file ea function.php tlas'a sehlooho, theha e ncha 'me u kopitse khoutu e ka holimo ho e boloka.

Loka kahareWordPress backend, ebe u ea ho Ponahalo→Menu.

Haeba u bona skrine e ka tlase, ho bolela hore u ngolisitse joalo ka ▼

Nomoro ea boemo ba menu ea WordPress 1

Lintlha tse ka holimo li ngolisa menyetla e 2:

  1. Lenaneo le holimo la Top Menubar.
  2. menu e kholo ea Main menubar.

Mohato oa bobeli, mohala oa menyu oa WordPress

Ka mor'a hore menu e ngolisoe, e ka bitsoa faeleng ea template ea sehlooho Beha khoutu e latelang ho file ea header.php, 'me u ka e bitsa moo u batlang ho bontša menu.

Ho file ea header.php, letsetsa "top menu"▼

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

Ho file ea header.php, letsetsa "menu e kholo"▼

//主菜单调用
<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')); ?>

Letsetsa "menu e ka tlase" ho footer.php file▼

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

Mohato oa XNUMX: Litlhophiso tsa menu

Ka mor'a hore menu e ngolisoe 'me boemo ba pontšo ea menu bo hlalositsoe faeleng ea sehlooho, u ka etsa ntho e ncha ea menu ka mokokotlo oa WordPress.

Ebe u fana ka ntho e sa tsoa etsoa ho menu e ngolisitsoeng, 'me u fane ka maikutlo a kamano e lumellanang ▼

WordPress e bitsa menyu ea mantlha / ea maemo a mangata joang?setšoantšo sa 2

Etsa bar ea ho tsamaea ea menu ea maemo a mangata ea wordpress

Joale ha re bue ka mokhoa oa ho etsa menyu ea maemo a mangata ea WordPress:

Qala ka ho hlakola khoutu ea mantlha ea menyu faeleng ea mesebetsi ea sehlooho sa hau sa WordPress.

kapa kenya khoutu ena ka kotloloho ▼

<?php if ( function_exists('register_nav_menus') ) {register_nav_menus(array('primary' => '主导航菜单'));}?>
  • Tlhokomeliso: e tlameha ho kenaE kenyelelitsoe ka ntle.

Ebe u fumana khoutu ea PHP bakeng sa sehlooho ho bitsa menyu, haeba e le tala, hangata e tjena ▼

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

e tlose 'me u e nkele sebaka ka ▼

<div id="menu"><?php if(function_exists('wp_nav_menu')) {
wp_nav_menu(array('theme_location'=>'primary','menu_id'=>'nav','container'=>'ul'));
} ?> </div>
  • Tlhokomeliso: Etsa bonnete ba hore khoutu ena ha e na li-div tse ling, ho seng joalo e tla tlanngoe ke div ea ka ntle.

Mohato o latelang ke ho eketsa khoutu ea ts'ebetso ea JS ebe o kenya khoutu e latelang faeleng ea JS ea sehlooho ▼

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

Mekhoa ea CSS ea menu ea WordPress

Qetellong, ho khabisa mokhoa oa CSS.

E lokela ho ba phello ea mofuta ofe, fana ka papali e felletseng monahanong oa hau, CSS e ka e etsa ▼

#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;}
  • Kenya khoutu ea CSS e kaholimo ho file ea theme's style.css 'me u e boloke.

Ka mor'a ho boloka, tsosolosa leqephe le ka pele la sebaka sa hau sa marang-rang, u ka bona phello, na e bonolo haholo?

Hope Chen Weiliang Blog ( https://www.chenweiliang.com/ ) e arolelanoa "WordPress e bitsa menyu ea tloaelo ea "bara ea ho tsamaea ea maemo a mangata" joang? , ho u thusa.

Rea u amohela ho arolelana sehokelo sa sengoloa sena:https://www.chenweiliang.com/cwl-1521.html

Rea u amohela ho mocha oa Telegraph oa blog ea Chen Weiliang ho fumana lintlha tsa morao-rao!

🔔 Eba oa pele oa ho fumana Tataiso ea Tšebeliso ea "ChatGPT Content Marketing AI" ea bohlokoa bukeng ea holimo ea seteishene! 🌟
📚 Tataiso ena e na le boleng bo boholo, 🌟Ona ke monyetla o sa tloaelehang, se ke oa o fetoa! ⏰⌛💨
Share le rata haeba u rata!
Ho arolelana le lintho tseo u li ratang ke khothatso ea rona e tsoelang pele!

 

Comments

Aterese ea hau ea lengolo tsoibila e ke ke ea phatlalatsoa. Ho sebelisoa masimo a hlokahalang * Letšoao

tsamaisetsa hodimo