Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Elena Paraschiv
Elena Paraschiv
9,938 Points
Posted by Elena Paraschiv
Elena Paraschiv
9,938 Points

Transform foundation menu into wordpress

Hey. I have a menu I wrote with the help of foundation and I want to make it suitable for wordpress in php. I followerd the course of wordpress theme development, but cannot figure out how the styles are written. I want it to look like this Imgur

 <!-- Navigation -->
    <div class="fixed">
      <nav class="top-bar">
        <ul class="title-area">
            <li class="name">
              <h1>
                <a href="#">Integrera Jonkoping</a>
              </h1>
             </li>

            <li class="toggle-topbar menu-icon"><a href=""><span></span></a> </li>
          </ul>


        <section class="top-bar-section">
          <ul class="right">
            <li><a href="#">Hem</a></li>
            <li><a href="#">Om Oss</a></li>
            <li><a href="#">Blog</a></li>

            <li class="has-dropdown">
              <a href="#">Praktik och Arbete</a>
               <ul class="dropdown">
                 <li><a href="#">Lediga jobb och praktikplatser</a></li>
                  <li><a href="#">Regler</a></li>
                </ul>
             </li>



             <li class="has-dropdown">
              <a href="#">Projekt</a>
                <ul class="dropdown">
                  <li><a href="#">Pågående projekt</a></li>
                  <li><a href="#">Avslutade projekt</a></li>
                </ul>
            </li>

             <li>
              <a href="#">Swedish Language</a>
              <ul class="dropdown">
                  <li><a href="#">Online</a></li>
                  <li><a href="#">Ordböker</a></li>
                  <li><a href="#">Språkcafe</a></li>
                  <li><a href="#">Media</a></li>
                  <li><a href="#">Studieförbunder</a></li>
                  <li><a href="#">Böker</a></li>
                </ul>
            </li>

            <li><a href="#">Kalendar</a></li>
            <li><a href="#">Kontakt</a></li>
          </ul>
        </section>
      </nav>
  </div>
    <!-- End Navigation -->

1 Answer

Rich Bagley
Rich Bagley
25,869 Points
Rich Bagley
Rich Bagley
25,869 Points

Hi Elena,

You could use a Walker like the one mentioned here.

This previous question on Treehouse may also help though as it has a few examples.

-Rich