Så redigerar du mobilversionen av din webbsida

Alla webbsidor/delsidor du skapar via Smartfunnel får automatiskt en mobilanpassad och en surfplatte-anpassad version utan att du behöver göra något. Hos Smartfunnel finns alltså tre vyer:

Du växlar mellan de olika vyerna genom att klicka på någon av de tre ikoner som finns längst ner i gränssnittet.

Nej, det behöver du inte. När du redigerar utan att ha bytt gränssnitt, då redigerar du datorversionen. Smartfunnels byggare anpassar automatiskt så surfplatte- och mobilvyn ska se bra ut, men du kan förstås göra ändringar i surfplatte- och mobilläget om du vill.

Men tänk på att alltid redigera i datorvyn först. Först när du är nöjd med den kan du redigera surfplatte- och mobilvyn, men det behövs sällan.

När du är i mobilvyn kan du se följande inställningsalternativ:

1. Dölj blocket på alla vyer. Blocket döljs på mobil, surfplatta och dator.

2. Förskjut inladdning. Används främst för att ge block en "pop-in-effekt".

3. Flytta blocket nedåt.

4. Flytta blocket uppåt.

5. Vänd om innehållet. Kolumnen längst ner i blocket hamnar högst upp och så vidare.

6. Utsträckt. När du bockat för denna inställning sträcks innehållet ut för att passa mindre skärmar. Du ska nästan alltid ha bockat för denna inställning, för om du bockar ur den är risken stor att text trycks ihop och/eller visas utanför skärmen.

7. Dölj hela kolumnen på surfpattor, men visa den på mobil och dator.

8. Dölj hela kolumnen på mobil, men visa den på surfpatta och dator.

Gällande punkt 7 och 8: Tänk på att det nästan aldrig är bra att dölja sektioner för bara en brytpunkt, såsom mobil eller surfplatta. Det är i normalfallet dåligt för både användarvänligheten och för SEO.

Du kan redigera mobilvyn på tre sätt, och dessa berättar vi om här nedan.

1. Klicka på penselikonen för att komma till Globala stilar. Tryck därefter på Textstil.

2. Välj att redigera mobilversionen genom att klicka på mobiltelefonen.

3. Nu kan du börja redigera rubriker och paragraftext. Rubrikerna går från H1-H6 och brödtext (normal text) ställs in genom att klicka på Paragraftext.

Just nu redigerar du rubrikerna för mobiltelefoner, så de ändringar du gör här gäller inte för dator-vyn. Tänk på att inte göra till exempel H1-rubrikerna för små, för dessa inställningar påverkar alla H1-rubriker för mobilvyn som du har på sidan.

Bästa praxis är att H1 ska vara störst, sen H2, sen H3 osv. Om du bryter rubrikhierarkin, exempelvis genom att göra H2 större än H2, förvirrar du både sökmotorer och dina användare.

Upplysningsvis är det bara inställningarna för mobiler du kan justera när du är i detta läge. Datorversionen har sin egen styling som inte kan skrivas över av den styling du gör för mobiltelefoner.

För varje rubrik, och för paragraferna, kan du ändra:

Du kan också lägga till widgets i mobilvyn, alltså widgets som då bara syns i mobiler. En populär widget att lägga till i mobilvyn är avståndsbrickan. Gör så här för att lägga till widgets i bara den mobila vyn:

1. Gå till den mobila vyn genom att klicka på mobiltelefonen längst ner i gränssnittet.

2. Lägg till de widgets som bara ska synas på mobiler, såsom Avståndsbrickan.

3. Efter du lagt till widgeten, i detta fall avståndsbrickan, ser du att den fått en mobil-ikon på sig. Den ikonen berättar att widgeten bara syns på mobiler.

Genom att lägga till ett block när du är i mobilläget, kan du skapa en sektion som bara syns på mobiler. Du kan lägga till ett nytt block direkt via mobilvyn:

Alternativt kan du klistra in ett kopierat block från datorvyn:

De block du skapar i det mobila läget kan du göra hur stort du vill. Du kan alltså lägga till hur många widgets du vill, och du kan även lägga till färdigskapade designer från vårt designbibliotek.

Det block du lagt till i mobilläget är markerat som Endast mobil i byggaren, vilket är bra då man tydligt ser vilka block som tillhör vilken vy.