Kā izveidot pielāgotu WordPress pieteikšanās lapu (Ultimate Guide)

Vai vēlaties izveidot pielāgotu WordPress pieteikšanās lapu savai vietnei?


Ja jūs darbināt WordPress dalības vietni vai tiešsaistes veikalu, tad daudzi no jūsu lietotājiem bieži redzēs pieteikšanās lapu. WordPress noklusējuma pieteikšanās lapas pielāgošana ļauj piedāvāt labāku lietotāja pieredzi.

Šajā galīgajā rokasgrāmatā mēs parādīsim dažādus veidus, kā izveidot pielāgotu WordPress pieteikšanās lapu. Varat arī izmantot šo apmācību, lai izveidotu pielāgotu WooCommerce pieteikšanās lapu.

Kā vietnē viegli izveidot pielāgotu WordPress pieteikšanās lapu

Šis ir tas, ko jūs uzzināsit no šīs rokasgrāmatas.

    Kāpēc jāizveido pielāgota WordPress pieteikšanās lapa?

    WordPress nāk ar jaudīgu lietotāju pārvaldības sistēmu. Tas lietotājiem ļauj izveidot kontus e-komercijas veikalos, dalības vietnēs vai emuārā.

    Pēc noklusējuma pieteikšanās lapā tiek parādīts WordPress zīmols un logotips. Tas ir labi, ja jūs pārvaldāt nelielu emuāru vai arī jūs esat vienīgā persona, kurai ir administratora piekļuve.

    Noklusējuma WordPress pieteikšanās ekrāns

    Tomēr, ja jūsu vietne ļauj lietotājiem reģistrēties un pieteikties, tad pielāgota pieteikšanās lapa piedāvā labāku lietotāja pieredzi.

    Izmantojot savu logo un dizainu, lietotāji var justies kā mājās. Tā kā, novirzot tos uz noklusējuma WordPress pieteikšanās ekrānu, kas izskatās nekas līdzīgs jūsu vietnei, jūsu lietotājiem var šķist aizdomīgi.

    Visbeidzot, noklusējuma pieteikšanās ekrāns nesatur neko citu kā tikai pieteikšanās formu. Izveidojot pielāgotu pieteikšanās lapu, jūs to varat izmantot, lai reklamētu citas lapas vai īpašas akcijas.

    To sakot, apskatīsim dažus pielāgotu WordPress pieteikšanās lapu noformējuma piemērus.

    WordPress pieteikšanās lapas dizaina piemēri

    Vietņu īpašnieki var pielāgot WordPress pieteikšanās lapu, izmantojot dažādus stilus un paņēmienus.

    Daži izveido pielāgotu pieteikšanās lapu, kurā tiek izmantota viņu vietnes tēma un krāsas. Citi modificē noklusējuma pieteikšanās lapu, pievienojot tai pielāgotu fonu, krāsas un savu logotipu.

    1. WPForms

    WPForms

    WPForms ir labākais WordPress saziņas formas spraudnis tirgū. Vienlaicīgi viņu spraudnī ir arī papildinājums, lai izveidotu skaistas WordPress pieteikšanās un reģistrācijas formas, kuras mēs jums parādīsim vēlāk šajā rakstā.

    Viņu pielāgotajā pieteikšanās lapā tiek izmantots divu kolonnu izkārtojums. Kreisajā kolonnā ir pieteikšanās forma, un labo kolonnu izmanto, lai izceltu akcijas un citus aicinājumus uz darbībām. Iepriekš minētajā piemērā viņi izmanto pieteikšanās lapu, lai dalītos savā gada pārskatā. Lai izveidotu unikālu pieteikšanās pieredzi, tas izmanto pielāgotu zīmolu, fona ilustrāciju un zīmola krāsas.

    2. Rok manas kāzas

    Roka manas kāzas

    Vietnes “Rock My Wedding” vietnē tiek izmantots uznirstošais modulis, lai parādītu pieteikšanās un reģistrācijas veidlapu. Uznirstošā loga izmantošanas priekšrocība ir tā, ka lietotāji var pieteikties, neizejot no lapas. Tas viņus ietaupa no jaunas lapas ielādes un piedāvā ātrāku lietotāja pieredzi.

    3. Žaklīna Stīvensa

    Žaklīna Stīvensa

    Jacquelynne Steeves ir mākslas un amatniecības vietne, kurā autore publicē saturu par mājas rotāšanu, vatētu, rakstu, izšuvumu un daudz ko citu. Viņu pieteikšanās lapā tiek izmantots pielāgots fona attēls, kas atbilst viņu vietnes motīvam un pieteikšanās veidlapu labajā pusē.

    4. Baznīcas kustības grafika

    Baznīcas kustības grafika

    Šīs kustības grafikas dizaina uzņēmuma pieteikšanās lapā tiek izmantots krāsains fons, kas atspoguļo viņu biznesa būtību. Tas izmanto to pašu vietnes galveni, kājeni un navigācijas izvēlnes pieteikšanās ekrānā. Pati pieteikšanās forma ir diezgan vienkārša ar tumšu fonu.

    5. MITSLoan Management pārskats

    MITSLoan Management pārskats

    MITSLoan Management Review vietnē tiek izmantots noklusējuma WordPress pieteikšanās ekrāns. WordPress zīmola paslēpšanai tas izmanto pielāgotu CSS ar savu logotipu.

    Priekšpuses pielāgotas pieteikšanās lapas izveidošana programmā WordPress

    Ir vairāki WordPress spraudņi, kurus varat izmantot, lai WordPress izveidotu priekšpusē pielāgotu pieteikšanās lapu. Mēs parādīsim divus dažādus spraudņus, un jūs varat izvēlēties sev vispiemērotāko.

    WordPress pieteikšanās lapas izveidošana, izmantojot tēmu Mana pieteikšanās

    Pirmais, kas jums jādara, ir instalēt un aktivizēt spraudni Tēma Mana pieteikšanās. Lai iegūtu sīkāku informāciju, skatiet mūsu soli pa solim, kā instalēt WordPress spraudni.

    Pēc aktivizēšanas tēma Mana pieteikšanās automātiski izveido vietrāžus URL jūsu pielāgotajai pieteikšanās, atteikšanās, reģistrācijas, aizmirstās paroles un paroles atiestatīšanas darbībām..

    Šos WordPress pieteikšanās URL varat pielāgot, apmeklējot vietni Tēma Mana pieteikšanās »Vispārīgi lappuse. Ritiniet uz leju līdz sadaļai “Lodes”, lai modificētu šos vietrāžus URL, kurus spraudnis izmanto pieteikšanās darbībām.

    Tēma Manas pieteikšanās lapas

    Tēma Mana pieteikšanās ļauj arī izmantot īskodus, lai izveidotu pielāgotas pieteikšanās un reģistrācijas lapas. Jūs varat vienkārši izveidot lapu katrai darbībai un pēc tam šeit pievienot lapas logu, lai spraudnis varētu pareizi atrast un novirzīt lietotājus.

    Sāksim ar pieteikšanās lapu.

    Dodieties uz Lapa »Pievienot jaunu lai izveidotu jaunu WordPress lapu. Jums jāpiešķir savai lapai nosaukums un pēc tam satura apgabalā jāievada šāds īss kods “[theme-my-login]”..

    Notiek īskoda pievienošana

    Tagad jūs varat publicēt savu lapu un priekšskatīt to, lai redzētu, kā darbojas jūsu pielāgotā pieteikšanās lapa.

    Pielāgota WordPress pieteikšanās lapa

    Atkārtojiet procesu, lai izveidotu citas lapas, izmantojot šādus īskodus.

    [theme-my-login action = ”register”] reģistrācijas veidlapai.

    [theme-my-login action = ”lostpassword”] ​​pazaudētās paroles lapai.

    [theme-my-login action = ”resetpass”] izmantojiet to paroles atiestatīšanas lapā.

    Pielāgotas WordPress pieteikšanās lapas izveidošana, izmantojot WPForms

    WPForms ir labākais WordPress formu veidotāju spraudnis tirgū. Tas ļauj jums viegli izveidot pielāgotas pieteikšanās un reģistrācijas veidlapas savai vietnei.

    WPForms ir premium WordPress spraudnis, un, lai piekļūtu lietotāju reģistrācijas papildinājumam, jums būs nepieciešams vismaz viņu profesionālais plāns. WPBeginner lietotāji var saņemt 50% atlaidi, izmantojot mūsu WPForms kupona kodu: SAVE50

    Pirmais, kas jums jādara, ir instalēt un aktivizēt WPForms spraudni. Lai iegūtu sīkāku informāciju, skatiet mūsu soli pa solim, kā instalēt WordPress spraudni.

    Pēc aktivizēšanas jums jāapmeklē WPForms »Iestatījumi lapā, lai ievadītu licences atslēgu. Šo informāciju varat atrast savā kontā WPForms vietnē.

    WPForms licence

    Pēc licences atslēgas ievadīšanas jūs varēsit instalēt papildinājumus. Iet uz priekšu un apmeklējiet WPForms »Papildinājumi un atrodiet lietotāja reģistrācijas pievienojumprogrammu.

    Instalējiet lietotāja reģistrācijas papildinājumu

    Pēc tam noklikšķiniet uz pogas Instalēt papildinājumu, lai lejupielādētu un aktivizētu papildinājumu. Tagad jūs esat gatavs izveidot savas pielāgotās pieteikšanās formas.

    Dodieties uz WPForms »Pievienot jaunu lapu un ritiniet uz leju līdz veidnei Lietotāja pieteikšanās forma. Lai turpinātu, jums jānoklikšķina uz pogas “Izveidot lietotāja pieteikšanās formu”.

    Izveidojiet pieteikšanās formu

    WPForms ielādēs lietotāja pieteikšanās formu ar nepieciešamajiem laukiem. Jūs varat noklikšķināt uz laukiem, lai pievienotu aprakstu vai tekstu ap tiem.

    WPForms veidotājs

    Jūs varat mainīt arī citus iestatījumus. Piemēram, tas automātiski pievieno pogas nosaukumam “Iesniegt”. Jūs varat noklikšķināt uz tā un pēc tam mainīt to uz Login.

    Veidlapas iestatījumi

    Varat arī izlemt, kas notiek, kad lietotājs ir veiksmīgi pieteicies. Dodieties uz Iestatījumi »Apstiprinājums cilni un atlasiet darbību.

    Novirzīt reģistrētos lietotājus

    Jūs varat novirzīt lietotāju uz jebkuru citu URL, novirzīt viņu uz mājas lapu vai vienkārši parādīt viņam ziņojumu, ka viņš tagad ir pieteicies.

    Kad esat apmierināts ar veidlapas iestatījumiem, noklikšķiniet uz pogas Saglabāt ekrāna augšējā labajā stūrī un aizveriet veidlapas veidotāju.

    Pielāgotas pieteikšanās formas pievienošana WordPress lapai

    WPForms padara ļoti ērti pievienot savu pielāgoto pieteikšanās formu jebkurai WordPress ziņai vai lapai.

    Vienkārši rediģējiet lapu, kurai vēlaties pievienot pieteikšanās formu, vai izveidojiet jaunu. Lapas rediģēšanas ekrānā savam apgabalam pievienojiet WPForms bloku.

    WPForms bloka pievienošana ziņai

    Pēc tam atlasiet iepriekš izveidoto pieteikšanās formu, un WPForms bloks automātiski ielādēs to satura apgabalā.

    Pieteikšanās formas priekšskatījums

    Tagad varat turpināt rediģēt pieteikšanās veidlapas lapu vai saglabāt un publicēt izmaiņas.

    WordPress pieteikšanās formas lapas dizaina pielāgošana

    Pēc noklusējuma jūsu pielāgotajā WordPress pieteikšanās veidlapas lapā tiks izmantota motīva lapas veidne un stili. Tam būs jūsu motīva navigācijas izvēlnes, galvenes, kājenes un sānjoslas logrīki.

    Ja vēlaties pilnībā pārņemt visu lapu un kaut ko noformēt no nulles, varat izmantot WordPress lapu veidotāja spraudni.

    Izmantojot lapu veidotāja spraudni, varat izveidot pielāgotu lapas izkārtojumu un pēc tam pievienot pieteikšanās formas logrīku, ko nodrošina tēma Mana pieteikšanās vai WPForms.

    Zemāk esošajā ekrānuzņēmumā mēs esam izmantojuši populāro spraudni Beaver Builder. Pilnekrāna izkārtojumā mēs izmantojām fona attēlu un pēc tam pievienoja divas kolonnas. Vienā kolonnā mēs pievienojām tekstu un pogu. Otrā kolonnā mēs pievienojām logrīku WPForms.

    Pielāgotas pieteikšanās lapas izveidošana, izmantojot lapu veidotāja spraudni

    Beaver Builder priekšrocība ir tā, ka tas ir 100% vilkšanas un nomešanas risinājums.

    Piezīme: Tā kā jūs jau esat pieteicies, gan tēma Mana pieteikšanās, gan WPForms spraudņi, iespējams, neparādīs pieteikšanās formas tiešo priekšskatījumu. WPForms spraudnim ir opcija, kur to var izslēgt formas iestatījumos.

    Ja WordPress lapu veidotāju spraudņi nav jūsu lieta, tad veidlapas un pašas pieteikšanās lapas stila veidošanai varat izmantot pielāgotu CSS. Varat arī izmantot CSS Hero spraudni, lai viegli pievienotu pielāgotos CSS stilus.

    Mainiet WordPress pieteikšanās logotipu un URL

    Jums ne vienmēr ir jāizveido pilnībā pielāgota WordPress pieteikšanās lapa jūsu vietnei. Faktiski daudzas vietnes vienkārši aizvieto WordPress logotipu un logotipa URL, vienlaikus izmantojot noklusējuma pieteikšanās lapu.

    Ja vēlaties aizstāt WordPress logotipu pieteikšanās ekrānā ar savu logo, tad to var viegli izdarīt, izmantojot WordPress spraudni vai pievienojot pielāgotu kodu. Mēs parādīsim abas metodes, kuras varat izmantot, lai jūs varētu vispiemērotāk.

    Mainiet WordPress pieteikšanās logotipu un URL, izmantojot spraudni

    Pirmais, kas jums jādara, ir instalēt un aktivizēt Colorlib Login Customizer. iespraust. Lai iegūtu sīkāku informāciju, skatiet mūsu soli pa solim, kā instalēt WordPress spraudni.

    Pēc aktivizēšanas spraudnis WordPress administratora sānu joslai pievieno jaunu izvēlnes vienumu ar nosaukumu “Login Customizer”. Noklikšķinot uz tā, tiks atvērts pieteikšanās pielāgošanas rīks.

    Pieteikšanās pielāgotājs

    Pieteikšanās pielāgošanas rīks ielādēs noklusējuma WordPress pieteikšanās ekrānu ar pielāgošanas iespējām kreisajā pusē un tiešo priekšskatījumu labajā pusē.

    Lai aizstātu WordPress logotipu ar savu, noklikšķiniet uz cilnes Logotipa opcijas labajā pusē. Šeit jūs varat paslēpt WordPress logotipu, augšupielādēt savu pielāgoto logotipu, mainīt logotipa URL un tekstu.

    Augšupielādējiet pielāgoto logotipu pieteikšanās lapā

    Spraudnis ļauj arī pilnībā pielāgot WordPress noklusējuma pieteikšanās lapu. Varat pievienot kolonnas, fona attēlu, mainīt pieteikšanās formas krāsas un daudz ko citu.

    Būtībā jūs varat izveidot pielāgotu WordPress pieteikšanās lapu, nemainot WordPress noklusējuma pieteikšanās URL.

    Kad esat pabeidzis, vienkārši noklikšķiniet uz publicēšanas pogas, lai saglabātu izmaiņas. Tagad varat apmeklēt WordPress pieteikšanās lapu, lai redzētu, kā darbojas jūsu pielāgotā pieteikšanās forma.

    Pielāgota WordPress pieteikšanās lapa ar pielāgotu logotipu

    Mainīt WordPress pieteikšanās logotipu un URL bez spraudņa (kods)

    Šī metode ļauj manuāli aizstāt WordPress logotipu pieteikšanās ekrānā ar savu pielāgoto logotipu.

    Pirmkārt, jums ir jāaugšupielādē pielāgotais logotips multivides bibliotēkā. Iet uz Multivide »Pievienot jaunu un augšupielādējiet pielāgoto logotipu.

    Kad esat augšupielādējis attēlu, noklikšķiniet uz saites Rediģēt blakus tam. Tiks atvērta rediģēšanas multivides lapa, kurā jums jākopē faila URL un jāielīmē tukšā teksta failā datorā.

    Tālāk sava motīva function.php failam vai vietnes specifiskajam spraudnim jāpievieno šāds kods.

    funkcija wpb_login_logo () { ?>

    #login h1 a, .login h1 a {
    fona attēls: url (http: //path/to/your/custom-logo.png);
    augstums: 100 pikseļi;
    platums: 300 pikseļi;
    fona izmērs: 300 pikseļi 100 pikseļi;
    fonu atkārtot: neatkārtot;
    polsterējuma dibens: 10 pikseļi;
    }

    <?php}
    add_action (‘login_enqueue_scripts’, ‘wpb_login_logo’);

    Neaizmirstiet aizstāt fona attēla URL ar faila URL, kuru iepriekš nokopējāt. Varat arī pielāgot citus CSS rekvizītus, lai tie atbilstu jūsu pielāgotā logotipa attēlam.

    Tagad varat apmeklēt WordPress pieteikšanās lapu, lai redzētu, kā darbojas jūsu pielāgotais logotips.

    WordPress pieteikšanās lapa ar pielāgotu logotipu

    Šis kods aizstāj tikai WordPress logotipu. Tas nemaina logotipa saiti, kas norāda uz vietni WordPress.org.

    Mainīsim to.

    Vienkārši pievienojiet šo kodu sava motīva function.php failam vai vietnei raksturīgam spraudnim. Šo kodu varat pievienot tieši zem iepriekš pievienotā koda.

    funkcija wpb_login_logo_url () {
    atgriezties home_url ();
    }
    add_filter (‘login_headerurl’, ‘wpb_login_logo_url’);

    funkcija wpb_login_logo_url_title () {
    atgriezt ‘Jūsu vietnes nosaukums un informācija’;
    }
    add_filter (‘login_headertitle’, ‘wpb_login_logo_url_title’);

    Neaizmirstiet aizstāt vietni “Jūsu vietnes nosaukums un informācija” ar vietnes faktisko nosaukumu. Pielāgotais logotips jūsu pieteikšanās ekrānā tagad norādīs uz jūsu vietnes sākumlapu.

    Tas ir viss. Mēs ceram, ka šis raksts jums palīdzēja uzzināt dažādus veidus, kā izveidot WordPress pieteikšanās lapu savai vietnei. Varat arī apskatīt mūsu galveno WordPress drošības rokasgrāmatu, kurā sniegti padomi, kā uzlabot WordPress pieteikšanās drošību.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me