Bygga en hemsida i WordPress [Guide 2023]

hemsida i wordpress cover

Innehållsförteckning

Såhär bygger du en hemsida i Wordpress. Steg för steg från webbhotell till publicerad hemsida.

Även om det finns enklare lösningar så är det fortfarande en strålande idé att bygga en hemsida i WordPress 2023. WordPress är världens mest använda CMS och står för mer 43% av alla hemsidor på internet!

För att bygga en hemsida i WordPress kommer du behöva lösa följande:

  1. Köpa domän
  2. Webbhotell
  3. Installera WordPress på din server
  4. Välja ett tema
  5. Göra grundinställningar på WordPress
  6. Installera lämpliga tillägg
  7. Bygga din startsida
  8. Bygga resterande sidor
  9. Bygga sidhuvud och sidfot

Både webbdesign.io och flingor.se är byggda i WordPress med sidbyggaren Elementor Pro. Båda använder temat Astra, men temats inverkan är relativt låg eftersom Elementor Pro erbjuder mycket designmöjligheter.

En domän är en webbadress som besökare går till för att hitta din hemsida. Alla hemsidor på internet befinner sig på en webbadress, de kan inte existera i tomma intet. Innan du börjar bygga din hemsida i wordpress behöver du alltså en domän.

Vissa webbhotell erbjuder gratis domäner som du kan testa med, men dessa är sällan lämpliga att faktiskt publicera din hemsida på. 

Så gott som alla webbhotell erbjuder tjänsten att köpa domän, så vi rekommenderar att du köper domänen via det webbhotellet du väljer. Det blir då enklare eftersom du kan hantera domän och WordPress hos samma leverantör.

  1. Bestäm vilken domän du vill använda: Det första steget är att välja en passande domän för din hemsida i wordpress. Det är viktigt att välja en domän som är kort, lätt att stava och som representerar ditt varumärke eller verksamhet på ett tydligt sätt.
  2. Kontrollera att domänen är tillgänglig: Det kan vara svårt att hitta det perfekta domännamnet, och när du känner att du kommit på en snilleblixt är den adressen kanske upptagen. Förutom att söka tillgänglighet hos domänleverantören kan du kolla in who.isNär du söker på en domän kan du se när rättigheterna för domänen kommer att upphöra (endast om ägaren inte väljer att förnya domänen). Med lite tur kan lyckas knipa en domän som så småningom blir ledigt! (Jag har själv lyckats med det.)
  3. Köp domänen: När du har hittat en domän som är tillgänglig och som du vill köpa måste du skapa ett konto hos domänregistraren och slutföra köpet. Detta kräver vanligtvis att du anger din kontaktinformation och betalar för domänen.
  4. Konfigurera DNS-inställningar: Om du köpt domänen hos ditt webbhotell behöver du antagligen inte ändra i dina DNS-inställningar för detta. Om domänen ligger hos en annan leverantör behöver du säga åt domänen var din hemsida ligger lagrad (webbhotellet). Läs denna guide där de går igenom hur du gör. Det kan ta upp till 24 timmar för DNS-inställningarna att uppdateras.

Webbhotellet är den fysiska platsen där din hemsida faktiskt ligger lagrad. Hemsidor är precis som alla andra program uppbyggt av filer, och dessa filer måste förvaras på en server (dator). Varje gång du bygger på din hemsida i WordPress så ändrar du på filerna som ligger på webbhotellets server.

  1. Välj ett webbhotell: Det finns många olika webbhotell på marknaden, och det är viktigt att välja en som erbjuder pålitliga tjänster, bra kundsupport och rimliga priser. Faktum är att när du väl valt ett webbhotell ska det mycket till för att du ska orka gå igenom processen att byta. I Sverige har vi dock flera bra webbhotell att välja på!
  2. Välj en prisplan: När du har valt ett webbhotell är det dags att köpa din tjänst. Alla webbhotell erbjuder olika nivåer på prestanda, och du behöver välja ett som passar ditt projekt. Om du ska bygga en liten hemsida till ditt företag kommer antagligen deras billigaste alternativ vara gott nog.
  3. Konfigurera ditt webbhotell: När du har köpt din tjänst måste du konfigurera den. Detta innebär vanligtvis att du loggar in på ditt webbhotellskonto och konfigurerar dina inställningar. Moderna webbhotell gör detta enkelt och har både guider och interna verktyg för att hantera din server.

Här är en kompakt lista över faktorer som du bör kolla på när du jämför webbhotell:

  1. Uptime: Se till att webbhotellet garanterar hög uptime och minimalt med downtime. Det kan kännas trivialt eftersom de flesta webbhotellen garanterar en uptime över 99%, men skillnaden på 99% och 99,5% är 43 timmar och 48 minuter per år! Tänk om din hemsida skulle ligga nere en hel arbetsvecka 😣
  2. Lagringsutrymme: Det som påverkar hur mycket lagringsutrymme du behöver är din hemsidas storlek. De mest avgörande faktorerna är antal bilder, videoklipp, ljudklipp, filer, tillägg, antal sidor på hemsidan, funktioner som databaser, forum eller e-handelsplattformar som kräver extra lagringsutrymme.
  3. Bandbredd: Bandbredd är ett mått på hur mycket data du kan skicka och ta emot samtidigt. Tänk dig att du har tio besökare samtidigt. Bandbredden tillåter att alla tio kan ladda hemsidan samtidigt utan att det blir överbelastat. Två avgörande faktorer är alltså din hemsidas storlek och antal besökare du har samtidigt. En liten hemsida med många besökare kan kräva lika mycket bandbredd som en stor hemsida med få besökare.
  4. Kundsupport: Se till att webbhotellet erbjuder tillgänglig och kvalitativ kundsupport, helst dygnet runt. Tänk att webbhotellet är lite som en hyresvärd. Om något börjar strula, eller om du blir utelåst, vill du kunna komma i kontakt med dem snabbt.
  5. Pris: Detta blir en balansgång mellan prestanda och pris. Många erbjuder ett lägre pris för en initial period, men gör en överslagsräkning på flera år eftersom du antagligen kommer att behålla tjänsten över en längre tid.
  6. Säkerhet: Se till att webbhotellet har rimliga säkerhetsfunktioner, såsom SSL-certifikat, för att skydda din webbplats och data.

När man ska hitta ett webbhotell till sin första hemsida i wordpress, är det vanligtvis lämpligt att välja ett webbhotell med minst 10 GB lagringsutrymme och 100 GB bandbredd. Kundsupporten bör vara tillgänglig dygnet runt och priset bör vara rimligt, vanligtvis runt 50-150 kr per månad.

softaculous hemsida i wordpress

Alla vettiga webbhotell har verktyg för att installera CMS, vilket gör det relativt enkelt att komma igång. Vissa använder kontrollpanelen cPanel och alla dess funktioner, medan andra har sin egna kontrollpanel.

Vi kommer använda cPanel och Softaculous som exempel, men principen kommer vara snarlik oavsett verktyg som ditt webbhotell erbjuder.

  1. Logga in på din cPanel (eller annan kontrollpanel) hos ditt webbhotell.
  2. Klicka på Softaculous Apps Installer-ikonen. Detta kan hittas under avsnittet ”Software” eller ”Webbplatsverktyg” i din cPanel.
  3. Klicka på WordPress-ikonen för att starta installationsprocessen.
  4. Välj ”Installera” för att börja installera WordPress.
  5. Fyll i grundläggande information för din WordPress-installation, inklusive val av webbadress, namn på webbplatsen och beskrivning.
  6. Konfigurera din admin information, inklusive användarnamn och lösenord.
  7. Välj om du vill installera några WordPress-teman eller plugins vid installationen. Du kan lägga till dem senare om du vill.
  8. Klicka på ”Installera” -knappen för att starta installationsprocessen.
  9. När installationen är klar kommer du att se en bekräftelse. Klicka på ”Slutför installationen” för att slutföra processen.
  10. Gå till din WordPress-webbplats och logga in med dina nya inloggningsuppgifter för adminpanelen.

Det är allt! Du har nu installerat WordPress på din server genom Softaculous.

wordpress tema hemsida i wordpress

WordPress-adminpanelen är platsen där du hanterar allt innehåll och utseende på din webbplats. För att komma åt adminpanelen, logga in på din hemsida genom att skriva in ”/wp-admin” efter webbadressen i din webbläsare och logga in med dina inloggningsuppgifter. Så till exempel www.exempel.se/wp-admin.

När du är inloggad kommer du att se adminpanelens startsida. Därifrån kan du navigera till de olika delarna av adminpanelen, till exempel Inlägg, Sidor, Utseende och Inställningar (posts, pages, apparence och settings om det är på engelska).

Innan vi börjar göra inställningar är det lämpligt att aktivera ett tema som du vill använda. Ett WordPress-tema definierar utseendet och funktionaliteten på din webbplats. Temat bestämmer allt från färgschema, typsnitt och layout till funktionalitet och interaktion. Temat är alltså en viktig faktor för hur din webbplats presenteras för besökare, och kan också påverka hur lätt det är att navigera på din webbplats. Det kan också påverka webbplatsens hastighet och prestanda.

Hur pass bunden du är till temat kommer också bero på om du använder WordPress egna sidbyggare eller en extern sidbyggare som Elementor. WordPress egna sidbyggare är mer begränsade i sin designflexibilitet, medan en extern sidbyggare som Elementor ger användarna möjlighet att skapa mer anpassade layouter och designalternativ.

Detta innebär att om du använder WordPress egna sidbyggare, kan temat ha mer inverkan på webbplatsens utseende eftersom sidbyggaren är mer begränsad. Medan en extern sidbyggare som Elementor ger användarna större frihet att ändra webbplatsens utseende och känsla, vilket kan minska temats inverkan.

För att välja och aktivera ett WordPress-tema, gör du följande:

  1. Klicka på ”Utseende” i adminpanelens vänstermeny.
  2. Klicka på ”Teman” i undermenyn som visas.
  3. På den här sidan kommer du att se en lista över de teman som redan är installerade på din WordPress-webbplats. Du kan också söka efter nya teman genom att klicka på ”Lägg till nytt tema” längst upp på sidan.
  4. Bläddra igenom teman genom att klicka på ”Detaljer och förhandsvisning” för att se en förhandsgranskning av temat. Du kan också filtrera teman efter funktioner och layout.
  5. När du har hittat ett tema som du vill använda, klicka på ”Installera” för att installera temat.
  6. Efter installationen klickar du på ”Aktivera” för att göra det aktiva temat.

Om du planerar att bygga en normal hemsida i WordPress med sansade funktioner bör du prioritera ett lätt tema som har snabb prestanda. Om du ska bygga en mer komplicerad hemsida med funktioner som e-handel, LMS, tidsbokning m.m. kan det finnas teman som passar bäst för just din funktion. Bra teman är:

  • Astra
  • Hello
  • Soledad
  • Hestia
  • Divi
  • Storefront

Innan du börjar bygga och installera tillägg är det lägligt att ändra några inställningar i WordPress och ditt tema.

  1. Permalänkar: Gå till Inställningar > Permalänkar och välj den struktur för dina permalänkar som du önskar. Permalänkar är enkelt förklarat vilka webbadresser dina nya sidor kommer skapas under. En logisk permalänkstruktur kan bidra till att öka sökmotoroptimeringen och göra det enklare för användare att navigera på din webbplats. Strukturen “Inläggsnam: https://webbdesign.io/exempelinlagg/” är ett bra alternativ.
  2. Språk: För att ändra språket i WordPress till svenska går du till Inställningar > Allmänt. Det är en bra idé att ändra till Svenska eftersom vissa tillägg översätts automatiskt till Svenska för dina besökare.
  3. Webbplatsens titel och beskrivning: Gå till Inställningar > Allmänt och ändra titeln på din webbplats och beskrivning om det behövs. Detta är viktigt eftersom det är vad som kommer att visas i sökmotorerna och på webbläsarflikar.
  4. Startsida: Gå till Inställningar > Läsa för att ändra startsida för din hemsida. Initialt är “Dina senaste inlägg” förvalt som startsida, men du kan ändra detta till en statisk sida. När du senare skapar fler sidor kommer du ha möjlighet att välja dem som startsida. Se till att “Synlighet i sökmotorer: Be sökmotorer att inte indexera denna webbplats” inte är ikryssad om du vill att hemsidan ska kunna synas på Google.
  5. WordPressanvändare: Skapa nya användare om ni är flera som ska ha tillgång till hemsidan. Du kan ge olika roller och behörigheter till dina användare vilket påverkar hur mycket de kan kontrollera i adminpanelen.
  6. Anpassa tema: Detta kommer se olika ut beroende på ditt tema, men du kommer kunna anpassa vilket färgschema du vill använda, vilka typsnitt, bakgrunder, knappar med mera. Du kommer också kunna ladda upp en logga och favicon till din webbplats.

Du kan bygga en hemsida utan tillägg, WordPress är faktiskt helt funktionellt som det är. Samtidigt finns det ingen anledning till att inte använda en hälsosam mix av bra tillägg!

Vi rekommenderar att du installerar tillägg som ger dig mer kreativ kontroll, hjälper till att snabba upp hemsidan och förbättrar din SEO. Dessa är en bra start:

  1. Elementor: Elementor är en dra-och-släpp byggare för WordPress som låter användare skapa anpassade layouter och designer på sina webbsidor utan att behöva kunna koda. Det är en av de mest populära plugins för WordPress och ger användare möjlighet att skapa professionella och dynamiska sidor med minimal ansträngning.
  2. Smush: Smush är en bildkomprimeringsplugin för WordPress som kan minska storleken på bilder utan att försämra kvaliteten. Detta förbättrar webbsidans hastighet och prestanda, eftersom sidor med tunga bilder kan vara långsamma att ladda.
  3. Converter for media: Detta tillägg visar dina bilder i ett annat format än vad de egenligen är. Webp och avif är två format som är snabbare för besökare att ladda vilket leder till en bättre page speed.
  4. Hummingbird: Hummingbird är ett tillägg i WordPress som hjälper till att öka hastigheten och prestandan på webbplatsen genom att optimera caching, minimering av filer och komprimering av data. Det är ett bra verktyg för att optimera din webbplats för snabbare laddningstider och bättre SEO-resultat.
  5. Rank Math SEO: Rank Math SEO är en plugin som hjälper till att optimera din webbsida för sökmotorer genom att ge förslag på sökord, meta-tags och sitemaps. Det hjälper dig också att spåra din ranking i sökresultaten och göra justeringar för att förbättra din position.

Du kommer långt med dessa utan att belasta din hemsida speciellt mycket. För att få ytterliggare funktioner använder vi på webbdesign.io dessa också:

  1. Elementor Pro: Elementor Pro är en utökad version av Elementor med fler funktioner och mallar för användare som vill ha ännu mer flexibilitet och anpassningsmöjligheter på sin webbsida.
  2. Advanced Custom Fields: Detta är en plugin som hjälper dig att lägga till mer flexibilitet i skapandet av anpassade fält på din WordPresssida. Med Advanced Custom Fields kan du lägga till anpassade fält i inlägg, sidor, anpassade posttyper, användarprofiler och mer. Detta kan vara användbart om du vill skapa en mer anpassad webbplats med mer avancerade funktioner.
  3. Code snippets: Gör det möjligt att lägga till anpassad kod till din WordPresssida utan att behöva ändra i ditt temas filer. Detta kan vara användbart om du vill lägga till anpassade funktioner eller modifiera befintliga funktioner på din webbplats.
  4. Folders: Detta plugin gör det enklare att organisera och hantera olika filer och sidor. Med Folders kan du skapa mappar för all media, inlägg, sidor med mera för att hålla dem organiserade och enklare att hitta.
  5. Tablepress: Detta är en plugin som gör det möjligt att lägga till snygga och responsiva tabeller på din hemsida i WordPress. Med TablePress kan du skapa tabeller med data, bilder och länkar. Detta kan vara användbart om du vill visa tabellbaserad information på din webbplats, t.ex. produktbeskrivningar eller priser.

För att bygga en startsida på en WordPress-hemsida kan man använda sig av två huvudsakliga verktyg: Gutenberg eller en separat sidbyggare (som Elementor).

Gutenberg är den inbyggda redigeraren som finns i WordPress sedan version 5.0. Den låter användare bygga sidor och inlägg med hjälp av ”block”, som kan innehålla allt från text och bild till video och ljud. För att bygga en startsida med Gutenberg kan man följa följande steg:

  1. Gå till ”Sidor” i adminpanelen och skapa en ny sida som heter ”Startsida”.
  2. Klicka på ”Redigera med Gutenberg” för att öppna Gutenberg-redigeraren.
  3. Lägg till block för text, bild, video och annat innehåll genom att klicka på plus-ikonen och söka efter det block du vill använda.
  4. Använd blockinställningarna för att anpassa blocken med färger, typsnitt och andra designelement.
  5. Arrangera blocken genom att dra och släppa dem för att skapa en önskad layout.
  6. När du är nöjd med din startsida, publicera den och visa upp den på din webbplats.

Elementor är en populär och kraftfull plugin som gör det möjligt att bygga mer avancerade och anpassade sidor med WordPress. Det låter användare placera olika element på en sida och anpassa dem med hjälp av en visuell redigerare. För att bygga en startsida med Elementor kan man följa följande steg:

  1. Gå till ”Sidor” i adminpanelen och skapa en ny sida som heter ”Startsida”.
  2. Klicka på ”Redigera med Elementor” för att öppna Elementor-redigeraren.
  3. Dra och släpp element (widgets) från Elementor-biblioteket på din sida, som text, bild, knappar och andra designelement.
  4. Använd Elementor-stilinställningarna för att anpassa designen av varje element, som färger, typsnitt, marginaler och annat.
  5. Använd Elementors layoutinställningar för att arrangera elementen på sidan.
  6. När du är nöjd med din startsida, publicera den och visa upp den på din webbplats.

Både Gutenberg och Elementor kan vara användbara verktyg beroende på användarens designbehov och tekniska kunskaper. Gutenberg är inbyggt i WordPress och är enklare att använda, medan Elementor är en kraftfullare plugin som kan ge användaren mer flexibilitet och kreativ frihet.

Vi rekommenderar att du mobilanpassar hela sidan innan du påbörjar nästa. Du kommer att kunna kopiera delar från startsidan till dina andra sidor för att spara tid, och då är det bästa att allt är på sin plats.

Det är inget krav på att justera dessa, din hemsida i Wordperss kommer att fungera ändå. Den lilla tidsinvesteringen är dock helt klart värd eftersom det stärker din SEO och ger ett mer professionellt intryck om dessa saker är på plats. 

Metatitel är den titel som visas i sökresultaten när din sida visas. Det är också titeln som visas längst upp på webbläsarfönstret när sidan öppnas. En välformulerad metatitel kan hjälpa till att locka besökare till din sida och göra det lättare för sökmotorer att förstå vad din sida handlar om.

Metabeskrivning är en kort beskrivning av innehållet på sidan som visas på SERP (search engine result page) under metatiteln. Det är viktigt att inkludera relevanta nyckelord och skapa en beskrivning som lockar användaren att klicka på din länk. En väl skriven metabeskrivning kan öka klickfrekvensen och förbättra användarupplevelsen på din sida.

Utvald bild är en bild som representerar ditt innehåll och visas ofta på sociala medier och andra plattformar när din sida delas. Det är viktigt att välja en högkvalitativ bild som är relevant för innehållet och som sticker ut.

redigera mall bloggmall wordpress elementor

När du har byggt klart din startsida kan du gå vidare med resten av dina sidor. Minsta antalet sidor för ett vanligt företag brukar vara Startsida, Kontakt och Om oss. Självklart går det att kombinera sidor för att undvika att sprida ut sin information för mycket.

Det är inte lämpligt att ha separata sidor för tjänster eller områden om varje sida bara blir en paragraf lång. Eftersträva att besökaren ska utföra det minsta antalet klick på din hemsida för att hitta det den vill.

Använd sektioner och element från din redan byggda Startsida för att underlätta processen. Du vill att dina sidor ska se enhetliga ut så att kopiera in segment från tidigare sidor säkerställer också att du följer samma röda tråd.

Du kommer troligtvis vilja skapa och justera din hemsidas mallar. Mallar är en förutbestämd layout för till exempel alla dina inlägg som gör att saker som rubrik, bild och innehållsförteckning läggs till automatiskt.

Både sidhuvud och sidfot är densamma på alla dina sidor. I regel kan man säga att sidhuvudet bör innehålla din logga och din navigering. Det kan även vara lämpligt att ha en CTA högst upp i högra hörnet.

Din sidfot bör däremot innehålla din kontaktinformation, länkar till formella sidor som integritetspolicy och potentiellt länkar till sociala medier.

Innan du skapar dessa två ska du gå in i Utseende > Meny och skapa dina navigeringsmenyer. Du bör ha minst en meny som befinner sig i sidhuvudet. Du kan även skapa en meny för din sidfot om du kommer ha flera länkar. Det är smidigt att skapa menyer på detta sätt eftersom du kan ändra utseendet på hela menyn åt gången, samt att meny-widgeten innehåller användbara animationer.

Om du inte använder Elementor kommer du bygga sidhuvud och sidfot i ditt tema. Du går då in på Utseende > Anpassa. Om du använder Elementor kommer du bygga dessa två i deras Theme Builder. Med Elementor har du möjligheten att skapa flera olika varianter som du med hjälp av villkor visar på olika platser.

FAQ

WordPress är en gratis plattform för att bygga webbplatser och publicera innehåll på nätet. Det är en populär CMS (Content Management System) som används av miljontals webbplatser runt om i världen.

För att bygga en hemsida i WordPress behöver du först och främst ett webbhotell och en domän. Sedan behöver du installera WordPress på din webbhotells-server. När det är gjort kan du börja bygga din hemsida med hjälp av en WordPress-tema och plugins.

Ja, WordPress är en gratis plattform och det finns massor av gratis teman och plugins tillgängliga för användare. Men för att använda din egen domän och webbhotell behöver du betala för dessa tjänster.

WordPress är enkelt att använda och lätt att anpassa, vilket gör det till ett bra val för både nybörjare och erfarna webbutvecklare. Plattformen har också ett stort community som skapar teman och plugins som kan hjälpa dig att skräddarsy din hemsida och lägga till nya funktioner.

ctr pie chart
Lär dig förstå och förbättra din CTR för bättre digitala resultat. Följ vår lättsamma guide för att optimera din click-through rate och öka trafiken till
färg röd
Färgen röd: passion, energi, kärlek. Utforska denna primärfärgs betydelse, symbolik och användning i design och konst för en kraftfull atmosfär.
färg grå
Färgen grå: neutralitet, elegans, lugn. Lär dig om denna färgs betydelse, symbolik och användning i design och konst för en balanserad och sofistikerad känsla.
Rulla till toppen
Vi använder kakor för att göra din upplevelse bättre.