Vill du skapa en custom page i WordPress?
En customize page låter dig använda en annan layout än resten av din website. Många WordPress-webbplatser använder custom page layouts för sina försäljningssidor, landing pages, webinar pages, med mera.
I den här artikeln visar vi dig hur du enkelt skapar en customize page i WordPress.
Varför skapa en Custom Page i WordPress?
Varje gång du skapar en new page kontrollerar your WordPress theme hur sidan ser ut med hjälp av en template-fil.
Denna template page.php påverkar alla enskilda pages som du skapar i WordPress. Men du kanske inte vill använda samma design varje gång.
Landing pages har ofta ett annat content jämfört med vanliga pages, till exempel en stor hero image eller en call-to-action (CTA). Det innebär att de ofta ser helt annorlunda ut än resten av din website.
Att försöka skapa unika mönster med hjälp av standardmallen för page kan dock ta mycket tid. Du är också limitad av page.php templates och kanske inte kan skapa exakt den design du vill ha. Detta kan göra det svårt att få bra resultat. Om du till exempel bygger en försäljningssida kanske du inte får många konverteringar på grund av dålig siddesign.
Med det sagt, låt oss se hur du kan skapa en customize page i WordPress, med exakt den design, layout och content du vill ha. Använd bara snabblänkarna under för att hoppa direkt till den metod du vill använda.
- Method 1. How to Create a Custom Page in WordPress Using the Block Editor (No Plugin Required)
- Method 2. How to Create a Custom Page Using the Full-Site Editor (Block-Based Themes Only)
- Method 3. Create a Custom Page in WordPress using SeedProd (Recommended)
- Method 4. Using Thrive Architect to Create a Custom Page in WordPress
Metod 1. Hur man skapar en Custom Page i WordPress med hjälp av Block Editor (inget plugin obligatoriskt)
Block Editor gör det enkelt att designa dina egna templates med hjälp av de tools du redan känner till.
Detta är ett bra val om du har planer på att återanvända samma design på flera pages, eftersom du helt enkelt kan tillämpa samma template. Om du vill skapa en helt unik design är ett annat alternativ att skapa sidan som vanligt och sedan editera layouten med hjälp av Full Site Editor, som vi kommer att täcka i metod 2.
Tänk bara på att dessa metoder endast fungerar med block-baserade themes som ThemeIsle Hestia Pro eller Twenty Twenty-Three. Om du inte har ett block-baserat theme rekommenderar vi att du använder en page builder istället.
För att börja öppnar du bara en page eller post. Sedan väljer du tabben ”Page” i menyn till höger och klickar på texten bredvid ”Template”.
De alternativ du ser kan variera beroende på ditt WordPress-tema, men texten kommer vanligtvis att visa ”Page”, ”Default template” eller liknande.
I popupen som visas klickar du på ikonen ”Add Template”.
I popupen som visas skriver du in ett namn för din template och klickar sedan på ”Create”.
Namnet är bara för din referens så du kan använda vad du vill.
Detta öppnar templates editor, som fungerar på samma sätt som WordPress content editor.
Om du vill add to block till designen av din custom page klickar du bara på den blå knappen ”+”. Du kan sedan dra and drop för att add to block.
Du kan add to content till ett block eller ändra dess format med hjälp av de välbekanta tools för redigering av post i WordPress. Du kan till exempel skriva in text i ett ”Heading”-block, tillämpa fet formatering eller ändra text från H2 till H3.
Du kan också skapa en customize page med hjälp av mönster. Patterns är samlingar av block som ofta används tillsammans, t.ex. en lista över händelser, en image med en caption eller en pristabell.
De mönster du ser varierar beroende på ditt WordPress theme, men du kan se vilka mönster som finns tillgängliga genom att clicka på tabben ”Patterns”.
Du kan antingen dra and drop ett block pattern till din layout eller click på mönstret för att lägga till det längst ner i din template. När du är nöjd med hur templaten ser ut klickar du på knappen ”Publicera” och sedan på ”Save”.
Du kan nu tillämpa denna template på vilken page som helst. Öppna helt enkelt sidan i Editorn och klicka sedan på texten bredvid ”Template”.
I popupen som visas, select the template the template the template you just created.
När du har gjort det kan du add to content till sidan, precis som med alla andra sidor i WordPress.
Metod 2. Hur man skapar en Custom Pagemed hjälp av Full-Site Editor (endast block-baserade teman)
Om du använder ett blockbaserat theme kan du också skapa en custom page med hjälp av full-site editor. Detta allow you att ändra layouten på en enskild page, utan att skapa en custom template.
Med det i åtanke är detta ett bra val om du vill skapa en helt unik design som du inte kommer att återanvända på någon annan page.
För att komma igång skapar du helt enkelt sidan som vanligt genom att gå till Pages ” Add New. Du kan sedan skriva in en titel, lägga till kategorier och tags, ladda upp en featured image och göra alla andra ändringar du vill.
När du är nöjd med den grundläggande page, save dina ändringar och sedan head över till Appearance ” Editor.
Som standard visar den fullständiga Site Editor ditt temas hemmamall.
I menyn till vänster klickar du på ”Pages”.
Nu ser du alla pages som du har skapat på din website WordPress.
Leta bara upp den page du vill göra om och gör ett click.
WordPress kommer nu att visa en preview av designen.
För att gå vidare och edit denna template, click på den lilla penna iconen.
Du kan nu editera sidans layout med hjälp av verktygen för hela Site Editor. Du kan till exempel klicka på den blå ”+”-knappen för att add new block, eller click för att select något block som du vill customize.
När du är nöjd med de ändringar du har gjort, clickar du på knappen ”Save”.
Nu, om du besöker den här page på your website, kommer du att se den nya siddesignen i action.
Metod 3. Skapa en Customize Page i WordPress med hjälp av SeedProd (rekommenderas)
Tidigare skapade du en customize page genom att skriva kod, vilket inte var särskilt nybörjarvänligt. Om du gjorde ett misstag med din HTML-, CSS- eller PHP-kod kunde det orsaka vanliga WordPress error eller till och med förstöra din site helt.
Med detta i åtanke rekommenderar vi att du använder en page builder istället.
SeedProd är den bästa drag-and-drop page buildern för WordPress. Den levereras med mer än 350 templates, vilket allow you att skapa customizes pages utan att skriva någon kod.
Om du använder en custom page för att få fler konverteringar, så fungerar SeedProd med många populära tredjeparts tools som du kanske redan använder för att få konverteringar. Detta inkluderar marknadsföringstjänster för e-post högst upp, WooCommerce, Google Analytics och mer.
Först måste du installera och aktivera SeedProd. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.
Note: Det finns också en gratis version av SeedProd som allow you att skapa customize pages oavsett din budget. Men för den här guiden kommer vi att använda SeedProd Pro eftersom den har många fler templates och integreras med all de bästa tjänsterna för e-postmarknadsföring.
Efter att ha aktiverat pluginet kommer SeedProd att be om din license key.
You can find this information under your account on the SeedProd website. När du har enter nyckeln klickar du på knappen ”Verify Key”.
Välj en custom page template
När du har gjort det, gå till SeedProd ” Landing Pages och klicka på knappen ’Add New Landing Page’.
Du kan nu välja en template för din custom page.
SeedProds templates är organiserade i olika kampanjtyper som ’lead’, ’squeeze’ och ’coming soon’. Du kan klicka på tabbarna högst upp på vyn för att filtrera templates baserat på kampanjtyp.
Om du vill börja från scratch har SeedProd också en tom template som du kan använda.
Om du vill titta närmare på en design håller du bara muspekaren över templaten och klickar sedan på ikonen med förstoringsglaset.
När du hittar en design som du gillar klickar du på ”Choose This Template”. Vi använder mallen ”Course Sales Page” i alla våra images, men du kan använda vilken template du vill.
Gå sedan vidare och skriv in ett namn för den customize page. SeedProd kommer automatiskt att skapa en URL baserat på sidans Rubrik, men du kan ändra denna URL till vad du vill.
En beskrivande URL hjälper också sökmotorer att förstå vad sidan handlar om så att de kan visa den för rätt användare, vilket förbättrar din sökmotorsoptimering i WordPress.
För att ge din custom page bästa möjliga chans att appear i relevanta sökresultat kan du add to eventuella keywords som saknas i URL:en. Mer detaljer finns i vår guide om hur du söker efter keywords.
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
SeedProd kommer nu att öppna din valda template i sin användarvänliga drag and drop editor. Du kommer att se en live preview av din page till höger, och några block inställningar till vänster.
För att customize ett block klickar du bara för att välja det i page editor. I den vänstra toolbaren visas då alla inställningar för det blocket.
I Följer image ändrar vi texten i ett ”Headline”-block.
Du kan formatera texten, ändra justering, add to links med mera med hjälp av inställningarna i menyn till vänster.
Det är också lätt att edit images med hjälp av SeedProd page builder. Klicka bara på ett ”Image” block och använd inställningarna för att lägga till alt-text, ladda upp en new image eller göra andra ändringar.
Om du vill ta bort ett block från custom page klickar du bara på för att välja det blocket.
Klicka sedan på ikonen för papperskorgen i mini-toolbaren.
För att add new block till din design, hitta bara ett block i menyn till vänster och dra det sedan till Editorn.
Du kan sedan klicka för att välja block och göra ändringar i menyn till vänster.
SeedProd kommer också med ”Sections”, som är row- och block templates som kan hjälpa dig att skapa en custom page, snabbt. Om du till exempel skulle designa en Google Ads landing page, kan du använda SeedProds färdiga Hero, Call-to-action eller Features sections.
För att se all available sections, klicka på tabben ”Sections”.
För att titta närmare på en section, hoverar du musen över den och klickar sedan på magnifying glass icon.
När du hittar en section som du vill add to i din design, för du bara muspekaren över den och klickar sedan på den lilla iconen ”+”.
Detta addar section till längst ner på din page. Du kan flytta både sections och blocks runt din design med drag and drop.
Om you gör ett misstag eller ändrar dig, så oroa dig inte. You can reverse your last change by clicking on the ”Undo” button at the bottom of the left-hand toolbar.
Här hittar du också en knapp för att göra om, revisionshistorik, navigation i layouten och globala inställningar.
Dessa extra knappar gör det enkelt att skapa en customize page i WordPress.
Längst ner i toolbaren hittar du också en knapp för mobil preview som allow you to view the mobile version of the custom page.
Detta kan hjälpa you att designa en custom page som ser lika bra ut på mobila devices som den gör på din dator.
När du är nöjd med din custom page är det dags att publicera den genom att clicka på dropdown-pilen bredvid ”Save” och sedan välja alternativet ”Publicera”.
Din customize page kommer nu att gå live på din WordPress blogg.
Om du vill redigera den custom sidan vid någon tidpunkt, gå bara till SeedProd ” Landing Pages i din WordPress dashboard. Du kan sedan hitta den page som du vill ändra och klicka på dess ”Edit”-länk.
Detta kommer att öppna designen i SeedProds editor, redo för dig att göra dina ändringar.
Metod 4. Använda Thrive Architect för att skapa en Custom Page i WordPress
Du kan också skapa en customize page med hjälp av Thrive Architect. Thrive Architect är en annan populär drag-and-drop page builder för WordPress.
Den levereras med över 300 professionellt utformade templates som är utformade för att hjälpa dig att få fler konverteringar.
Först måste du installera och aktivera pluginet Thrive Architect. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.
Efter aktivering, gå till Pages ” Add New i din WordPress adminpanel för att skapa en custom page. Klicka sedan på knappen ”Launch Thrive Architect”.
Därefter kan du välja om du vill skapa en vanlig sida eller en pre-built landing page.
Vi rekommenderar att du clickar på ”Pre-built Landing Page” eftersom det ger dig tillgång till alla Thrive landing page templates. Dessa templates är helt anpassningsbara, så du kan finjustera dem så att de passar din WordPress website.
När du hittar en uppsättning som du gillar, klickar du bara för att välja den.
I den följande bilden väljer vi ”Smart Landing Page Sets.
På nästa vy måste du välja en specifik template från uppsättningen.
Välj en template genom att clicka på den och sedan trycka på knappen ”Tillämpa template”.
Detta kommer att öppna templaten i Thrive Architect Editor. Härifrån kan du enkelt customize page template för att matcha din blogg, website eller online store.
Som exempel kan du ändra ”Heading” genom att clicka på den och sedan skriva in your egen custom message.
Du kommer nu att se alla alternativ för customize i menyn till vänster. Här kan du ändra typografi, fontstorlek, färg, format och mycket mer.
From the left-hand panel, you can also adjust other settings for your custom page, such as the layout, background style, borders, animations, and scrolla behavior, just to name a few.
I likhet med SeedProds block kommer Thrive Architect med många pre-built element som du kan add to din custom page.
För att add a new element to the page, click on the ”Add Element (+)” button on the right-hand side of the screen.
Du kan nu välja mellan element som gillar images, knappar, lead generation-formulär, pristabeller, nedräkningstimer och mycket mer.
För att add to ett element drar du det från höger menu och släpper det på din page.
Återigen kan du edit alla nya element som du addar till din page genom att clicka på dem.
När du är nöjd med hur sidan ser ut klickar du på pilen (^) bredvid knappen ”Save Work”. Klicka sedan på alternativet ”Save and Return to Post Editor”.
Du kan sedan save the page som ett draft eller publicera den så att den visas på din website i WordPress.
När din customize page är publicerad kan you besöka din site för att se den i action.
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du skapar en customize page i WordPress. Du kanske också vill se vår guide om hur du ökar trafiken på din blogg, och våra expertval av de bästa tilläggen för kontaktformulär för 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.
Syed Balkhi
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!
Dennis Muthomi
I prefer the SeedProd method because it comes with over 350 templates to choose from, making it easy for me to find a design that matches my website.
The method using block editor does not have templates to start with.
Rajee Pandi
awesome. I think it is not free. Thank you so much.
WPBeginner Support
There is a paid option but 1 and 2 are free options
Administratör
Moinuddin Waheed
Using seedprod for making a custom page is promising as it takes less efforts and makes awesome looking design in no time.
Thanks for this guide, I have been already using seedprod to many of my websites and utilising this feature.
Brend
Thanks for the great article. I often use your site for assistance with WordPress.
I followed your tutorial to manually create a new template file. When selecting the template there is no CSS attached to the page. Did I miss something?
WPBeginner Support
It would depend on the specific theme you’re using, if you check with your theme’s support they should be able to let you know why their CSS is not being applied to your page properly.
Administratör
Muhammed
Perfect article.
I have a q
can i make a custom page and then make it the main website page or Home page?
I don’t like to have too much content in my firs page and i want to make every thing in the main home page by my own ( i mean with HTML, CSS, JS ).
is there any way to do that?
WPBeginner Support
For customizing everything in that manner you would want to look at the method for manually creating a page template
Administratör