Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Så här skapar du en website för portfölj online i WordPress

CV och LinkedIn-profiler är bra, men de räcker ofta inte för att fånga potentiella kunders och arbetsgivares uppmärksamhet.

Enligt vår erfarenhet behöver du en onlineportfölj som visar upp dina bästa arbeten på ett professionellt och engagerande sätt för att göra intryck.

Oroa dig inte om du inte är tekniskt kunnig, för vi är här för att hjälpa dig.

I den här artikeln visar vi dig steg för steg hur du skapar en portföljwebbplats online i WordPress.

How to create an online portfolio website in WordPress

Varför behöver du en website för portföljer online?

Portfolios är tillgångar för alla, inklusive frilansare, arbetssökande och småföretag.

Nu kan du se en onlineportfölj som ditt digitala visitkort.

Till exempel, var du än träffar dina potentiella kunder kan du enkelt hänvisa dem till din portföljwebbplats. Så istället för att leta efter tidigare arbetsprover kan du tryggt skicka dina potentiella kunder eller framtida arbetsgivare till din fantastiska onlineportfölj.

Example of portfolio website

Du kanske tror att en portfölj bara är till för konstnärer eller kreatörer, men det är helt enkelt inte sant.

Det fungerar för alla yrken, oavsett om du är grafisk formgivare, skribent eller utvecklare, och det ger dig en chans att visa framfötterna i din bransch.

I ett nötskal kan din portföljwebbplats hjälpa dig att sticka ut från mängden och bygga förtroende. När du designar en professionell portföljwebbplats får du omedelbart trovärdighet och visar upp din erfarenhet.

Du kan också optimera din webbplats för sökmotorer baserat på specifika sökord så att fler människor kan hitta dig.

💡 Har du ont om tid men behöver en fantastisk portföljwebbplats för ditt företag? WPBeginner Pro Services kan hjälpa dig! Vi tar hand om allt från design till SEO och levererar en skräddarsydd portföljwebbplats som är anpassad efter dina behov. Få våra tjänster för WordPress-webbplatsdesign idag!

Med detta i åtanke berättar vi hur du skapar en portföljwebbplats online i WordPress.

Är du redo? Låt oss komma igång.

Så här skapar du en website för portföljer online i WordPress med SeedProd

You behöver inte lära dig att koda eller skriva HTML för att bygga din site för portföljen. Följ bara våra Step-by-Step-instruktioner så kommer din website att vara igång på några minuter.

1. Välj ett webbhotell för WordPress

För att komma igång behöver du ett domännamn och ett webbhotell. Webbhotellet lagrar dina webbplatsfiler och är din webbplats hem på internet.

Ett bra webbhotell ska vara tillräckligt skalbart för att hantera krävande webbplatser, erbjuda support om något går fel, ta webbsäkerhet på allvar och ha funktioner för att skydda dig.

Du bör också leta efter de snabbaste WordPress-hostingleverantörerna, vilket hjälper din webbplats att ladda snabbt.

Hostinger är det bästa valet för småföretag som vill ha en prisvärd och nybörjarvänlig hosting.

Lyckligtvis har Hostinger gått med på att erbjuda våra läsare ett gratis domännamn och en enorm rabatt på WordPress-hosting. Du kan komma igång för bara 2,24 USD per månad.

Click Start Now on the Hostinger website

För att komma igång med Hostinger på några minuter klickar du bara på den här knappen:

Om du behöver hjälp med att registrera dig för Hostinger, kolla in vårt inlägg om hur du får ett gratis domännamn, där du hittar en steg-för-steg-guide.

När du har registrerat och konfigurerat ditt webbhotell kan du bara gå in i din dashpanel och välja tabben ”Domäner”.

Därefter måste du ange ett new domain name.

Hostinger get a domain

Du uppmanas sedan att skapa en ny eller migrera en befintlig webbplats.

För denna handledning kan du klicka på ”Hoppa över, skapa en tom webbplats”.

Skip website hostinger

Därefter klickar vi på knappen ”Välj” under ”Gör anspråk på en gratis domän”.

Du kan helt enkelt ange det domännamn du vill ha för din portföljwebbplats.

Claim free domain

Om du behöver hjälp med att välja ett domain name erbjuder WPBeginner en gratis generator för företagsnamn som hjälper you att hitta ett företagsnamn som är lätt att läsa och främja på nätet.

Om du skapar en personlig portfölj är det enklaste naturligtvis att använda ditt för- och efternamn som domännamn. Om det är upptaget kan du lägga till ditt yrke tillsammans med ditt förnamn.

Om till exempel johndoe.com är taget kan du hitta johndoephotography.com eller janedoewriter.com.

Helst bör du hålla dig till . com-domäntillägget eftersom det är det mest kända och pålitliga för småföretag .

2. Installera WordPress

Ett av de vanligaste misstagen som många Beginnare gör är att välja fel plattform för sin website. Många frilansare eller småföretagare graviterar mot Squarespace eller Wix.

De är visserligen enkla att använda, men saknar funktionalitet, anpassning och kontroll.

Att använda ett innehållshanteringssystem som WordPress ger dig mycket mer flexibilitet, med tusentals designer och tillägg för din portfoliosajt. WordPress är gratis och har öppen källkod, och det finns tusentals förbyggda tillägg och webbdesign.

Med rätt tillägg och teman för WordPress får du också samma drag and drop-byggare som gör plattformar som Squarespace eller Wix så användarvänliga.

Oavsett om du använder Hostinger eller en annan WordPress-hostingtjänst som WP Engine eller Bluehost kan du följa vår guide om hur du installerar WordPress för detaljerade steg-för-steg-instruktioner.

Därefter kan du i din Hostinger-instrumentpanel klicka på knappen ”Admin Panel” med WordPress-logotypen för att gå till din WordPress-webbplats instrumentpanel.

WP Admin Panel shortcut in Hostinger panel

You can also go to yoursite.com/wp-admin directly in your browser.

3. Välj ett portföljtema

När du har installerat WordPress är du redo att customize din website genom att välja ett theme och skapa new pages.

I den här handledningen använder vi SeedProd för att skapa ett tema specifikt för portfoliowebbplatser.

SeedProd är den bästa WordPress page builder på marknaden. Med den kan du snabbt och enkelt skapa alla typer av pages utan att skriva en enda rad kod.

Oavsett om du vill skapa en portfoliowebbplats för att landa potentiella kunder, starta en WordPress-blogg eller en webbutik är SeedProd en helhetslösning som ger dig mallar som är skräddarsydda efter dina behov.

Du måste installera och aktivera plugin-programmet SeedProd. För mer information, se vår guide om hur du installerar ett WordPress-plugin.

Efter installationen kommer du att uppmanas att slutföra installationsguiden. Du kan klicka på ”Kom igång” och följa steg-för-steg-instruktionerna så att SeedProd kan konfigurera plugin-programmet så att det passar dina behov bäst.

SeedProd setup wizard

När du har slutfört installationsguiden kan du gå till SeedProd ≫ Inställningar och ange din licensnyckel . Du hittar din licensnyckel under dina konton på SeedProds webbplats.

När du har angett informationen klickar du på knappen ”Verifiera nyckel”.

Verify key for SeedProd

Du kommer nu att ha tillgång till SeedProds alla funktioner.

4. Bygg din Landing Page för portföljen

Låt oss nu navigera till SeedProd ≫ Theme Builder.

Härifrån kan du välja den orangefärgade knappen som säger ”Theme Template Kits”.

SeedProd theme builder

Du kommer till en sida med ett sökbart bibliotek med WordPress-teman att välja mellan. Skriv bara in ”portfolio” i sökfältet och välj den temamall som passar bäst för din webbplatsidé.

Du kanske också vill söka på andra keywords om du är i en specifik nisch. Om du till exempel är fastighetsmäklare kan du hitta WordPress themes för fastighetsmäklare på SeedProd.

Vi väljer temat ”Freelance Portfolio”, men du får gärna välja vilket tema som helst som passar dina behov.

Online portfolio theme in SeedProd

Vi ska skapa en portfoliosida med en sida. Det innebär att portfoliosidan är en del av webbplatsens startsida. På så sätt kan du snabbt få igång din portfoliosajt utan att behöva designa flera sidor.

I WordPress instrumentpanel, låt oss gå till Inställningar ≫ Läsning. Bredvid Hemsidan väljer du rullgardinsmenyn ”Portfolio” för att göra din portfoliosida till din hemsida.

Set portfolio page as homepage

Sedan vill du gå tillbaka till SeedProd ≫ Theme Builder, och du kommer att se en lista över alla sidor inom temat.

Härifrån måste du bläddra ner och hålla muspekaren över sidan ”Portfolio”. Klicka sedan helt enkelt på knappen ”Redigera design”.

Edit portfolio page

5. Edit the Portfolio Website

Nu är det dags att redigera innehållet och göra det till ditt eget.

På SeedProds visuella, dra-och-släpp-sidbyggare ser du massor av ”Standard” och ”Avancerade” widgets att välja mellan. Dessa inkluderar en rubrik, text, lista, sidhuvud, utvald bild och så vidare.

Dra helt enkelt det widget du vill ha och flytta det till exakt den location du vill ha elementet.

Widgets in SeedProd

Du kan också customize bakgrunden som du vill genom att välja en enfärgad färg, en lutningsfärg eller en bakgrundsbild.

Klicka bara på den yttre lagerboxen och under ”Content” i sidebar-menyn ser du alternativ för att customize din bakgrund.

Background in SeedProd

Om du behöver hjälp med att arbeta med SeedProd-gränssnittet kan du titta på våra SeedProd video tutorials.

När du redigerar innehållet på din huvudsakliga portfölj page finns det flera viktiga komponenter som du vill inkludera, till exempel:

Stark uppmaning till handling (CTA): Portfoliosidor bör ha en tydlig CTA-knapp som gör det möjligt för besökare att anlita eller kontakta dig. CTA-knappen bör placeras både ovanför vikningen och längst ner på din sida.

Hitta bara boxen ”Button” i menyn till vänster och dra den till din page till höger.

Call to action in SeedProd

När du editerar ett element måste du clicka på det specifika elementet eller area som du vill customize.

Alternativen för det blocket visas till vänster. Som du kan se nedan kan du under fliken ”Innehåll” redigera knapptexten och länka den till din kontaktsida eller till och med till ett inbäddat formulär längre ner på samma sida.

På fliken ”Templates” kan du välja knappstil och på fliken ”Advanced” kan du ändra utfyllnad, teckensnitt med mera.

Edit button SeedProd

Tjänster som du erbjuder: Besökarna vill veta vad du erbjuder så att de kan vara säkra på att du kan göra det de vill. Om du är WordPress-utvecklare, kodar du till exempel anpassade plugins, erbjuder webbplatsanpassningar eller bygger webbplatser från grunden?

För att skapa ett avsnitt om tjänster lägger du bara till en widget för ”kolumner” och infogar en ”ikonruta” för varje tjänst vi erbjuder.

Sedan kan du customize texten och icons efter behov genom att clicka på elementet och använda sidebaren.

Services page in SeedProd

Avsnittet Om mig: Potentiella kunder och klienter vill också veta mer om din bakgrund och erfarenhet. Det här är en chans att bygga upp en relation med människor och visa att du brinner för det du gör.

För att skapa ett ”Om mig”-avsnitt behöver du bara lägga till widgeten ”Image Box” på sidan. Sedan lägger du bara till ett porträttfoto av dig själv och skriver en beskrivning som berättar mer om dig.

Om du skapar en portfölj för ett företag eller varumärke kan du använda din egen logotyp här i stället.

Author bio in SeedProd

Vittnesmål: Att tillhandahålla vittnesmål från tidigare kunder hjälper till att bygga förtroende, särskilt om du har arbetat med välrenommerade varumärken. Att se att andra människor är nöjda med ditt arbete ger andra förtroende för att du också kan göra ett bra jobb.

Lägg helt enkelt till widgeten ”Testimonials” på din sida. Sedan kan du lägga till ett foto av kunden och redigera deras namn och vittnesmål. Om du vill lägga till fler recensioner, fortsätt och klicka på ikonen ”Duplicera” bredvid personens namn.

Duplicate testimonials in SeedProd

6. Add a Gallery för att visa upp exempel på your arbete

Att skapa en webbplats med portfölj ger dig en chans att visa upp allt det fantastiska arbete du har gjort. När potentiella kunder ser vad du kan göra kommer de att lita på att du är rätt person för jobbet.

För att göra det kommer vi att använda Envira Gallery, som är det bästa galleripluginet för WordPress. Även om du kan använda widgeten ”Avancerat galleri” på SeedProd, ger Envira Gallery dig mer funktionalitet.

Till exempel kommer det med ”Lightbox”-bilder. Det innebär att när någon klickar på ett foto visas automatiskt de fulla dimensionerna utan att du behöver beskära eller ändra storlek på dem. Du kan även lägga till bildspel och organisera dina gallerier i album för att bättre kategorisera ditt arbete.

Låt oss först installera och aktivera plugin-programmet Envira Gallery. För detaljerade instruktioner, följ vår guide om hur du installerar ett WordPress-plugin.

Efter aktivering kan du gå till Envira Gallery ≫ Lägg till nytt i WordPress instrumentpanel.

Namnge helt enkelt ditt galleri i titelfältet. Sedan kan du klicka på ”Sök filer från din dator” för att lägga till bilder av dina portfolioprojekt.

Add new gallery Envira Gallery

När du har laddat upp portfolioprodukterna ska du skrolla ner och byta till fliken ”Config”.

Här kan du ändra antalet gallerikolumner som du vill visa. Om du ställer in den på ”Automatisk” ställs antalet bilder in så att varje rad fylls automatiskt.

Configurations in Envira Gallery

Om du vill ändra bildstorlekarna kan du bläddra ner på fliken ”Config” och hitta alternativet ”Image Size”.

Sedan är det bara att välja den storlek som bäst visar upp dina portföljföremål.

Image size in Envira Gallery

Du kan också justera Lightbox-bildens storlek så att den visar bilden i originalstorlek när någon klickar på bilden.

För att göra detta måste du gå till fliken ”Lightbox” och justera bildstorleken till ”Original Image”.

Lightbox in Envira Gallery

Sedan ska du bläddra upp till toppen av sidan och trycka på ”Publicera”.

Under publiceringsknappen ser du en kortkod. Gå vidare och kopiera kortkoden för att lägga till galleriet på vår WordPress-portfoliosida.

Publish gallery in Envira Gallery

Låt oss nu gå tillbaka till din portföljsida i SeedProd.

Nästa steg är att dra och släppa ”Shortcode”-blocket var du vill på sidan. Sedan klistrar du bara in kortkoden i rutan ”Kortkod” i sidofältets meny.

Shortcode in SeedProd

Om du vill förhandsgranska kortkoden klickar du på knappen ”Förhandsgranska” längst upp till höger på sidan.

Detta visar hur hela page gillar att se ut.

Preview portfolio website

Here, you should be able to see that your Envira Gallery is embed in your portfolio site.

Med Envira Gallery’s featured image kan du clicka på varje objekt för att se hela imagen.

Recent projects in SeedProd

7. Add a Contact Form

Nu när du har reelat in dina potentiella kunder är det dags att få dem att kontakta dig. Visst, du kan bara släppa ett email där, men kontaktformulär låter dem skicka ett meddelande direkt till dig utan att öppna sin email app.

Det bästa sättet att skapa ett enkelt och professionellt kontaktformulär är med WPForms.

WPForms

WPForms är den bästa kontaktformulärsbyggaren för WordPress som låter dig skapa kontaktformulär online.

För att lära dig hur du skapar ett enkelt kontaktformulär för din website så att potentiella kunder kan kontakta you, följ bara vår Step-by-Step tutorial om hur du skapar ett kontaktformulär i WordPress.

När du har fyllt i formuläret kan du gå tillbaka till din portföljsida.

Sedan kan du använda widgeten ”Kontaktformulär” för att lägga till ett formulär från WPForms. Under ”Select a Form” väljer du helt enkelt det formulär du har skapat.

WPForms in SeedProd

8. Make It Live

Om allt ser bra ut är du redo att lansera din website.

Allt du behöver göra är att clicka pilen under den gröna knappen ”Save” högst upp i högra hörnet. Klicka sedan på ”Publicera”.

Publish portfolio in SeedProd

Gå vidare och kontrollera live site.

Allt ska visas, inklusive portföljens gallery, knappar och kontaktformulär.

Portfolio website live example

När du har skapat en professionell website för portföljen är du redo att börja skicka mer trafik till din site eller ta hand om intresserade prospekt.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du skapar en onlineportföljwebbplats i WordPress. Vi rekommenderar också att du kollar in våra guider om hur du skapar ett betalt nyhetsbrev och hur du gör en länk i bio-sidan.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

27 kommentarerLeave a Reply

  1. Jiří Vaněk

    I’ve approached my portfolio as a blog. I write a tech blog about what interests me, using it as a showcase of my work. So, for me, a blog can be a great addition to a portfolio, demonstrating your skills and expertise in a way that can also be enjoyable and drive traffic to your website through search engines.

  2. Konrad

    one more thing to save for the future, thank you guys
    wish me luck as i gather the courage to share my artworks with others :>

    • WPBeginner Support

      Good luck :)

      Admin

  3. Ram E.

    Thanks for another detailed guide! For more complex or bigger portfolio sites, there is also the option to create custom post types for even greater flexibility in terms of features.

    • WPBeginner Support

      That is a good option for sites with multiple content types :)

      Admin

  4. Mikolaj

    I’ve been in search of a great portfolio landing page for my art selling business, and it seems like SeedProd is just what I need. The simplicity and theme customization options are fantastic. Thanks for the comprehensive guide; I’m excited to give it a go!

    • WPBeginner Support

      We hope you enjoy using the plugin :)

      Admin

  5. Ralph

    Nice and easy step by step tutorial. I don’t really need portfolio however it gave me other idea. I will use similar concept for homepage of my blog. Above all newest articles i will place 3 big buttons/pics (sorry i don’t know how to describe it in english), that will lead to my youtube, podcast and blog. So more promotion for my other channels.
    Thanks for idea!

    • WPBeginner Support

      You’re welcome, glad our guide could give you ideas :)

      Admin

  6. Naveera Batool

    Really an interesting and helpful article.

    • WPBeginner Support

      Glad you think so :)

      Admin

  7. A Owadud Bhuiyan

    I have tried to create a portfolio site but I am not able to set the blog page as Homepage.

    • WPBeginner Support

      It would depend on the theme but if you do not set a static page under Settings>Reading, most themes set the blog page as your homepage.

      Admin

  8. Adam Michalak

    Grate artictle, highly recommend it to anyone looking to learn how to create an online portfolio website in WordPress. In today’s competitive freelance market, having a portfolio website to display your best work is essential for standing out and attracting more clients. This step-by-step guide offers valuable insights on how to accomplish this, making it a valuable resource for those aiming to build their online presence as a professional freelancer.

    I will recommend it to my friends who are just starting to work with wordpress :)

    • WPBeginner Support

      Thank you for your kind words and we hope whoever you recommend also finds this article helpful :)

      Admin

  9. William Dean Dailey

    This is the most effective and informative post I have read by you all.
    The graphics and text were easy to understand and follow through to complete the website and publish. Thank you for that. It’s the first time I have made it to publish using WordPress and am happy with the results.

    • WPBeginner Support

      Glad to hear you were able to publish your site :)

      Admin

  10. Sean Brady

    I feel that developing a portfolio website with WordPress would be a great way add to display an artist discography.

    • WPBeginner Support

      It certainly could be :)

      Admin

  11. Sharon

    I liked this Tutorial. Although I’m an Elementor page builder user, it’s nice to see other page builders out there and what they can do. I had a portfolio of my website at one point, but I can’t say I really liked it. I think I might try again and use some techniques from this tutorial. Thanks, WPBeginner for the useful tutorial! Awesome instructions!

    • WPBeginner Support

      You’re welcome and glad to hear you found our tutorial useful.

      Admin

  12. Alice Elliott

    Thank you for this very detailed tutorial about how to set up a portfolio website. However, I wonder why you chose a non-wysiwyg theme within your example. If you are targeting visual people, I would think this should be far more applicable, as it would be something they could relate to much more easily.

    • WPBeginner Support

      We went with a page builder in this guide as it adds more freedom for design :)

      Admin

  13. priya

    thanks for sharing with us .

    • WPBeginner Support

      You’re welcome :)

      Admin

  14. Shafqat Khan

    I’ve been looking for a way to create a portfolio landing page for my photography business, and SeedProd seems like the perfect solution. I love how easy it is to use and customize the theme templates. Thank you for this detailed guide, I can’t wait to try it out!

    • WPBeginner Support

      Glad to hear our guide was helpful!

      Admin

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.