Drejtoria e artikujve
shumëMarketingu në internetnjerëzit zgjedhinWordPressEjandërtoni një faqe interneti, por shiriti i navigimit të disa temave nuk mbështet menutë dytësore/me shumë nivele. Nëse nuk jeni të kënaqur, mund të provoni të shtoni ose modifikoni manualisht stilin e menysë së temës.
Modifikimi fillon nga header.php Një funksion i rëndësishëm në këtë skedar shabllon është shfaqja e menysë.
Nëse përdorni kodin për të thirrur kategorinë si menu, është gjithashtu e mundur, por nuk është e përshtatshme të renditni artikujt e menysë.
Drejtoritë me nën-kategori nuk janë të lehta për t'u trajtuar, kështu që unë gjithashtu dua të shtoj funksione të personalizuara të menusë në temën time ashtu si temat e tjera.
Nuk është e vështirë të shtosh funksionin e personalizimit të menusë në temën e krijuar rishtazi, ka kryesisht 2 hapa.
Hapi i parë, regjistrimi i menusë së WordPress
Për të përdorur menunë, fillimisht duhet të regjistroheni, të hapni skedarin e funksioneve nën temë dhe të shtoni kodin e mëposhtëm ▼
<?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' => __('底部菜单') ) ); } ?>
- Nëse nuk ka skedar functions.php nën temë, krijoni një të ri dhe kopjoni kodin e mësipërm për ta ruajtur.
登录Mbështetja e WordPress, dhe më pas shkoni te Paraqitja → Menyja.
Nëse mund të shihni ekranin më poshtë, do të thotë se jeni regjistruar si ▼
Më sipër regjistron 2 meny:
- Një meny në krye Menubar.
- një menu kryesore Main shirit menuje.
Hapi i dytë, thirrja e menusë së WordPress
Pasi të regjistrohet menyja, ajo mund të thirret në skedarin e shabllonit të temës.Vendosni kodin e mëposhtëm në skedarin header.php dhe mund ta thërrisni aty ku dëshironi të shfaqni menunë.
Në skedarin header.php, thirrni "menunë e sipërme" ▼
//顶部菜单调用 <?php wp_nav_menu(array('theme_location' => 'top_navi')); ?>
Në skedarin header.php, thirrni "menynë kryesore" ▼
//主菜单调用 <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')); ?>
Thirrni "menunë e poshtme" në skedarin footer.php▼
//底部菜单调用
<?php wp_nav_menu(array('theme_location' => 'foot_navi')); ?>
Hapi XNUMX: Menyja e cilësimeve
Pasi të regjistrohet menyja dhe të përcaktohet pozicioni i shfaqjes së menysë në skedarin e temës, mund të krijoni një artikull të ri të menysë në sfondin e WordPress.
Më pas, caktoni artikullin e sapokrijuar të menysë në menunë e regjistruar dhe sugjeroni lidhjen përkatëse ▼
Krijo shiritin e navigimit të menusë me shumë nivele të wordpress
Tani le të flasim se si të bëjmë një menu me shumë nivele të WordPress:
Së pari fshini kodin origjinal të menusë në skedarin e funksioneve të temës suaj të WordPress.
ose shtoni direkt këtë kod ▼
<?php if ( function_exists('register_nav_menus') ) {register_nav_menus(array('primary' => '主导航菜单'));}?>
- Shënim: duhet të jetë nëShtuar jashtë.
Më pas gjeni kodin PHP për temën për të thirrur menunë, nëse është e papërpunuar, zakonisht është kështu ▼
<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
hiqeni atë dhe zëvendësojeni me ▼
<div id="menu"><?php if(function_exists('wp_nav_menu')) { wp_nav_menu(array('theme_location'=>'primary','menu_id'=>'nav','container'=>'ul')); } ?> </div>
- Shënim: Sigurohuni që ky kod të mos përmbajë div të tjera, përndryshe ai do të kufizohet nga div i jashtëm.
Hapi tjetër është të shtoni kodin e funksionit JS në listë dhe të shtoni kodin e mëposhtëm në skedarin JS të temës ▼
jQuery(document).ready(function($) { $('#nav li').hover(function() { $('ul', this).slideDown(200)}, function() {$('ul', this).slideUp(300)});});
Menuja e WordPress stilet CSS
Më në fund, zbukurimi i stilit CSS.
Çfarë lloj efekti duhet të jetë, jepini një lojë të plotë imagjinatës suaj, CSS mund ta bëjë atë ▼
#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;}
- Shtoni kodin e mësipërm CSS në skedarin style.css të temës dhe ruajeni.
Pas ruajtjes, rifreskoni faqen e parë të faqes suaj të internetit, mund të shihni efektin, a është shumë e thjeshtë?
Blogu Hope Chen Weiliang ( https://www.chenweiliang.com/ ) shared "Si e quan WordPress menunë e personalizuar të shiritit të navigimit dytësor/me shumë nivele? , për t'ju ndihmuar.
Mirë se vini të shpërndani lidhjen e këtij artikulli:https://www.chenweiliang.com/cwl-1521.html
Mirësevini në kanalin Telegram të blogut të Chen Weiliang për të marrë përditësimet më të fundit!
📚 Ky udhëzues përmban vlera të mëdha, 🌟Ky është një mundësi e rrallë, mos e humbisni! ⏰⌛💨
Shpërndaje dhe like nëse të pëlqen!
Ndarjet dhe pëlqimet tuaja janë motivimi ynë i vazhdueshëm!