2013-09-15 7 views
0

Ребята, у меня есть следующие коды в моем html. Я использую 320 bootstrap wp theme. Я просто создаю меню. Работает. Но это выше поле не перемещается в меню в меню. Как я это делаю?Как преобразовать меню html в меню WordPress (WordPress)

Подробнее. Перейдите по ссылкам ниже.

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Menu Tutorial - Cufon Font Script</title> 
<link rel="shortcut icon" href="images/favicon.ico" /> 
<!--CSS--> 
<link href="styles/style.css" rel="stylesheet" type="text/css" /> 
<link href="styles/color.css" rel="stylesheet" type="text/css" /> 
<link href="styles/noscript.css" rel="stylesheet" type="text/css" id="noscript" media="screen,all" /> 
<!--End testimonial--> 
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> 
<script type="text/javascript" src="js/cufon-yui.js"></script> 
<script type="text/javascript" src="js/Ebrima_400-Ebrima_700.font.js"></script> 
<script type="text/javascript"> 
    Cufon.replace('h1') ('h2') ('h3') ('h4') ('h5') ('h6') ('.nivo-caption h1', {textShadow: '#000 2px 0px 2px'}) ('.nivo-caption .button'); 
</script> 
<script type="text/javascript" src="js/jquery.lavalamp.js"></script> 
<script type="text/javascript" src="js/lavalamp-config.js"></script> 
<script type="text/javascript" src="js/jquery.easing.1.1.js"></script> 
</head> 
<body> 
    <div id="wrapper"> 
     <div id="wrapper-top"> 
       <div id="top"> 
        <div id="top-left"><a href="index.html"> 
         <img src="images/logo.png" alt="" width="223" height="58" />It's An Image</a></div><!-- #top-left --> 
        <div id="top-right"> 
         <div id="nav"> 
          <ul id="topnav"> 
            <li class="active"><a href="index.html" >Home</a></li> 
            <li><a href="about.html">About Us</a> 
            </li> 
            <li><a href="services.html">Services</a> 
            <ul> 
             <li><a href="#">Services One</a></li> 
             <li><a href="#">Services Two</a></li> 
             <li><a href="#">Services Three</a></li> 
             <li><a href="#">Services Four</a></li> 
            </ul> 
            </li> 
            <li><a href="#">Portfolio</a> 
             <ul> 
              <li><a href="#">Portfolio One</a></li> 
              <li><a href="#">Portfolio Two</a></li> 
              <li><a href="#">Portfolio Three</a></li> 
             </ul> 
            </li> 
            <li><a href="contact.html">Contact</a></li> 
          </ul> 
          <!-- #topnav --> 
         </div><!-- #nav --> 
        </div><!-- #top-right --> 
       </div><!-- #top --> 
     </div><!-- #wrapper-top --> 
    <script type="text/javascript"> Cufon.now(); </script> <!-- to fix cufon problems in IE browser --> 
    <script type="text/javascript">jQuery('#noscript').remove();</script><!-- if javascript disable --> 
</body> 
</html> 

To View That I Expect

Объясняет

  1. Вы можете увидеть мои обновления просмотра этой ссылке от раздаточной.
  2. Вы можете увидеть красный квадрат вокруг окна глубины css.
  3. Это хорошо двигаться в HTML-странице
  4. Я хочу сделать это в WP

Искомого вашей помощи здесь

+0

Полезный ответ? – yeshansachithak

ответ

1

Есть два способа создания меню.

  1. Использование get_pages.
  2. Используя функцию WordPress Menų

NO.1

<ul>  
<?php 
$topparentofcurrent = getTopParentPostID($post->ID); 
$alltoppages = get_pages('parent=0&hierarchical=0&sort_column=menu_order&sort_order=ASC'); 
foreach($alltoppages as $pages){ ?> 
Your html code here to repeat in loop. 
<li><?php echo $pages->post_title ?></li> 
<?php } ?>  
</ul> 

No.2

<div id="topMenu"> 
    <div id="access"> 
     <?php 
      $args = array(
      'theme_location' => 'header_menu', 
      'menu' => 'Main Menu', 
      'sort_column' => 'menu_order', 
      'container_class' => 'menu-header' 

     ); 
     wp_nav_menu($args); 
      ?> 
    </div> 
    </div> 

Теперь вам нужно сделать стиль в CSS только он будет автоматически показывать поведение родительского ребенка.

Смежные вопросы