Introduktion till Webflow - Webflow hjälp
Lär dig navigera i Webflow.
I Webflow kan du strukturera, bygga och designa din webbplats över sidor, grenar och lokaler. Webflow ger dig möjlighet att skapa och hantera dynamiskt innehåll och data effektivt och erbjuder verktyg för att analysera och optimera webbplatsens prestanda. Du kan också dela ditt arbete, be om feedback och slutligen publicera din webbplats till dedikerade miljöer (dvs. staging och produktion).
Du kan komma åt Webflow från Dashboard genom att klicka på din webbplats miniatyrbild eller från Webbplatsinställningar genom att klicka på Öppna webbplats i den övre verktygsfältet. De verktyg du har tillgång till i Webflow varierar beroende på din webbplatsroll (t.ex. granskare, innehållsredigerare, etc.), så att du snabbt kan komma åt de verktyg du behöver — och glömma de verktyg du inte behöver.
Innan du börjar
Kontrollera Webflows stödda webbläsare, enheter och skärmupplösningar.
Samarbete med flera användare
Flera teammedlemmar kan samarbeta på en webbplats tillsammans i Webflow. För att hålla designprocessen smidig kan du överlämna designkontroll mellan dina teammedlemmar och se var andra arbetar inom din webbplats i realtid.
Översikt över Webflow-gränssnittet
När du öppnar din webbplats i Webflow är huvudskärmen som visar din webbplats canvasen. Runt canvasen finns följande verktygsfält och paneler:
- Övre fältet inkluderar fliknavigering, kontextfältet och webbplatsåtgärder (t.ex. samarbets- och publiceringsverktyg).
- Canvasfältet inkluderar ångra/gör om, brödsmulenavigering, utökade brytpunkter och canvasinställningar.
- Vänstra verktygsfältet inkluderar huvudmenyn, olika verktygs- och navigeringspaneler, inställningar, webbplatsgranskning och handledningar.
- Högra verktygsfältet inkluderar elementstilar, inställningar och interaktioner.
Canvasen
Det största området i Webflow är canvasen. Här kan du interagera med sidan och designa i realtid. Du kan välja element, flytta dem och redigera innehåll direkt på sidan. Webflow sparar ditt arbete automatiskt, men du kan spara din webbplats manuellt genom att trycka på Command + S (på Mac) eller Control + S (på Windows).
Övre fältet
Övre fältet ger dig snabb tillgång till designlägen, CMS, Analysera, Optimera, språk, en sidväxlare och webbplatsåtgärder.
Huvudfliknavigeringen inkluderar Design-fliken, CMS-fliken och Insikter-fliken.
- Designflik — Denna flik visar aktuellt läge (t.ex. design, bygg, etc.) och låter dig växla mellan lägen eller skapa en sidgrenar. En medlems webbplatsroll bestämmer vilka lägen som är tillgängliga. Till exempel kan webbplatschefer och designers komma åt designläget, medan marknadsförare endast kan komma åt byggläget.
- CMS-flik — Öppnar CMS (Content Management System) panelen, där du kan skapa och hantera Samlingar, Samlingselement och E-handelsprodukter och kategorier.
- Insiktsflik — Öppnar Insiktspanelen, där du kan komma åt Analysera och Optimera. Analysera ger webbplatsövergripande analys med handlingsbara insikter. Optimera låter dig köra experiment på din webbplats för att testa olika stilar, layouter, flöden, formuleringar, bilder och mer.
Kontextfält
Kontextfältet låter dig hantera webbplatsoptimeringar med Optimize och växla mellan språkversioner, sidor, samlingens sidor och samlingens objekt. Det visar också när du redigerar huvudkomponenten (snarare än en komponentinstans), samt designens godkännandestatus.
Webbplatsåtgärder
Webbplatsåtgärder är relaterade till den specifika sidan du är på eller själva webbplatsen. Teammedlemmar som samarbetar på webbplatsen i realtid listas också här med en avatar eller antal.
- Analyseringsläge — Få analyssida-nivåanalys och insikter (t.ex. hur långt besökare rullar och var de klickar).
- Kommentarer — Granska kommentarer som andra teammedlemmar lämnat eller lägg till din egen feedback/anteckningar.
- Förhandsgranska — Växla till förhandsgranskningsläge.
- Dela — Generera en skrivskyddad webbplatslänk.
- Publicera — Publicera din webbplats.
Canvasfältet
Canvasfältet är som standard placerat ovanför canvasen, men du kan flytta det nedanför i canvasinställningarna.
- Ångra/gör om ikoner — Snabb återställning eller återanvändning av ändringar.
- Navigering med brödsmulor — Visar elementhierarkin för det valda elementet.
- Canvasinställningar — Olika alternativ (t.ex. linjaler, guider, textzoomförhandsvisning).
- Brytpunkter — Förhandsgranska och redigera för olika enhetsstorlekar.
Verktygsfältet till vänster
Innehåller huvudmenyn och paneler för webbplatsstrukturering.
Klicka på Webflow-logotypen för att komma åt huvudmenyn.
- Snabbsökning för element, komponenter, sidor, etc.
- Ångra/gör om åtgärder
- Exportera kod
- Kortkommandon
- Öppna CSS-förhandsvisning
- Få hjälp eller skicka feedback
Paneler och webbplatsaktivitetslogg
- Lägg till panel — Kortkommando: A
- Sidpanel — Kortkommando: P
- Navigeringspanel — Kortkommando: Z
- Komponentpanel — Kortkommando: Shift + A
- Variabelpanel — Kortkommando: G
- Stilväljarepanel — Kortkommando: J
- Tillgångspanel — Kortkommando: L
- Bibliotekspanel — Kortkommando: L
- Appspanel — Kortkommando: E
- Webbplatsaktivitetslogg — Designändringar gjorda på din webbplats
Inställningar, AI-lärarassistent, granskningar, snabbsökning och handledningar
- Inställningspanel — Gränssnitt, sökning, säkerhetskopiering, lokalisering.
- AI-lärarassistent — AI-driven hjälp.
- Granskningspanel — Kortkommando: U.
- Snabbsökning — Kortkommando: Command + E (Mac), Control + E (Windows).
- Videohandledningspanel — Gratis videokurser.
Den högra verktygsfältet
Innehåller paneler för elementstilar, inställningar och interaktioner.
- Stilpanel — Genväg: S.
- Elementinställningspanel — Genväg: D.
- Interaktionspanel — Genväg: H.
FAQ
Vilka webbläsare stöder Webflow?
Webflow stöder officiellt de tre senaste huvudversionerna av alla moderna webbläsare: Chrome, Edge, Firefox och Safari. Detta gäller både plattformen och publicerade webbplatser.
För funktioner med begränsat stöd, se relaterade artiklar:
Webflow stöder inte Internet Explorer.
Vilka skärmupplösningar/enheter stöder Webflow?
Webflow kräver en stationär/bärbar dator med en skärmbredd på minst 1268px.
Varför är Webflow en online/värdtjänst-app — varför inte en nedladdningsbar app?
Webflow är online/värdtjänst för att möjliggöra design i webbläsaren och snabba uppdateringar.
- WYSIWYG design — direkt effekt på HTML/CSS.
- Snabba uppdateringar — Alltid den senaste versionen, inga manuella uppdateringar.