Over 100 millioner forbrukere bruker smarttelefonene sine til å surfe på internett i henhold til com.score Inc. Lær hvordan du lager et mobilnettsted spesielt for mobilpublikummet. For denne opplæringen trenger du dreamweaver CS5 og oppover. Denne artikkelen beskriver hvordan du oppretter et jquery -mobilnettsted.
Trinn
Trinn 1. Åpne Dreamweaver og gå til fil> Ny
Du vil da se et "Nytt dokument" -vindu. På venstre side vil du velge alternativet "side fra prøve", og deretter velge "mobile startere" og deretter "jQuery Mobile (CDN)" i neste kolonne.
Trinn 2. Lag sidene
Når du har åpnet jQuery Mobile (CDN) -filen, vil du se en side som ligner på denne:
Selv om dette teknisk sett er et dokument på én side, representerer hvert topptekst en annen "side". For eksempel er "Side en" hjemmesiden for mobilnettstedet, "Side to" kan være siden om oss, "Side tre" kan være tjenestesiden din og så videre
Trinn 3. Se på koden
Disse trinnene kan være ganske vanskelige hvis du ikke er kjent med grunnleggende HTML. For å lage innholdet, prøv å jobbe i "delt visning" på Dreamweaver. Hvordan komme til den modusen er hvis du ser på venstre hjørne av Dreamweaver, under filmenyen, vil du se fire alternativer "kode, dele, designe og leve" slik:
Velg det uthevede alternativet "delt", og du vil se en visning av koden og det faktiske nettstedet side om side. Ta en titt på koden
Trinn 4. Rediger overskriftene for hver side
Det er (div data-role = "side"), noe som betyr at det er begynnelsen på en ny side. Vær oppmerksom på at hver side er knyttet til et nummer 'div data-role = "page"' er den andre siden, 'div data-role = "page"' er den tredje siden og så videre
'div data-role = "header"' er topptekstområdet, og du plasserer headerinformasjonen mellom de to "h1" og "/h1" taggene.
Trinn 5. Rediger innhold og menyelementer
'div data-role = "Content"' er begynnelsen på innholdsseksjonen. Det er her du legger det faktiske innholdet på hver side. Vær oppmerksom på at på den første siden er det:
-
og hvis du ser på selve websiden, ser du at den første siden har en liste med lenker. 'ul data-role = "listview"' betyr at du vil ha en liste med lenker i innholdsområdet. Når du legger til menyelementer eller 'data-role = "listview"', må du sørge for å koble riktig tekst til de riktige sidene. For eksempel hvis side to er "Om oss", side tre er "Vår tjeneste", og side fire er "Kontakt oss", så vil du sette:
Lag et mobilnettsted med Dreamweaver Trinn 5 Bullet 1 -
For å redigere innhold, legg inn teksten din enkelt mellom "div data-role =" content ""-og "/div"-taggene. For eksempel:
Lag et mobilnettsted med Dreamweaver Trinn 5 Bullet 2
Trinn 6. Rediger bunnteksten
Hvis du vil redigere bunnteksten, setter du bare teksten din i stedet for "Sidefot" -teksten.
Trinn 7. Ta en titt på nettstedet ditt i "live -modus"
Husker du hvor du byttet til "delt modus?" akkurat i det området, er det en knapp som sier "live". Klikk på det, så ser du hvordan nettstedet ditt vil se ut på en telefon!
