Cum să a crea un site mobil cu Dreamweaver

Peste 100 de milioane de consumatori folosesc telefoanele inteligente pentru a naviga pe internet în conformitate cu com.score Inc. Aflați cum să creați un site web mobil special pentru publicul mobil. Pentru acest tutorial, veți avea nevoie de Dreamweaver CS5 și mai sus. Vom învăța cum să creați un site mobil jquery.

Paşi

  1. Deschideți Dreamweaver și mergeți la fișier> Nou.
    1
    Deschideți Dreamweaver și mergeți la fișier> Nou. Veți vedea apoi fereastra "Document nou". În partea stângă, doriți să alegeți opțiunea "pagină din mostră", apoi în coloana următoare, alegeți "Starters mobil", apoi "jQuery Mobile (CDN)"
  2. Creați paginile.
    2
    Creați paginile. Odată ce deschideți fișierul jQuery Mobile (CDN), veți vedea o pagină care arată similar cu aceasta: deși acest document tehnic este un document de o pagină, fiecare antet reprezintă o altă pagină. De exemplu, pagina "Pagina One" este pagina de pornire pentru site-ul mobil, "Page Two" ar putea fi pagina despre noi, "pagina a treia" ar putea fi pagina dvs. de servicii și așa mai departe.
  3. Uită-te la Cod.
    3
    Uită-te la Cod. Acești pași pot fi destul de complicați dacă nu sunteți familiarizați cu codul HTML de bază. Pentru a crea conținutul, îmi place să lucrez în "vizualizare împărțită" în Dreamweaver. Cum se ajunge la acest mod este dacă vă uitați la colțul din stânga al Dreamweaver, sub meniul fișierului, veți vedea patru opțiuni "cod, split, design și live", astfel: Alegeți opțiunea evidențiată "split" și veți vedea o vizualizare a codului și a site-ului actual alăturat. Să aruncăm o privire la cod pentru o secundă.
  4. Editați conținutul și elementele de meniu.
    4
    Editați conținutul și elementele de meniu. 'div data-role = "Conținutul" este începutul secțiunii de conținut. Aici plasați conținutul real al fiecărei pagini. Rețineți că în prima pagină există: și dacă vă uitați la pagina web reală, veți vedea că prima pagină conține o listă de linkuri. 'ul data-role = "listview" înseamnă că doriți o listă a legăturilor din zona de conținut. Când adăugați elementele de meniu sau "data-role =" listview "", asigurați-vă că ați legat textul corect cu paginile corecte . De exemplu, dacă pagina a doua este "Despre noi", pagina a treia este "Serviciul nostru" și pagina 4 este "Contactați-ne" pe care doriți să o puneți: WH.shared.addScrollLoadItem ('img_fc7d69afea')
  5. Uitați-vă la site-ul dvs. web în modul "live".
    5
    Uitați-vă la site-ul dvs. web în modul "live". Amintiți-vă unde ați trecut în modul "split mode"? chiar în acea zonă, există un buton care spune "live". Faceți clic pe acesta și veți vedea cum va arăta site-ul dvs. pe un telefon!