Kaip sukurti tinkintą „WordPress“ prisijungimo puslapį (pagrindinis vadovas)

Ar norite sukurti tinkintą „WordPress“ prisijungimo puslapį savo svetainei?


Jei naudojate „WordPress“ narystės svetainę ar internetinę parduotuvę, daugelis jūsų vartotojų dažnai matys prisijungimo puslapį. Numatytojo „WordPress“ prisijungimo puslapio tinkinimas leidžia jums pasiūlyti geresnę vartotojo patirtį.

Šiame galutiniame vadove mes parodysime įvairius būdus, kaip sukurti tinkintą „WordPress“ prisijungimo puslapį. Šią mokymo programą taip pat galite naudoti kurdami tinkintą „WooCommerce“ prisijungimo puslapį.

Kaip lengvai sukurti tinkintą „WordPress“ prisijungimo puslapį savo svetainei

Štai ko išmoksite iš šio vadovo.

    Kodėl reikia sukurti tinkintą „WordPress“ prisijungimo puslapį?

    „WordPress“ aprūpinta galinga vartotojų valdymo sistema. Tai leidžia vartotojams susikurti paskyras el. Prekybos parduotuvėse, narystės svetainėse ar tinklaraštyje.

    Pagal numatytuosius nustatymus prisijungimo puslapyje rodomas „WordPress“ prekės ženklas ir logotipas. Tai gerai, jei tvarkote mažą tinklaraštį arba esate vienintelis asmuo, turintis prieigą prie administratoriaus.

    Numatytasis „WordPress“ prisijungimo ekranas

    Tačiau jei jūsų svetainė leidžia vartotojams registruotis ir prisijungti, tada tinkintas prisijungimo puslapis siūlo geresnę vartotojo patirtį.

    Naudodamiesi savo logotipu ir dizainu, vartotojai gali jaustis kaip namuose. Nukreipę juos į numatytąjį „WordPress“ prisijungimo ekraną, kuris atrodo ne taip, kaip jūsų svetainė, jūsų vartotojams gali atrodyti įtartinai.

    Galiausiai, numatytajame prisijungimo ekrane nėra nieko, išskyrus prisijungimo formą. Sukūrę pasirinktinį prisijungimo puslapį galite jį panaudoti reklamuodami kitus puslapius ar specialias akcijas.

    Atsižvelgiant į tai, pažvelkime į keletą tinkintų „WordPress“ prisijungimo puslapių dizaino pavyzdžių.

    „WordPress“ prisijungimo puslapio dizaino pavyzdžiai

    Svetainių savininkai gali tinkinti „WordPress“ prisijungimo puslapį naudodami skirtingus stilius ir metodus.

    Kai kurie sukuria pasirinktinį prisijungimo puslapį, kuriame naudojama jų svetainės tema ir spalvos. Kiti modifikuoja numatytąjį prisijungimo puslapį pridėdami prie jo pasirinktinį foną, spalvas ir savo logotipą.

    1. „WPForms“

    „WPForms“

    „WPForms“ yra geriausias „WordPress“ kontaktinės formos papildinys rinkoje. Taip pat, jų įskiepyje taip pat yra priedas, skirtas sukurti gražias „WordPress“ prisijungimo ir registracijos formas, kurias vėliau parodysime šiame straipsnyje.

    Jų tinkintame prisijungimo puslapyje naudojamas dviejų stulpelių išdėstymas. Kairiajame stulpelyje yra prisijungimo forma, o dešinysis stulpelis naudojamas akcijoms ir kitiems raginimams veikti pabrėžti. Aukščiau pateiktame pavyzdyje jie naudojasi prisijungimo puslapiu, norėdami pasidalyti savo metine ataskaita. Norėdami sukurti unikalią prisijungimo patirtį, jis naudoja pasirinktinį prekės ženklą, fono iliustracijas ir prekės ženklo spalvas.

    2. Roko mano vestuves

    Rokas Mano vestuvės

    „Rock My Wedding“ svetainėje naudojamas iššokantis modulis, kad būtų rodoma prisijungimo ir registracijos forma. Iššokančiojo telefono pranašumas yra tas, kad vartotojai gali prisijungti neišeidami iš puslapio. Tai taupo juos iš naujo puslapio įkėlimo ir suteikia greitesnę vartotojo patirtį.

    3. Jacquelynne Steves

    Jacquelynne Steves

    „Jacquelynne Steeves“ yra menų ir amatų svetainė, kurioje autorius skelbia turinį apie namų dekoravimą, antklodžių, raštų, siuvinėjimų ir dar daugiau. Jų prisijungimo puslapyje naudojamas tinkintas fono vaizdas, atitinkantis jų svetainės temą su prisijungimo forma dešinėje.

    4. Bažnyčios judesio grafika

    Bažnyčios judesio grafika

    Šios judesio grafikos dizaino įmonės prisijungimo puslapyje naudojamas spalvingas fonas, atspindintis jų verslą. Prisijungimo ekrane naudojama ta pati svetainės antraštė, poraštė ir naršymo meniu. Pati prisijungimo forma yra gana paprasta su tamsiu fonu.

    5. MITSLoan Management apžvalga

    MITSLoan Management apžvalga

    „MITSLoan Management Review“ svetainė naudoja numatytąjį „WordPress“ prisijungimo ekraną. „WordPress“ prekės ženklui paslėpti ji naudoja pasirinktinę CSS su savo logotipu.

    „WordPress“ tinkinto prisijungimo puslapio kūrimas

    Yra keli „WordPress“ papildiniai, kuriuos galite naudoti norėdami sukurti „WordPress“ pritaikytą prisijungimo puslapį. Mes parodysime du skirtingus papildinius ir galėsite pasirinkti jums tinkamiausią.

    „WordPress“ prisijungimo puslapio sukūrimas naudojant temą „Mano prisijungimas“

    Pirmiausia turite įdiegti ir suaktyvinti papildinį „Tema mano prisijungimas“. Norėdami gauti daugiau informacijos, skaitykite mūsų nuoseklų vadovą, kaip įdiegti „WordPress“ papildinį.

    Suaktyvinus „Theme My Login“ automatiškai sukuria tinkinto prisijungimo, atsijungimo, registracijos, pamiršto slaptažodžio ir slaptažodžio nustatymo veiksmų URL..

    Galite tinkinti šiuos „WordPress“ prisijungimo URL apsilankę Tema Mano prisijungimas »Bendra puslapis. Slinkite žemyn iki skyriaus „Šliužai“, kad pakeistumėte šiuos URL, kuriuos papildinys naudoja prisijungimo veiksmams.

    Tema Mano prisijungimo puslapiai

    Tema „Mano prisijungimas“ taip pat leidžia naudoti trumpuosius kodus, kad sukurtumėte pasirinktinius prisijungimo ir registracijos puslapius. Galite tiesiog sukurti kiekvieno veiksmo puslapį ir tada pridėti puslapio šliuzą čia, kad papildinys galėtų tinkamai rasti ir nukreipti vartotojus.

    Pradėkime nuo prisijungimo puslapio.

    Eikite į Puslapis »Pridėti naują norėdami sukurti naują „WordPress“ puslapį. Turite duoti savo puslapio pavadinimą ir tada turinio srityje įveskite šį trumpąjį kodą „[tema-mano prisijungimas]“..

    Pridedamas trumpasis kodas

    Dabar galite paskelbti savo puslapį ir jį peržiūrėti, kad pamatytumėte, kaip veikia tinkintas prisijungimo puslapis.

    Individualizuotos „WordPress“ prisijungimo puslapis

    Pakartokite procesą, kad sukurtumėte kitus puslapius naudodami šiuos trumpus kodus.

    [theme-my-login action = ”register”] registracijos formai gauti.

    [tema-mano prisijungimo veiksmas = “lostpassword”] ​​pamestas slaptažodžio puslapis.

    [theme-my-login action = ”resetpass”] naudokite jį slaptažodžio nustatymo iš naujo puslapyje.

    Pasirinktinio „WordPress“ prisijungimo puslapio sukūrimas naudojant „WPForms“

    „WPForms“ yra geriausias „WordPress“ formų kūrimo priemonės papildinys rinkoje. Tai leidžia lengvai susikurti tinkintas prisijungimo ir registracijos formas savo svetainei.

    „WPForms“ yra „WordPress“ papildinys ir jums reikės bent jau jų profesinio plano, kad galėtumėte pasiekti vartotojo registracijos priedą. WPBeginner vartotojai gali gauti 50% nuolaidą naudodamiesi mūsų WPForms kupono kodu: SAVE50

    Pirmas dalykas, kurį jums reikia padaryti, tai įdiegti ir suaktyvinti „WPForms“ papildinį. Norėdami gauti daugiau informacijos, skaitykite mūsų nuoseklų vadovą, kaip įdiegti „WordPress“ papildinį.

    Aktyvavus reikia apsilankyti WPForms »Nustatymai puslapyje įveskite licencijos raktą. Šią informaciją galite rasti savo paskyroje „WPForms“ svetainėje.

    „WPForms“ licencija

    Įvedę licencijos raktą, galėsite įdiegti priedus. Eik į priekį ir apsilankyk WPForms »priedai puslapyje ir suraskite Vartotojo registracijos priedą.

    Įdiekite vartotojo registracijos priedą

    Tada spustelėkite mygtuką Įdiegti priedą, kad atsisiųstumėte ir suaktyvintumėte priedą. Dabar esate pasiruošę sukurti savo pasirinktines prisijungimo formas.

    Eikite į WPForms »Pridėti naują puslapyje ir slinkite žemyn iki „Vartotojo prisijungimo formos“ šablono. Norėdami tęsti, turite spustelėti mygtuką „Sukurti vartotojo prisijungimo formą“.

    Sukurti prisijungimo formą

    „WPForms“ įkels vartotojo prisijungimo formą su reikiamais laukais. Galite spustelėti laukus, kad aplink juos pridėtumėte savo aprašą ar tekstą.

    „WPForms“ formavimo priemonė

    Taip pat galite pakeisti kitus parametrus. Pvz., Jis automatiškai prideda „Pateikti“ kaip mygtuko pavadinimą. Galite spustelėti jį ir pakeisti jį į Prisijungimas.

    Formos nustatymai

    Taip pat galite nuspręsti, kas nutinka, kai vartotojas sėkmingai prisijungia. Eikite į Nustatymai »Patvirtinimas skirtuką ir pasirinkite veiksmą.

    Peradresuoti prisijungusius vartotojus

    Galite peradresuoti vartotoją į bet kurį kitą URL, peradresuoti jį į pagrindinį puslapį arba tiesiog parodyti jam pranešimą, kad jie dabar prisijungę.

    Kai būsite patenkinti formos nustatymais, spustelėkite mygtuką Įrašyti, esantį viršutiniame dešiniajame ekrano kampe, ir uždarykite formos kūrėją.

    Pridėjus pasirinktinę prisijungimo formą prie „WordPress“ puslapio

    „WPForms“ leidžia lengvai pridėti pasirinktinę prisijungimo formą prie bet kurio „WordPress“ įrašo ar puslapio.

    Tiesiog redaguokite puslapį, kuriame norite pridėti prisijungimo formą, arba sukurkite naują. Puslapio redagavimo ekrane pridėkite „WPForms“ bloką prie savo turinio srities.

    Pridedant „WPForms“ bloką prie įrašo

    Tada pasirinkite anksčiau sukurtą prisijungimo formą ir „WPForms“ blokas automatiškai ją įkels turinio srityje.

    Prisijungimo formos peržiūra

    Dabar galite toliau redaguoti prisijungimo formos puslapį arba išsaugoti ir paskelbti pakeitimus.

    „WordPress“ prisijungimo formos puslapio dizaino pritaikymas

    Pagal numatytuosius nustatymus jūsų tinkintame „WordPress“ prisijungimo formos puslapyje bus naudojamas jūsų temos puslapio šablonas ir stiliai. Jame bus jūsų temos naršymo meniu, antraštės, poraštės ir šoninės juostos valdikliai.

    Jei norite visiškai perimti visą puslapį ir ką nors suprojektuoti nuo nulio, tuomet galite naudoti „WordPress“ puslapio kūrimo priemonės papildinį.

    Naudodamiesi puslapių kūrimo priemonės papildiniu, galite sukurti tinkintą puslapio išdėstymą ir tada pridėti prisijungimo formos valdiklį, kurį teikia tema „Mano prisijungimas“ arba „WPForms“..

    Žemiau esančioje ekrano kopijoje mes panaudojome populiarųjį „Beaver Builder“ papildinį. Viso ekrano išdėstyme panaudojome fono paveikslėlį ir pridėjome du stulpelius. Viename stulpelyje pridėjome šiek tiek teksto ir mygtuką. Kitame stulpelyje pridėjome „WPForms“ valdiklį.

    Tinkinto prisijungimo puslapio sukūrimas naudojant puslapio kūrimo priemonės papildinį

    „Beaver Builder“ pranašumas yra tas, kad jis yra 100% vilkimo ir kritimo sprendimas.

    Pastaba: Kadangi jūs jau esate prisijungę, „Theme My Login“ ir „WPForms“ papildiniai gali nerodyti tiesioginės prisijungimo formos peržiūros. „WPForms“ papildinys turi parinktį, kur galite tai išjungti formos nustatymuose.

    Jei „WordPress“ puslapio kūrimo priemonės papildiniai nėra jūsų dalykas, tuomet formą ir patį prisijungimo puslapį galite formuoti naudodami pasirinktinį CSS. Norėdami lengvai pridėti pasirinktinius CSS stilius, taip pat galite naudoti „CSS Hero“ papildinį.

    Pakeiskite „WordPress“ prisijungimo logotipą ir URL

    Jums ne visada reikia sukurti visiškai tinkintą „WordPress“ prisijungimo puslapį savo svetainei. Tiesą sakant, daugelis svetainių tiesiog pakeičia „WordPress“ logotipą ir logotipo URL, vis dar naudodamiesi numatytuoju prisijungimo puslapiu.

    Jei prisijungimo ekrane norite pakeisti „WordPress“ logotipą savo logotipu, tuomet galite lengvai tai padaryti naudodami „WordPress“ papildinį arba pridėdami pasirinktinį kodą. Mes parodysime abu metodus, kuriuos galite naudoti geriausiai jums tinkantį metodą.

    Pakeiskite „WordPress“ prisijungimo logotipą ir URL naudodami papildinį

    Pirmiausia turite įdiegti ir suaktyvinti „Colorlib Login Customizer“. Prijunkite. Norėdami gauti daugiau informacijos, skaitykite mūsų nuoseklų vadovą, kaip įdiegti „WordPress“ papildinį.

    Suaktyvinus papildinį, „WordPress“ administratoriaus šoninėje juostoje pridedamas naujas meniu punktas, pažymėtas „Login Customizer“. Spustelėjus jį, bus paleistas prisijungimo tinkinimo įrankis.

    Prisijungimo tinkinimo priemonė

    Prisijungimo tinkinimo priemonė įkels numatytąjį „WordPress“ prisijungimo ekraną su tinkinimo parinktimis kairėje ir tiesiogine peržiūra dešinėje.

    Norėdami pakeisti „WordPress“ logotipą savo, spustelėkite dešinėje skirtuką „Logotipo parinktys“. Čia galite paslėpti „WordPress“ logotipą, įkelti savo pasirinktinį logotipą, pakeisti logotipo URL ir tekstą.

    Įkelkite pasirinktinį logotipą į prisijungimo puslapį

    Papildinys taip pat leidžia visiškai tinkinti numatytąjį „WordPress“ prisijungimo puslapį. Galite pridėti stulpelių, fono paveikslėlio, pakeisti prisijungimo formos spalvas ir dar daugiau.

    Iš esmės galite sukurti tinkintą „WordPress“ prisijungimo puslapį nekeisdami numatytojo „WordPress“ prisijungimo URL.

    Baigę tiesiog spustelėkite mygtuką paskelbti, kad išsaugotumėte pakeitimus. Dabar galite apsilankyti „WordPress“ prisijungimo puslapyje ir pamatyti, kaip veikia jūsų tinkinta prisijungimo forma.

    Individualizuotos „WordPress“ prisijungimo puslapis su pasirinktiniu logotipu

    Keisti „WordPress“ prisijungimo logotipą ir URL be papildinio (kodas)

    Šis metodas leidžia rankiniu būdu pakeisti „WordPress“ logotipą prisijungimo ekrane asmeniniu logotipu.

    Pirmiausia turite įkelti pasirinktinį logotipą į daugialypės terpės biblioteką. Eiti į Žiniasklaida »Pridėti naują puslapyje ir įkelkite pasirinktinį logotipą.

    Įkėlę vaizdą spustelėkite šalia jo esančią nuorodą „Redaguoti“. Bus atidarytas medijos redagavimo puslapis, kuriame turite nukopijuoti failo URL ir įklijuoti jį į tuščią tekstinį failą kompiuteryje.

    Tada prie temos „function.php“ failo arba konkrečios svetainės papildinio turite pridėti šį kodą.

    funkcija wpb_login_logo () { ?>

    #login h1 a, .login h1 a {
    fono vaizdas: url (http: //path/to/your/custom-logo.png);
    aukštis: 100 pikselių;
    plotis: 300 taškų;
    fono dydis: 300 pikselių 100 pikselių;
    foninis pakartojimas: nekartoti;
    paminkštinimas-dugnas: 10 taškų;
    }

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

    Nepamirškite pakeisti fono vaizdo URL failo URL, kurį nukopijavote anksčiau. Taip pat galite koreguoti kitas CSS ypatybes, kad jos atitiktų jūsų pasirinktinio logotipo vaizdą.

    Dabar galite apsilankyti „WordPress“ prisijungimo puslapyje ir pamatyti, kaip veikia jūsų tinkintas logotipas.

    „WordPress“ prisijungimo puslapis su pasirinktiniu logotipu

    Šis kodas pakeičia tik „WordPress“ logotipą. Tai nekeičia logotipo nuorodos, nukreipiančios į „WordPress.org“ svetainę.

    Pakeiskime tai.

    Tiesiog pridėkite šį kodą prie temos „function.php“ failo arba konkrečios svetainės papildinio. Šį kodą galite pridėti tiesiai prie anksčiau pridėto kodo.

    funkcija wpb_login_logo_url () {
    grįžti namo_url ();
    }
    add_filter (‘login_headerurl’, ‘wpb_login_logo_url’);

    funkcija wpb_login_logo_url_title () {
    grąžinkite „Jūsų svetainės pavadinimas ir informacija“;
    }
    add_filter (‘login_headertitle’, ‘wpb_login_logo_url_title’);

    Nepamirškite pakeisti „Jūsų svetainės pavadinimas ir informacija“ tikruoju svetainės pavadinimu. Dabar tinkintas logotipas prisijungimo ekrane parodys pagrindinį jūsų svetainės puslapį.

    Tai viskas. Tikimės, kad šis straipsnis padėjo jums išmokti įvairių būdų, kaip sukurti „WordPress“ prisijungimo puslapį savo svetainei. Taip pat galbūt norėsite pamatyti mūsų galutinį „WordPress“ saugos vadovą, kuriame pateikiami patarimai, kaip pagerinti jūsų „WordPress“ prisijungimo apsaugą.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
      Like this post? Please share to your friends:
      Adblock
      detector
      map