Lösenordsskydd hjälper till att hålla vissa sidor privata, och det är mycket enkelt att skapa en anpassad lösenordsskyddad sida på din WordPress-webbplats.
WordPress standardsida för lösenordsinmatning ser dock enkel och oattraktiv ut. Så du kanske vill ändra det med några enkla anpassningar.
Den här artikeln guidar dig genom steg-för-steg-processen för att anpassa en lösenordsskyddad sida i WordPress.
Varför anpassa lösenordsskyddade sidor i WordPress?
Om du vill skapa ett inlägg eller en sida på din WordPress-blogg som bara ska vara synlig för utvalda kunder eller medlemmar kan du låsa den med hjälp av lösenordsskyddet.
På samma sätt kan du använda en lösenordsskyddad sida om du skapar en ny WordPress-webbplats och inte vill att alla ska kunna se den.
Standarddesignen för den password-skyddade page är dock mycket grundläggande och ej attraktiv. Här är en preview av hur det gillar att se ut:
Genom att anpassa den lösenordsskyddade sidan kan du ändra dess design och layout. Detta bidrar till att göra sidan mer engagerande och du kan matcha den med ditt varumärke för att få ett mer professionellt utseende och en bättre användarupplevelse.
I följande avsnitt visar vi dig hur du aktiverar lösenordsskydd i WordPress. Vi berättar också om olika sätt att anpassa en viss sida, hela webbplatsen och olika avsnitt.
Använd gärna snabblänkarna nedan för att hoppa vidare till det avsnitt du föredrar:
Är du redo att förnya din lösenordsskyddade siddesign? Låt oss komma igång!
Så här lösenordsskyddar du en sida i WordPress
Innan vi visar hur du anpassar en WordPress-sida bör du veta att WordPress har inbyggda inställningar för att lösenordsskydda dina sidor och inlägg.
Allt du behöver göra är att redigera en sida eller lägga till en ny. När du är i WordPress innehållsredigerare klickar du på alternativet ”Offentlig” under ”Status & synlighet” i inställningspanelen till höger.
Därefter kommer du att se olika alternativ för ”Post Visibility”.
Välj bara alternativet ”Lösenordsskyddad” och ange ett lösenord för din sida.
Gå nu vidare och klicka på ”Uppdatera” eller ”Publicera”.
Du kan nu besöka din webbplats och se den lösenordsskyddade sidan i aktion.
Låt oss nu se hur du kan customize din standard password-skyddade page.
Metod 1: Anpassa standard lösenordsskyddad design med hjälp av CSS Hero
När du aktiverar password protection från din WordPress content editor, använder sidan din sites theme för styling.
För att customize sidan kan du helt enkelt använda ett verktyg som gillar CSS Hero. Det låter dig editera designen och layouten på din page utan att redigera kod.
Först måste du installera och aktivera CSS Hero plugin. För mer detaljer, vänligen se vår guide om hur man installerar ett plugin för WordPress.
Efter aktivering kommer alternativet CSS hero att läggas till i WordPress admin bar högst upp. Gå vidare och klicka på alternativet ”Customize with CSS Hero”.
Detta kommer att starta CSS Hero visual builder, där du kan redigera och customize din page.
Börja med att clicka på valfritt element på page.
Därefter kan du ändra bakgrundsfärgerna, lägga till en bakgrundsbild, använda ett annat teckensnitt, redigera avstånd och mycket mer från panelen till vänster.
Låt oss till exempel gå till fliken ”Bakgrund” och lägga till en lutande bakgrundsfärg. Vi ändrar också färgen på rutan där användarna måste skriva in lösenordet och färgen på ”Enter”-knappen .
Dessutom kan du lägga till en ram runt huvudheadingen på page genom att gå till tabben Borders.
Välj bara kantbredd, färg, stil och andra ändringar som du gillar.
När du är klar med anpassningarna ska du komma ihåg att klicka på knappen ”Save & Publish” längst ned.
Du kan nu besöka din webbplats och se den anpassade lösenordsskyddade standardsidan.
Nackdelen med att använda CSS Hero är att det inte erbjuder den flexibilitet och de avancerade anpassningsalternativ som en landningssidebyggare erbjuder.
Du kan till exempel inte lägga till element som kontaktformulär, knappar för sociala medier, opt-in-formulär, nedräkningstimer med mera med CSS Hero.
Med detta i åtanke ska vi nu se hur du kan använda en landningssidesbyggare för att anpassa specifika lösenordsskyddade sidor i WordPress.
Metod 2: Anpassa en specifik lösenordsskyddad sida med SeedProd
Att anpassa en specifik lösenordsskyddad sida är enklast med SeedProd , som är den bästa webbplats- och sidbyggaren för WordPress.
För denna handledning kommer vi att använda SeedProd Pro-versionen eftersom den innehåller premiummallar och fler anpassningsfunktioner. Men du kan börja med SeedProd Lite version och skapa en kommande-snart-sida gratis.
Låt oss först installera och aktivera SeedProd-pluginet. Om du behöver hjälp kan du läsa vår guide om hur du installerar ett WordPress-plugin.
Efter aktivering kommer du att se SeedProds välkomstskärm i din WordPress-instrumentpanel.
Härifrån måste du ange licensnyckeln och klicka på knappen ”Verifiera nyckel” för att aktivera SeedProd Pro. Din licensnyckel finns i ditt SeedProd-kontoområde.
Efter det, låt oss gå över till SeedProd ” Landningssidor från din WordPress instrumentpanel och lägga till en ny anpassad lösenordsskyddad landningssida.
Senare i den här artikeln visar vi hur du väljer vilka pages som ska skyddas med password. You can password-protect entire your site or only specific pages.
I den här tutorialen skapar vi en Coming Soon page för en website som ska lanseras med password-skydd. Du kan dock enkelt customize din design om du bara använder den för att skydda specifika pages med password.
För att börja klickar du bara på knappen ”Skapa en Coming Soon-sida”.
På nästa skärm kommer SeedProd att visa dig olika sidmallar så att du snabbt kan anpassa dem.
Gå vidare och håll muspekaren över den mall du vill använda och klicka på den orangea bockknappen.
Efter att ha valt en template kommer SeedProd att öppna en popup med titeln ”Enter your new page details”.
Du behöver bara välja ett sidnamn och en URL-slug och sedan klicka på knappen ”Save and Start Editing the Page”.
Detta kommer att starta SeedProd dra-och-släpp-sidbyggaren.
Här kan du anpassa din lösenordsskyddade landningssida och lägga till olika element som text, bilder, knappar med mera.
SeedProd erbjuder också avancerade block som ett opt-in-formulär, kontaktformulär, nedräkningstimer, förloppsindikator, sociala delningsalternativ och mer.
Du lägger till ett element genom att dra ett block från menyn till vänster och släppa det på mallen till höger. Anpassa sedan elementet genom att klicka på det och justera de alternativ som visas.
Det är också på detta sätt som SeedProd låter dig lägga till ett lösenordsformulär på framsidan av din sida för att skydda ditt innehåll.
Först kan du add to ett ”Custom HTML” block i SeedProd byggaren. Dra och släpp helt enkelt Custom HTML blocket på templaten.
Därefter kan du klicka på blocket ’Anpassad HTML’.
Härifrån kommer du att vilja ange kortkoden [seed_bypass_form] i fältet ”Anpassad kod”.
Glöm inte att klicka på knappen ”Spara” när du är klar. Och så var det klart!
Nu integrerar SeedProd också med olika e-postmarknadsföringstjänster. Du kan lägga till ett kontaktformulär på din landningssida och ansluta ett e-postmarknadsföringsverktyg för att bygga din e-postlista och hålla kontakten med användarna.
Gå bara till fliken ”Connect” i landningssidebyggaren och välj din e-postmarknadsföringstjänst.
Inställning av lösenordsskydd för specifika pages i SeedProd
Efter att ha skapat en anpassad kommande snart-sida som använder kortkoden [seed_bypass_form] är nästa steg att ställa in lösenordsskydd på specifika sidor med SeedProd.
För att börja kan du gå till fliken ”Sidinställningar” i SeedProd-byggaren och klicka på inställningarna för ”Åtkomstkontroll”.
Därefter anger du bara ett lösenord i fältet ”Bypass URL” som andra kan använda för att komma åt ditt begränsade innehåll.
Observera att den text du skriver i fältet ”Bypass URL” kommer att fungera som lösenord och även som en länk som kunder och teammedlemmar kan använda för att kringgå lösenordsskyddet och komma åt sidan.
SeedProd låter dig utesluta specifika webbadresser från dina webbplatser, till exempel admin, inloggning, instrumentpanel och konto. Detta säkerställer att webbplatsägare inte blir utestängda från sina webbplatser.
Nu måste du välja vilka URL:er som ska skyddas med password.
Bläddra bara ner till avsnittet ”Inkludera/exkludera webbadresser” under inställningarna för ”Åtkomstkontroll”. Därefter väljer du alternativet ”Inkludera webbadresser” och anger sedan de specifika sidor du vill begränsa.
När du är klar klickar du bara på knappen ”Save” högst upp.
Därefter kan du gå till inställningarna ”Allmänt” under fliken ”Sidinställningar” och ändra sidans status från ”Utkast” till ”Publicera”.
Efter det kan du stänga landningssidesbyggaren och gå till SeedProd ” Landningssidor från din WordPress adminpanel.
Härifrån klickar vi på vippan under ”Coming Soon Mode” för att aktivera din anpassade lösenordsskyddade sida.
Det är allt!
Du har nu skapat en egen lösenordsskyddad landningssida som bara visas på specifika sidor i WordPress.
Besök bara dessa pages på your website för att se den customize-skydda password-sidan i action.
Bonus tips: Fler användningsfall för anpassade lösenordsskyddade sidor
Vill du utforska fler sätt att använda lösenordsskydd på din WordPress-webbplats? Här är 2 tips för att höja nivån på din webbplats lösenordsskyddade sida.
Tips 1: Skapa en anpassad lösenordsskyddad sida för hela webbplatsen
Med SeedProd kan du också visa din password-skyddade sida på varje page på din website. På så sätt måste användarna enter ett password för att få tillgång till något av ditt content.
Först kan du gå till SeedProd ” Landningssidor från din WordPress instrumentpanel. Klicka sedan på knappen ”Redigera sida” i panelen ”Coming Soon Mode”.
Därefter vill du gå över till fliken ”Sidinställningar” högst upp och gå till inställningarna för ”Åtkomstkontroll”.
Därefter kan du bläddra ner till avsnittet ”Inkludera/exkludera webbadresser” och välja alternativet ”Visa på hela webbplatsen”.
När du har gjort ändringarna, gå vidare och klicka på knappen ”Spara” längst upp. SeedProd kommer då att visa den anpassade lösenordsskyddade sidan på hela din webbplats.
Tips 2: Skapa egna lösenordsskyddade sektioner i WordPress
Du kan också lösenordsskydda olika webbplatsavsnitt i WordPress från olika användargrupper. Detta är användbart om du driver en medlemswebbplats och vill kontrollera åtkomsten till ditt innehåll, dina plugins, appar och andra nedladdningsbara filer.
Det bästa sättet att begränsa olika delar av din webbplats är att använda MemberPress.
Det är det bästa medlemskapspluginet för WordPress som låter dig skapa flera medlemsnivåer för att lösenordsskydda ditt innehåll.
Du kan använda MemberPress för att ställa in olika regler så att användarna bara får tillgång till innehåll baserat på deras medlemsnivå. Mer information finns i vår guide om hur du skapar en medlemssajt på WordPress.
För att börja måste du först add to medlemskap till din website. Gå bara till MemberPress ” Medlem skap från din WordPress dashboard och klicka på knappen ”Add New”.
Därefter kan du ange ett namn för din medlemsnivå, lägga till en beskrivning och ange ett pris.
Du kan också ändra faktureringstypen från engångsfakturering till återkommande fakturering samt redigera medlemskapet så att det blir livstids eller upphör efter en viss tidsperiod.
Glöm inte att klicka på knappen ”Publicera” när du är klar.
Därefter kan du gå till MemberPress ” Regler från din WordPress-panel och klicka på knappen ” Lägg till ny”.
Härifrån kan du klicka på rullgardinsmenyn under alternativet ”Skyddat innehåll”.
MemberPress erbjuder många alternativ för att skydda ditt innehåll, oavsett om det är en enda sida eller alla dina WordPress-sidor. I den här handledningen kommer vi att lösenordsskydda en enda sida.
Så låt oss välja alternativet ”En enda sida” från rullgardinsmenyn och ange titeln på sidan.
Därefter måste du ställa in åtkomstvillkoren och konfigurera vem som kan viewa den begränsade page. Med MemberPress kan du skydda content baserat på medlemsnivå, WordPress användarens roll, capability och enskilda medlemmar.
Låt oss ställa in ”Medlemskap” till ”Premium” från rullgardinsmenyerna för denna handledning. På så sätt kommer endast premiummedlemmar att kunna komma åt sidan. Du kan lägga till fler villkor och tillåta mer än 1 medlemsnivå att visa sidan.
När du är klar, glöm inte att klicka på knappen ”Spara regel”.
Du kan sedan besöka din webbplats för att se den lösenordsskyddade sidan i aktion. Medlemmarna måste nu logga in på sina konton för att se innehållet på sidan.
Vill du göra mer?
Du kan skapa lösenord för dina videor eller erbjuda gruppmedlemskap för företagsteam. Dessutom kan du skapa ett lösenord för att ge prenumeranter tillgång till ett betalt nyhetsbrev och mycket mer.
Vi har också en guide till hur du skyddar dina formulär med password i WordPress.
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du anpassar en lösenordsskyddad sida i WordPress. Du kanske också vill se vår guide om hur du skyddar innehåll i WordPress eller våra expertval av de bästa plugin-programmen för innehållsskydd 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.
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!
Maurice
Hi,
When I follow the instructions for a password protected page… and logout.
Then open in an other browser the url-link to that page, I do fill in the password but then also pops up an Admin login? So I can not share these pages…
How can that be?
Thank you.
WPBeginner Support
We would recommend checking that your site is not in coming soon or a membership site that would require a user to view the content as that is the most common reason for that issue.
Administratör