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 Section för tjänster i WordPress (2 enkla sätt)

Vill du skapa en section för tjänster i WordPress?

När potentiella kunder kommer till din site vill de veta vad du erbjuder. En section med tjänster kan förmedla denna information på ett snabbt och enkelt sätt så att besökarna kan bestämma sig om de vill veta mer om yours verksamhet.

I den här artikeln visar vi dig hur du enkelt skapar en section för tjänster i WordPress.

How to create a services section in WordPress

Varför skapa en Section för tjänster i WordPress?

Att ha en services section på din WordPress site är viktigt om du run en service website. Här får besökarna all information de behöver om de tjänster som du erbjuder, t.ex. fördelar, priser och tekniska specifikationer.

På så sätt kan besökarna snabbt och enkelt avgöra om de vill veta mer om en viss tjänst.

An example of a services section

Vanligtvis kommer en services section på en homepage eller landing page att länkas till custom services pages som detaljerar varje objekt.

Detta är för att visitorerna ska kunna läsa mer om varje tjänst i detalj på customizer page.

An example of a services section with CTA buttons

Du kan även add to en call-to-action i slutet av services section. Du kan till exempel add to ett formulär där besökarna kan requesta en personlig offert.

Följande image visar en section med tjänster som har en clear call-to-action knapp.

An example of a contact us form

Med detta sagt, låt oss ta en titt på 2 nybörjarvänliga sätt att skapa en section för tjänster i WordPress och sedan add to vilken page som helst på ditt företags website. Använd bara snabblänkarna under för att hoppa till den metod du vill använda:

Metod 1: Skapa en tjänst Section med SeedProd (rekommenderas)

Det enklaste sättet att skapa en professionellt utformad section för tjänster är att använda en page builder. Med ett bra page builder plugin kan du främja så många tjänster som du vill och ordna dem i en fin, användarvänlig layout.

Du kan också uppmuntra besökarna att lära sig mer om dina tjänster genom att lägga till CTA:er, länkar, knappar med mera.

SeedProd är den bästa drag-and-drop page buildern för WordPress. Den levereras med 300+ professionella templates för webbdesign och färdiga sektioner som är perfekta för att skapa en sektion för tjänster.

SeedProd fungerar också med många populära tredjepartsverktyg som du kanske redan använder för att få och hantera konverteringar. Detta inkluderar marknadsföringstjänster för e-post, WooCommerce, Google Analytics och mer.

SeedProd Website and Theme Builder

För att lära dig mer, se vår detaljerade SeedProd-recension.

Först måste du installera och aktivera SeedProd plugin. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.

Note: Det finns också en gratis version av SeedProd, men vi kommer att använda SeedProd Pro eftersom det har fler templates och block.

Efter att ha aktiverat pluginet kommer SeedProd att be om din license key.

SeedProd license key

You can find this information in your account on the SeedProd website. När du har enter license key, gå vidare och klicka på ”Verify key”.

Välj en professionellt utformad templates

Nästa steg är att skapa en new page där du lägger till section för tjänster. För att göra detta, gå till SeedProd ” Landing Pages i din WordPress dashboard.

När du har gjort det klickar du på knappen ”Add New Landing Page”.

SeedProd's page design templates

Du kan nu välja någon av SeedProds färdiga templates.

För att hjälpa dig att hitta den perfekta templaten är SeedProds website designs organiserade i olika kampanjtyper, såsom squeeze, lead, sales och coming soon.

Du kan klicka på tabbarna högst upp på vyn för att filtrera templates baserat på kampanjtyp.

The SeedProd template library

Om du föredrar att börja från scratch, så har SeedProd också en Blank Template, som inte har något standard content eller designelement.

Om du vill titta närmare på en design håller du bara musen över templatet och klickar sedan på den lilla ikonen med förstoringsglaset.

Previewing a SeedProd template

När du hittar en layout som du vill använda klickar du på ”Choose This Template”. Vi använder mallen ”Masterclass Sales Page” i alla våra images, men du kan använda vilken template du vill.

När du har valt en template, skriv in ett namn för din custom page. SeedProd kommer att skapa en URL automatiskt med rubriken, men du kan ändra detta om du vill.

En beskrivande URL hjälper sökmotorer att förstå vad en sida handlar om så att de kan leverera den sidan till personer som gillar content som your.

Creating a new page using SeedProd

För att ge din page bästa möjliga chans att appear i relevanta sökresultat kan du add to några relevanta keywords till URL:en. Detta kan förbättra din sökmotorsoptimering i WordPress.

När du är nöjd med den information du har enter klickar du på knappen ”Save and Start Editing the Page”.

Designa din custom page

Du kommer nu att se SeedProd’s drag and drop page builder. Till höger visas en preview av din page, med några inställningar till vänster.

The SeedProd page builder

De flesta templates i SeedProd innehåller redan några block, som är en core del av alla layouts i SeedProd.

För att customize ett block klickar du bara för att välja det. I menyn till vänster visas all Settings som du kan använda för att edit:a blocket, t.ex. ändra storleken på fonten.

Customizing a SeedProd block

Om du vill ta bort ett block från page templates klickar du helt enkelt på det blocket.

Gå sedan vidare och klicka på den lilla trash-iconen i den flytande toolbaren.

Deleting blocks from a custom layout

För att add new block till din design, clickar du bara på blocket i menyn till vänster och drar det till Editorn.

Du kan sedan klicka för att välja block och göra ändringar i menyn till vänster.

Du kan upprepa dessa steg för att skapa vilken typ av page som helst.

Add to en section för tjänster

SeedProd har också ”Sections”, som är kombinationer av row och block som ofta används tillsammans. Till exempel har SeedProd sektioner för vanliga frågor, footers, headers och customer testimonials.

Den har också olika sections som är perfekta för att skapa en sektion för tjänster i WordPress. För att ta en titt på de olika sektionerna, gå vidare och klicka på tabben ”Sections”.

Dessa mini templates är organiserade i olika kategorier. För att skapa en section för tjänster rekommenderar vi att du tar en titt på kategorin ”Funktioner”.

SeedProd 'Features' sections

Här hittar du sections som använder sig av stycken, subheading och images i en snygg layout.

I följande image kan du se ”Features 3” section, som liknar en featured image box med icons. Om du vill göra om detta till en section för tjänster lägger du bara till din egen text och dina egna images.

An example section template

Du kanske också vill titta på kategorin ”Call-to-action”. Här finns många olika sections, bland annat några som du kan använda för att marknadsföra dina tjänster.

I följande image kan du se ”Call-to-action 6” section, som redan har plats för tre tjänster.

An example CTA section template

För att få en preview av en section håller du musen över den och klickar sedan på den icon med förstoringsglas som visas.

När du hittar en section som du vill använda, för du bara muspekaren över den och klickar sedan på den lilla iconen ”+”.

Adding a services section to your WordPress website

Detta add to sektionen längst ner på din page, men you can move sections and blocks around your design using drag and drop.

När du har lagt till en sektion klickar du bara på ett block i den sektionen för att customize det. Till att börja med vill du vanligtvis skriva in lite information om dina tjänster.

För att göra detta klickar du bara på någon Text, Headline eller liknande section. Skriv sedan i det textfält som visas i menyn till vänster.

Editing a services section in WordPress

Du kan också formatera texten på samma sätt som du formaterar text i textredigeraren i WordPress.

Det är också en bra idé att add to links så att visitorerna kan få veta mer om tjänsten.

Customizing the services section in WordPress

Ett annat alternativ är att använda en ”Call-to-action”-knapp. Även om Section inte har built-in knappar är det lätt att add to dem.

I menyn till vänster klickar du bara på ikonen ”Blocks”, som gillar många små prickar.

How to add blocks to a services section

Du kan sedan drag and drop ett ”Button”-block till din section.

Om du addar ett ”Button”-block kan du customize det på exakt samma sätt som du editerar andra block. Just click on it, and then make your changes in the left-hand menu.

Adding a CTA button to a services section with WordPress

Du kan add to fler block genom att följa samma process som beskrivs ovan.

Du kan till exempel använda block med ”Images” för att visa varje tjänst i action.

Adding images to a services section

Du kan även add to CSS-animationer för att få tjänsten section att verkligen sticka ut.

När du är nöjd med hur sidan ser ut är det dags att publicera den genom att clicka på dropdown-pilen bredvid knappen ”Save”.

Välj sedan alternativet ”Publicera”.

Publishing a services section to your WordPress website

Din page kommer nu att gå live på din WordPress website och besökarna kan se alla dina tjänster på ett ögonblick.

Vill du ha fler tips och tricks för att customize din tjänst section med SeedProd? Kontrollera dessa tutorials:

Metod 2: Skapa en sektion för tjänster med Service Box Showcase (gratis)

Du kan också bygga en section för tjänster med hjälp av det gratis pluginet Galleri/Presentation/Showcase och sedan add to en page eller post med shortcode.

Du måste använda en av plugins förgjorda layouts för sektioner av tjänster, så det här är inte den mest anpassningsbara metoden.

Men tillägget låter dig skapa en tjänst section med hjälp av den välbekanta WordPress block editor, så det är snabbt och enkelt.

Först måste du installera och aktivera det gratis Galleri/Presentation/Showcase Plugin för Service Box. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.

Efter aktivering, head till Service Box ” Add New Service Box.

The Service Box Showcase plugin

Till att börja med måste du skriva in en rubrik för din section med tjänster. Denna kommer endast att visas i adminpanelen eller ej på din website, så du kan använda vilken titel du vill.

Därefter hittar du den layout du vill använda och klickar på knappen ”Select”.

Choosing a design for the services section

Därefter rullar du till ”Add Service Box”, som har två tjänster som standard.

För att add to fler tjänster till section, gå vidare och click på ”Add New Service Box”.

How to add more services to the service box

När du har gjort det kan du skriva in en Rubrik för varje tjänst och add to en description.

Det är den här texten som besökarna kommer att se, så se till att du ger dem all information de behöver.

Creating a services section using a free WordPress plugin

Som standard använder pluginet samma icon för varje tjänst. Det är en bra idé att ändra dessa icons till något som är unikt för varje tjänst.

För att se de olika icons du kan använda klickar du på fältet ”Service Icon”. Då öppnas en popup där du kan rulla igenom de olika bilderna och clicka på den du vill använda.

Adding a custom icon to each service

Det är också en bra idé att add to en länk till en page där visitorerna kan läsa mer om varje tjänst eller till och med en page med ett kontaktformulär så att de kan prata med you direkt.

För att göra detta skriver du bara in länken i fältet ”Add to Your Service Or Read More Link Here”.

Adding a link to a services section

När du har lagt till all denna information kan du ändra hur din tjänst ser ut med hjälp av ”Service Box Settings”.

De flesta av dessa Settings är ganska okomplicerade. Du kan till exempel ändra storlek och stil på fonten. You can also change the link color, plus the color of the title, description, and more.

Om du inte vill använda några icons i services section kan du ta bort dem genom att clicka på ”Display Icon”-knappen.

Hide and show the services icon

Det finns många olika Settings, och vad som ser bra ut kan variera beroende på ditt WordPress Theme.

Om du inte är nöjd med hur sectionen med tjänster ser ut på din website kan du alltid gå tillbaka till ”Service Box Settings” och göra några ändringar.

När du är nöjd med hur boxen med tjänster är konfigurerad klickar du bara på knappen ”Publicera” högst upp på sidan för att save dina ändringar.

You can now add the services section to your eCommerce website using a shortcode. Rulla bara till ”ServiceBox Shortcode” och kopiera koden.

Adding a services section to your WordPress website using shortcode

Du är nu redo att add to the services box till valfritt post, page, sidebar, eller något annat widget-ready area i your theme. För mer detaljer om hur du placerar shortcoden kan du se vår guide om hur du lägger till en shortcode i WordPress.

När du har klistrat in shortcoden klickar du bara på ”Update” eller ”Publicera” för att göra ändringarna live. Nu, om du besöker din site, kommer du att se tjänsten section i action.

A services section, created using a free plugin

Klart är att du kanske inser att du vill göra några ändringar, t.ex. använda en annan bakgrundsfärg eller lägga till fler tjänster.

För att editera section går du till Service Box ” All Service Box. You can then find the service box and click on its ’Edit’ link.

Editing your services using a free plugin

Nu kan du göra dina ändringar med hjälp av ”Service Box Settings” och andra sections.

När du är nöjd med de ändringar du har gjort, glöm inte att klicka på ”Update”.

Updating the services box

Nu, om du besöker sidan eller posten där du har add to the services box, kommer du att se dina ändringar.

Lär dig hur du förvandlar fler besökare till Leads/Customizes

Att skapa en section för tjänster på ditt företags website är ett bra steg för att visa upp vad ditt företag gör och hur det kan gynna din målgrupp.

Om du vill ta din website till nästa nivå måste du add to andra element till din site för att konvertera dina besökare till leads. Här är några idéer som du kan prova:

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du skapar en section för tjänster i WordPress. Du kanske också vill kontrollera vår artikel om de bästa PayPal-tilläggen i WordPress för att godkänna betalningar och hur man lägger till beautiful pristabeller i WordPress.

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.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala 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.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

2 kommentarerLämna ett svar

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Dayo Olobayo says

    Thanks for sharing this helpful walkthrough on building services section in WordPress. It’s insightful to see the different plugin options available. One aspect I would say is worth exploring further is how to integrate social proof elements like testimonials or client logos to bolster credibility within the services section.

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.