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!
Patricia Reed
Is there a way to use an existing page (including all its content and images) and use this plugin to remove the menu and title link?
WPBeginner Support
We show two plugins in this guide, you can certainly recreate a page using them for what it sounds like you want.
Administratör
Teresa Cuervo
Excellent Article!
Just one question. After you finish the landing page do you still need the plugin in the plugin folder or is it safe to delete after you create the page.
WPBeginner Support
Yes, if you used the plugin method you would want to keep the plugin.
Administratör
Edmond
Hello,
Thank you for the easy tutorial. It worked so well.
I have one question though. How do you make the custom page you create have its own separate sitemap on the website´s sitemap.xml? Like for example in wpbeginner.com´s sitemap the /hosting-sitemap.xml etc. is it a custom page?
WPBeginner Support
It is a category for our custom post type which is why it has that page.
Administratör
Jorge
I´ve already done this before and it worked, I know that many things can remove the file from where it was but my problem is that it doesn´t allow me to do it again. When I upload the custom page to the server it doesn´t appear on the template options when editing the page. Does someone knows how to solve this?
WPBeginner Support
The most common reason you would want to check is that you haven’t used the same template name and that you’ve uploaded the file to the correct location.
Administratör
AJAY KUMAR
How do we change header path, as I have 2 different headers, so in my custom template I want to use other header, please let me know, how to call or bring header
WPBeginner Support
That would depend on your specific theme and would require some coding knowledge that would not be beginner-friendly.
Administratör
Lance
Beginner? seriously! No beginner could use this blog to get started.
WPBeginner Support
This is more of a beginner developer article that we had users request. If you wanted a more beginner-friendly way to customize a page we would recommend taking a look at our post below on page builders:
https://www.wpbeginner.com/beginners-guide/best-drag-and-drop-page-builders-for-wordpress/
Administratör
Bas
What happens to your custom templates when you update your theme? Since you’re creating that new template within the theme folder. Will the new template be gone?
WPBeginner Support
If you are concerned about the changes being lost, we would recommend creating a child theme to prevent the loss of any changes using our guide below:
https://www.wpbeginner.com/wp-themes/how-to-create-a-wordpress-child-theme-video/
Administratör
Vivek kushwaha
Really Helpful for me
WPBeginner Support
Glad we could be helpful
Administratör
Zack
Hi,
I can’t seem to find page.php in wordpress twentytwenty. Any idea where the template file?
Thanks
WPBeginner Support
That theme uses the singular template, you can create your own page.php but for a better understanding of why it works without that template you would want to take a look at our article here:
https://www.wpbeginner.com/wp-themes/wordpress-template-hierarchy-explained/
Administratör
AmecuxDEV
I really appreciate your help that’s really exactly what I was looking for, thanks so much!
WPBeginner Support
You’re welcome, glad our guide was helpful
Administratör
ammar
Hi,
Great article ! I already create the page template and now I want to make this page only page that does’nt have sidebar when i use this page template. How? Can you help me?
Thank you.
WPBeginner Support
It would depend on your current theme, if you reach out to your theme’s support they should be able to assist
Administratör
Pete Zajonc
Hi-
So close. I have zipped my php file created in notpad++. The contents are the 1 line of code at the top of this article. I click add new theme and upload the zip file. When I click install it starts ok but ends in error. Can you suggest a fix? How do I add the style.css stylesheet? (Sorry, I’m a newbie!)
WPBeginner Support
You would want to go through the article again, this guide is for creating a new page for your current theme not an entirely new theme
Administratör
Faby
Hi, thanks for the article. Is there a way to associate a CSS file to a custom page? Thank you.
WPBeginner Support
You would need to target the page ID in your custom CSS
Administratör
Brendan
exactly what I was looking for, thanks!
WPBeginner Support
Glad our guide could help you
Administratör
Okoji
Thanks for this. It was helpful.
I want to know if there is a way to remove the wordpress header without messing up the page.
WPBeginner Support
It would depend on your specific theme for any issues that would cause. You would likely want to test on a local installation or on a staging environment to see if it would break anything.
Administratör
manoj
why we use page templates insted of page edit screens
WPBeginner Support
Page templates control the area around the content, the editor under Pages>Add New is for the content on the page.
Administratör
Jass
Perfect Article
WPBeginner Support
Thank you
Administratör
terry
Thanks for this tutorial! Is it possible to edit the custom page with Elementor? I get an error ”The preview cannot be loaded.”
WPBeginner Support
You may need to recreate the custom page template with Elementor or reach out to Elementor’s support and they should be able to assist
Administratör
Val
Hi – my problem is the template dropdown menu does not display. The theme displays only: Page attributes / parent / order — whereas I need it to display: Page attributes / parent / Template / order. Do you know how I can get the templates dropdown to display?
WPBeginner Support
Your theme may not have page templates by default as otherwise, they would be under the Page Attributes section.
Administratör
Adrian
Thanks for this wonderful tutorial
WPBeginner Support
You’re welcome
Administratör
shadab awan
thank you admin for always writing great articles on WordPress and SEO.i have a question to ask i hope you help me.
Can we use PHP, Osclass Or Other themes in a WordPress Created classified website?
Thanks
WPBeginner Support
You can use almost any theme to create a site even a classifieds website
Administratör
Ramsey
Please, i need your assistance, i have my website build myself but i am having issues which i know you can help me cause i built my site watching all your videos and article. i want to create the home page then use the home on my MENU on my website so that when people finish reading an article and they want to return home they can easily click on home and return to the home page. please, i need your help on this.
WPBeginner Support
To set up your navigation menu, you would want to take a look at our guide here: https://www.wpbeginner.com/beginners-guide/how-to-add-navigation-menu-in-wordpress-beginners-guide/
Administratör
Steven
I don’t see the Template drop-down in the page attributes?
WPBeginner Support
If you’re using the block editor then you would want to ensure you’re editing the document. If it is not displaying correctly then you would want to double check the file name and that the file was correctly added to your files.
Administratör
Sara
thank you very much. you saved my day.
god bless you.
WPBeginner Support
Glad our article could help
Administratör
Marie
Hi, maybe a stupid question but do I have to create a child theme for this? Or is it protected from theme updates because it is a separately built page?
WPBeginner Support
It would be best to use a child theme for this as it would be a file not found in the most recent version of the theme when you’re updating
Administratör
Mannan Afzal
Really Helpful for me
WPBeginner Support
Glad it was helpful
Administratör
rina
Hi,
Is it possible to add my php template to Elementor?
Thanks
Pedro
Hi! And thanks for your incredibly helpful and resourceful page! I’ve read lots of articles and learned a lot around your site
Using your guide I created my custom page for my ”blog” section (page with the most recent posts that doesn’t have the slider or other features that the Home page has).
My website is bilingual, so I’d like to translate this custom page to my second language… and I can’t find the way to do it.
Your help would be much appreciated.
Thanks in advance!
Khalil
very simple and clear post
nidhi bhatt
hi i want to add html page not php page as a custom template can it be possible ?
Andrew
You can add an HTML page to the website but I wont be a part of the theme. It has to be a .PHP to be part of the theme.
Catherine
I had the same problem. Try another theme, and make sure you upload the file in the right directory. You can see the directory on top when you add a sample page.
OuadiI
please how can i do that when default template option isn’t appearing in dashbord?
thanks
kartik rawal
at the top you see screen options just click on it and check the box says page attributes and now you can see template option
Venky
Thank you for the detailed explanation.
Rakesh Roy
Nice and helpful instructions, but i want to load template from my plugin, when i add the .php file inside my plugin wordpress not showing the drop down .
Isabelle Hunter
Thank you!!! This is so clear and simple and straight forward. I was able to set up a new page temple in under 5 min. I really appreciate what you guys do – and whoever did this video has a great voice and speaks very well for instructions.
Edgar Mlowe
Thanks a lot for this, this post helped while i was creating a custom them which needed me to create a number of custom pages. thumbs up for this!
Jens Eckervogt
Great tutorial!
I love to see how do you have to create custom pages Like table ( flex-wrap with div or about page.
I already made AboutMe-Page with css-embedded picture and more custom pages. That is really excellent! Wordpress makes us rich, right?
Wordpress is like darling / sweetheart Because we want make our blog-websites with money from internet.
And how do I fix contactform of WPForm? Why does WPForm not send e-mail to my google mail. I want try if it works.
Thanks for nice explanations with your nice videos. I am really happy because you save my life and make me reality.
Best kind regards,
Jens Eckervogt
WPBeginner Support
Hey Jens,
Please see our article on how to fix WordPress not sending emails issue.
Administratör
Dave
Are plugins compatible with custom page templates?
For example, if I were to add custom content directly to my page template via a text editor, then upload and select it for the appropriate page (say contact page), how would a plugin (say a contact form), be placed into the custom page?
Thanks
WPBeginner Support
Hi Dave,
Yes they are. Often if you have to add something to a page template, you can do so by using the shortcode or template tags provided by the plugin.
Administratör
Erica
Very helpful! Thankyou!
Vandana
Hi I’m converting HTML template to WORDPRESS,in the i have nave menu like Home,About Us,Courses,Gallery etc,i’m not getting anything when i click on these pages,please help me out
Guatham
You are not getting anything because you should add default navigation links to your website.
Shihab k
i have a custom template page but i can’t connect with menu in normal html menu
Paddy O
Hey.. I needed this to create a page with no header and footer etc different to my template and with a little tweaking it worked perfeclty. Great. Thanks, P
Manpreet Kaur
Hello, Thanks Wpbeginner for all the tutorials. With your tutorials I build a website for the very first time by myself and its going great. I learned so much from you guys.
Jason
Hey i want to make a Wordpress page that goes like this : domain.com/something/PageHere
I cant do that by edditing the permalink, any advice?
Juned
Thank You Very MUCH!!!!!!!!!!!!
Jessika
Hi i have create a wordpress theme from scratch I create a new template call custom template it’s work but when I create a new page in admin panel the content of text does not show but it dispay only the header and footer of my new page.
Any idea please.
Thank you!
Abdur Rahman
Good And also happy to see that One from Pakistan Helping the word
I’m really getting grounded but this post is very excellent
thanks
Vimax
Thank you for the tutorial. I am happy to learn new stuff step by step.
But, When I preview the page with the new template, I don’t have a white page, I have my default theme loaded.
How can I change that?
Fifa
Hey, i used rocked theme but wp-content/theme folder doesnt contain rocked directory? Where should I upload the custom page file? Thanks
shellu
i am facing a problem in wordpress can any one help me
what ever i write any thing on my visual or text editor and when i publish it my web is blank it doesn’t publish any thing .i made a customised website ,waiting for answer
MO
If you inspect your page what do you see?