ዎርድፕረስ እንዴት ሁለተኛ/ባለብዙ ደረጃ አሰሳ አሞሌ ብጁ ሜኑ ይጠራል?

ብዙ ነገርየበይነመረብ ግብይትሰዎች ይመርጣሉየዎርድፕረስናድር ጣቢያ መገንባትነገር ግን የአንዳንድ ገጽታዎች ዳሰሳ አሞሌ ሁለተኛ/ባለብዙ ደረጃ ሜኑዎችን አይደግፍም።ካልረኩ የጭብጡን ሜኑ ዘይቤ እራስዎ ለመጨመር እና ለማሻሻል መሞከር ይችላሉ።

ማሻሻያው የሚጀምረው ከ header.php ነው በዚህ የአብነት ፋይል ውስጥ ያለው ጠቃሚ ተግባር የምናሌው ማሳያ ነው።

ምድቡን እንደ ምናሌ ለመጥራት ኮዱን ከተጠቀሙ, እንዲሁም ይቻላል, ነገር ግን የምናሌ እቃዎችን ለመደርደር አመቺ አይደለም.

ንዑስ ምድቦች ያላቸው ማውጫዎች ለማስተናገድ ቀላል አይደሉም፣ ስለዚህ እኔም ልክ እንደሌሎች ጭብጦች ብጁ የምናሌ ተግባራትን ወደ ጭብጤ ማከል እፈልጋለሁ።

አዲስ በተሰራው ጭብጥ ላይ የምናሌ ማበጀት ተግባርን ማከል ከባድ አይደለም በዋናነት 2 ደረጃዎች አሉ።

የመጀመሪያው ደረጃ, የዎርድፕረስ ምናሌ ምዝገባ

ምናሌውን ለመጠቀም መጀመሪያ መመዝገብ አለብዎት ፣ ከጭብጡ ስር ያለውን የተግባር ፋይል ይክፈቱ እና የሚከተለውን ኮድ ያክሉ ▼

<?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' => __('底部菜单') ) );
}
?>

• በጭብጡ ስር ምንም functions.php ፋይል ከሌለ አዲስ ይፍጠሩ እና ለማስቀመጥ ከላይ ያለውን ኮድ ይቅዱ።

ይግቡየዎርድፕረስ ጀርባ, እና ከዚያ ወደ Appearance→ሜኑ ይሂዱ።

ከታች ያለውን ስክሪን ማየት ከቻሉ እንደ ▼ ተመዝግበዋል ማለት ነው።

ከላይ ያሉት 2 ምናሌዎችን ይመዘግባል-

1. ከፍተኛ ምናሌ ከፍተኛ ሜኑባር።
2. ዋና ምናሌ Main menubar.

ሁለተኛው ደረጃ, የ WordPress ምናሌ ጥሪ

ምናሌው ከተመዘገበ በኋላ በ theme አብነት ፋይል ውስጥ ሊጠራ ይችላል የሚከተለውን ኮድ በ header.php ፋይል ውስጥ ያስቀምጡ እና ምናሌውን ለማሳየት በሚፈልጉት ቦታ መደወል ይችላሉ.

በ header.php ፋይል ውስጥ "የላይኛው ሜኑ" ▼ ይደውሉ

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

በ header.php ፋይል ውስጥ "ዋናውን ሜኑ" ▼ ይደውሉ

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

በ footer.php ፋይል ውስጥ ያለውን "ታች ሜኑ" ይደውሉ

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

ደረጃ XNUMX፡ የቅንጅቶች ምናሌ

ምናሌው ከተመዘገበ በኋላ እና የምናሌው የማሳያ ቦታ በገጽታ ፋይል ውስጥ ከተገለጸ በኋላ በ WordPress ዳራ ውስጥ አዲስ የምናሌ ንጥል መፍጠር ይችላሉ።

ከዚያ አዲስ የተፈጠረውን ሜኑ ንጥል በተመዘገበው ምናሌ ውስጥ ይመድቡ እና ተዛማጅ ግንኙነት ▼ ይጠቁሙ

የዎርድፕረስ ባለብዙ ደረጃ ምናሌ አሰሳ አሞሌን ያድርጉ

አሁን የዎርድፕረስ ባለብዙ ደረጃ ሜኑ እንዴት እንደሚሰራ እንነጋገር፡-

በመጀመሪያ በራስዎ የዎርድፕረስ ገጽታ ተግባር ፋይል ውስጥ የመጀመሪያውን የምናሌ ኮድ ይሰርዙ።

ወይም ይህን ኮድ በቀጥታ ▼ ያክሉ

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

• ማስታወሻ፡ መግባት አለበት።ውጭ ተጨምሯል።

ከዚያ ሜኑውን ለመጥራት ጭብጡ የ PHP ኮድ ያግኙ፣ ጥሬ ከሆነ፣ አብዛኛው ጊዜ እንደዚህ ነው ▼

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

ያስወግዱት እና በ ▼ ይቀይሩት

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

• ማሳሰቢያ፡ ይህ ኮድ ሌሎች ዲቪዎችን እንደሌለው እርግጠኛ ይሁኑ፣ ካልሆነ ግን በውጫዊ div የተገደበ ይሆናል።

ቀጣዩ እርምጃ የተቆልቋይ JS ተግባር ኮድ ማከል እና የሚከተለውን ኮድ ወደ ጭብጥ JS ፋይል ማከል ነው ▼

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

የዎርድፕረስ ምናሌ CSS ቅጦች

በመጨረሻም የሲኤስኤስ ቅጥ ማስዋብ።

ምን አይነት ውጤት መሆን አለበት, ለአዕምሮዎ ሙሉ ጨዋታ ይስጡ, CSS ሊያደርገው ይችላል ▼

#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;}

• ከላይ ያለውን የሲኤስኤስ ኮድ ወደ የገጽታ style.css ፋይል ያክሉ እና ያስቀምጡት።

ካስቀመጡ በኋላ የድረ-ገጽዎን የፊት ገጽ ያድሱ, ውጤቱን ማየት ይችላሉ, በጣም ቀላል ነው?