Kuidas luua Dreamweaveri abil mobiili veebisaiti

Vastavalt com.score Inc. andmetele kasutab enam kui 100 miljonit tarbijat oma nutitelefoni Internetis sirvimiseks. Siit saate teada, kuidas luua mobiilisaiti spetsiaalselt mobiilivaataja jaoks. Selle õpetuse jaoks vajate Dreamweaver CS5 ja uuemat versiooni. Selles artiklis kirjeldatakse üksikasjalikult jquery mobiiliveebisaidi loomist.

1
Avage Dreamweaver ja valige fail > Uus. Seejärel näete akent “Uus dokument”. Vasakpoolses servas soovite valida suvandi “lehekülg näidisest”, seejärel järgmises veerus “mobile Starters”, seejärel “jQuery Mobile (CDN)”.

2
Looge lehed. Kui avate jQuery Mobile’i (CDN) faili, näete lehte, mis näeb välja sarnane: kuigi see on tehniliselt üheleheküljeline dokument, tähistab iga päis erinevat “lehte”. Näiteks “Page One” on mobiiliveebisaidi avaleht, “Page Two” võib olla meie kohta käiv leht, “Page Three” võib olla teie teenuste leht ja nii edasi.

3
Vaadake koodi. Need sammud võivad olla üsna keerulised, kui te ei tunne lihtsat HTML-i. Sisu loomiseks proovige Dreamweaveris töötada jagatud vaates. Sellele režiimile pääseb siis, kui vaatate Dreamweaveri vasakpoolset nurka, failimenüü all, näete nelja valikut “kood, poolitamine, kujundamine ja otseülekanne” järgmiselt: valige esiletõstetud valik “split” ja näete koodi ja tegelikku saiti kõrvuti. Heitke pilk koodile.

4
Redigeerige iga lehe päiseid. Seal on (div data-role=”page” id=”leht”), mis tähendab, et see on uue lehe algus. Pange tähele, et iga leht on seotud numbriga ‘div data-role=”page” id=”page2″‘ on teine ​​leht, ‘div data-role=”page” id=”page3″‘ on kolmas leht ja nii ‘div data-role=”header”‘ on päiseala ja te asetate oma päise teabe kahe märgendi “h1” ja “/h1” vahele.

5
Muutke sisu ja menüü üksusi. ‘div data-role=”Sisu”‘ on sisujaotise algus. Siia paned iga lehe tegeliku sisu. Pange tähele, et esimesel lehel on:ja kui vaatate tegelikku veebilehte, näete, et esimesel lehel on linkide loend. ‘ul data-role=”listview”‘ tähendab, et soovite sisualale linkide loendit. Menüüüksuste või ‘data-role=”listview”‘ lisamisel veenduge, et lingite õige teksti õigete lehtedega . Näiteks kui leht teine ​​on “Teave meist”, kolmas leht on “Meie teenus” ja leht neljas on “Võtke meiega ühendust”, siis soovite lisada: Nüüd sisu redigeerimiseks pange lihtsalt tekst “div andmerolli” vahele. =”content”” ja “/div” sildid. Näiteks:

6
Redigeerige jalust. Jaluse muutmiseks pange lihtsalt oma tekst “Lehe jaluse” teksti asemele.

7
Heitke pilk oma veebisaidile reaalajas režiimis. Kas mäletate, kus lülitasite jagatud režiimi? just selles piirkonnas on nupp, mis ütleb “otse”. Klõpsake sellel ja näete, kuidas teie veebisait telefonis välja näeb!