Mobilvenligt
Sektionerne bruger moderne CSS Grid og falder naturligt sammen på små skærme.
Fra WWB20 til Din HP
Et lettere udgangspunkt
Layoutet beholder den store billedheader og følelsen af bevægelse, men bruger kun almindelig HTML, CSS og et meget lille JavaScript til parallax.
Den lette udgave
Det vigtigste er bevaret
Egne billeder
Billeder uploades gennem admin, genkodes og indsættes direkte i editoren.
Let kode
Ingen jQuery, jQuery UI, Skrollr, Font Awesome eller WWB-runtime på testsiden.
Native HTML
Spørgsmål om testen
Er parallax-funktionen bevaret?
Ja. Hero-billedet bevæger sig diskret ved scroll, men funktionen er omskrevet til et lille selvstændigt script.
Bliver billeder gemt sikkert?
Upload kræver admin-login og CSRF-token. Filen valideres som et rigtigt billede, skaleres og genkodes med et tilfældigt filnavn.
Er dette den færdige Din HP-editor?
Nej. Det er en isoleret test af layout, parallax og billedflow, så funktionerne kan afprøves uden at påvirke resten af P-Media.
Layoutets redigerbare område
Web Design
Skriv en kort og tydelig tekst om emnet, virksomheden, produktet eller den lokale historie. Billedet og al tekst kan redigeres direkte efter indsættelse.
Web Design
Skriv en kort og tydelig tekst om emnet, virksomheden, produktet eller den lokale historie. Billedet og al tekst kan redigeres direkte efter indsættelse.
Tekst og billeder fra P-Media-editoren
Dette område redigeres med den eksisterende openWYSIWYG-editor. Smiley- og templateknapperne kan bruges som i artikel-editoren.
“Bevar den gode idé – fjern det, der gør siden tung.”
Uploadede billeder kan indsættes ved markøren og bliver automatisk gjort responsive på testsiden.
Næste trin
Test først – byg videre bagefter
Når parallax, mobilvisning, billedupload og redigering fungerer stabilt, kan layoutet blive en rigtig Din HP-template.