2014-09-24 27 views
5

Poważnie potrzebuję pomocy z was guyz, mam projekt wordpress w moim biurze, a klient wybrał jeden szablon strony HTML i poprosił o konwersję do wordpress. Wiem, jak konwertować html do worpdress normalnych motywów, ale jako temat jest tylko jedna strona z wieloma div działającymi jako strona. Straciłem rozum, jak to zrobić.html szablon jednej strony do konwersji wordpress

Przykro mi, ponieważ nie jest to sposób na platformę, ale potrzebuję punktu startowego.

Znaczniki tematem jest następująco

<!--Home Page 
=============================--> 
<div id="home" class="item"> 
       <!--<img src="assets/img/2.jpg" alt="The Spice Lounge" class="fullBg">--> 
       <div class="clearfix"> 
      <div class="header_details"> 
       <div class="container"> 
        <div class="header_icons accura-header-block accura-hidden-2xs"> 
         <ul class="accura-social-icons accura-stacked accura-jump accura-full-height accura-bordered accura-small accura-colored-bg clearFix"> 
         <li id="1"><a href="#" class="accura-social-icon-facebook circle"><i class="fa fa-facebook"></i></a></li> 
         <li id="2"><a href="#" class="accura-social-icon-twitter circle"><i class="fa fa-twitter"></i></a></li> 
         <li id="3"><a href="#" class="accura-social-icon-gplus circle"><i class="fa fa-google-plus"></i></a></li> 
         <li id="4"><a href="#" class="accura-social-icon-pinterest circle"><i class="fa fa-pinterest"></i></a></li> 
         <li id="5"><a href="#" class="accura-social-icon-linkedin circle"><i class="fa fa-linkedin"></i></a></li> 
         </ul> 
        </div> 
       <div class="call"> 
        <div class="home_address"> 
         #12 FIFTH MAIN STREET,<br> NY 10307, USA.<br> 
        </div> 
        <i class="fa fa-phone"></i>&nbsp;&nbsp;+1 123 456 7890 
       </div> 
      </div> 
<!-- Mainheader Menu Section -->  
<div class="mainheaderslide" id="slide"> 
    <div id="mainheader" class="header"> 
     <div class="menu-inner"> 
      <div class="container"> 
       <div class="row"> 
     <div class="header-table col-md-12 header-menu"> 

     <!-- Logo section --> 
     <div class="brand"><a href="#home" class="nav-link">The <span> Spice </span>Lounge</a></div> 
     <!-- // Logo section --> 

<!-- Home Page Menu section --> 
         <nav class="main-nav"> 
         <a href="#" class="nav-toggle"></a> 
          <ul id="home_nav" class="nav"> 
          <li><span class="nav-link selected1">Main</span></li> 
          <li><a href="#about" class="nav-link">About</a></li> 
          <li><a href="#" class="nav-link">Menu<span class="sub-toggle"></span></a> 
           <ul class="submenu"> 
           <li><a href="#" class="panel">Menu 1 <i class="pull-right fa fa-angle-right direction"></i> <span class="sub-toggle"></span></a> 
            <ul> 
            <li><a href="#menuwithoutimage2" class="nav-link">Menu without image2</a></li> 
            <li><a href="#menu1" class="nav-link">Menu without image</a></li> 
            <li><a href="#menu2" class="nav-link">Menu with image (Big)</a></li> 
            <li><a href="#menu3" class="nav-link">Menu with image (small)</a></li> 
            </ul> 
           </li> 
           <li><a href="#menu4" class="nav-link">Menu pdf</a></li> 
           <li><a href="#menu5" class="nav-link">Menu Toggle</a></li> 
           <li><a href="#special" class="nav-link">Today Specials</a></li> 
           <li><a href="#weeklymenu" class="nav-link">Weekly Menu</a></li> 
           <li><a href="#loungebar" class="nav-link">Lounge Bar</a></li>      
           </ul> 
          </li> 
          <li><a href="#" class="nav-link">Pages<span class="sub-toggle"></span></a> 
         <ul> 
          <li><a href="#chefbio" class="nav-link">Chef-Bio</a></li> 
          <li><a href="#giftcards" class="nav-link">Gift Cards</a></li> 
          <li><a href="#locations" class="nav-link">Our Locations</a></li> 
          <li><a href="#privatedining" class="nav-link">Private Dining</a></li> 
          <li><a href="#catering" class="nav-link">Catering</a></li> 
         </ul> 
        </li> 
          <li><a href="#gallery" class="nav-link">Gallery</a></li>  
          <li><a href="#event" class="nav-link">Events</a></li> 
          <li><a href="#reservation" class="nav-link">Reservation</a></li> 
          <li><a href="#" class="nav-link">Contact<span class="sub-toggle"></span></a> 
         <ul> 
          <li><a href="#contact" class="nav-link">Contact Us</a></li> 
          <li><a href="#contactform" class="nav-link">Contact Form</a></li> 
         </ul> 
        </li>  
          </ul> 
         </nav> 
<!-- // Home Page Menu section --> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 
      <!-- // Mainheader Menu Section --> 
     </div> 
      <!-- VEGAS --> 
    <div id="vegas_page"> 
<div class="banner_bg1"> 
<div class="ban_pattern_bg3"> 
<div class="clearfix"> 
<!--Vegas slider--> 
<div class="clearfix" id="home_ban"> 
<div class="col-md-12"> 

     <div id="anchor1"></div> 
     <div id="home-fullWidth" class="clear"> 
      <div> 
       <ul class="slider-controls"> 
        <li><a id="vegas-next" class="s-next" href="#"></a></li> 
        <li><a id="vegas-prev" class="s-prev" href="#"></a></li> 
       </ul> 
      </div> 
     </div> 
     <div class="main-title title-fullWidth"> 
      <div class="title-container"> 
       <div class="welcome hideme dontHide element_from_bottom">The <span>Spice</span> Lounge</div> 
       <ul> 
        <li class="sliding_title">Come hungry. Leave happy.</li> 
        <li>Delicious Food </li> 
        <li>Best Taste Great Price</li> 
       </ul> 
      </div> 
     </div> 
     <div id="logx"></div> 
</div> 
</div> 
<!-- // Vegas slider --> 
</div> 
</div> 
</div> 
</div> 
    <!-- /VEGAS --> 
     </div> 
     </div> 

<!--About us 
=============================-->  
<div id="about" class="item" style="background-color:#999999;"> 
       <img src="assets/img/12.jpg" alt="The Spice Lounge" class="fullBg"> 
       <div class="content"> 
        <div class="content_overlay"></div> 
         <div class="content_inner"> 
<div class="row contentscroll"> 
    <div class="container"> 
      <div class="col-md-6 empty">&nbsp;</div> 
          <div class="col-md-6 content_text"> 
          <h1>About Us</h1> 
          <div class="clearfix pad_top13"> 
          <div class="col-md-6"> 
           <p class="row"> 
           <span class="bold">Specializes in Non-veg , 65, Thanthuri, Sandwich, 65 smoked sandwich.</span><br/><br/> Our team of highly qualified professionals headed by an experienced Chef. Lnim ad minim veniam, quis nostrud.<br /><br /> 

Exercitation ullamco laboris nisi ut aliquip ex ea commodo. Duis aute dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla do tempore ercitationem ut labore. et dolore magna aliqua.        </p> 
          </div> 
          <div class="col-md-6"> 
           <div class="right_content "> 
            <div class="sub_title"> 
             <h4>Opening hours:</h4> 
            </div> 

           <div class="hour_table"> 
            <table> 
             <tr> 
              <td class="days">mon - Fri</td> 
              <td>9:00am - 4:00pm</td> 
             </tr> 
             <tr> 
              <td class="days">Sat</td> 
              <td>9:00am - 2:00pm</td>  
             </tr> 
             <tr> 
              <td class="days">Sun</td> 
              <td>8:30am - 1:00pm</td>  
             </tr> 
            </table> 
           </div> 
            <div class="sub_title"> 
             <h4>book your table:</h4> 
            </div> 

           <p> 
            We welcome walk-in guests,online at<br/><br><a class="button nav-link" href="#reservation">Book table</a>        </p> 
           </div> 
          </div> 
          </div> 
          </div> 
    </div> 
       </div> 
        </div> 
     </div> 
    </div>   
<!-- // About us 

============================= ->

To trochę kodu, aby zilustrować, jak motyw jest zaprojektowany, w rzeczywistości div z identyfikatorem, który reprezentuje stronę.

Oto link do szablonu

http://www.accurathemes.com/tf/The_Spice_Lounge/v_1_2/site/white-version/index-vegas-another-version.htm

będę naprawdę wdzięczny za pomoc jak po wyszukaniu się dużo stackoverflow jest moja ostatnia nadzieja :)

Pozdrowienia Raheel

+0

Czy możesz zamieścić więcej informacji o tym, jak to się robi? Mam do czynienia z tym samym problemem i chcę wiedzieć, jak zacząć –

+0

Co zrobiłem, zrobiłem pojedynczy plik index.php i użyłem funkcji get_pages do przechodzenia przez wszystkie strony. Na mojej stronie index.php mam elementy div, takie jak div # home, div # about itd., Więc w mojej pętli udało mi się umieścić zawartość strony w odpowiednim div. Reszta odbywa się za pośrednictwem przesuwania jquery i wszystkich innych. –

+0

OK, które mają sens. Jak mogę uczynić część każdej strony zmienną (głównie tekst) z konsoli wordpress? –

Odpowiedz

2

Możesz rozwijać tę stronę strony w WordPress za pomocą tej wtyczki WordPress: https://wordpress.org/plugins/page-scroll-to-id/

+1

Przekonałem go, oddzielając wszystkie divy na strony w wordpress admin i index. php get_pages function. Reszta pracy jest już obsługiwana przez javascript. dzięki –

+0

Cieszę się, że pomogło ... :-) –

Powiązane problemy