Wil je weten hoe je een inlogpagina maakt met Elementor ?

In WordPress kun je gaan op uwdomein.com/wp-login.php om naar de inlogpagina van uw website te gaan. Als je een grote website hebt met meerdere auteurs/gebruikers, wil je misschien een aangepaste inlogpagina maken met je eigen ontwerp om de identiteit van je website te versterken.

met Elementor, kunt u moeiteloos een aangepaste inlogpagina voor uw WordPress-website maken - zonder codering of het installeren van extra plug-ins.

Elementor heeft een widget – de Login-widget – waarmee u een aangepaste inlogpagina kunt maken. Elementor biedt zelfs sjablonen voor inlogpagina's, zodat u in een mum van tijd een inlogpagina kunt maken.

Een aangepaste WordPress-inlogpagina maken met Elementor

Houd er rekening mee dat de Login-widget alleen beschikbaar is op Elementor Pro. Dus voordat u een aangepaste inlogpagina kunt maken, moet u Elementor upgraden naar de pro-versie.

1. Een inlogpagina maken op basis van een sjabloon

Zoals eerder vermeld, biedt Elementor sjablonen waarmee je in een mum van tijd een gepersonaliseerde inlogpagina kunt maken. Om er een te gebruiken, begint u met het maken van een nieuwe pagina (Pagina's -> Toevoegen) En wijzig het met Elementor.

Klik in de Elementor-editor op het mappictogram om de modelbibliotheek te openen.

Zoek naar een aangepaste sjabloon voor een inlogpagina. U kunt het zoekvak gebruiken om uw werk te vergemakkelijken. Zodra u het gewenste model heeft gevonden, beweegt u uw muis erover en klikt u op de knop INVOEREN.

Wacht even totdat Elementor klaar is met het laden van het model. Zodra het model is geladen, kunt u klikken op publiceren om het te publiceren.

Er.

Om de pagina te bekijken, klikt u op het pictogram met drie lijnen in de bovenhoek van het linkerdeelvenster en selecteert u Toon pagina.

En hier is het eindresultaat als je voor hetzelfde model als ons hebt gekozen.

Een inlogpagina maken met Elementor

2. Hoe u helemaal opnieuw een aangepaste inlogpagina kunt maken

Als u uw eigen inlogpagina-ontwerp wilt hebben, kunt u ook uw eigen aangepaste inlogpagina helemaal opnieuw maken. Maak om te beginnen een nieuwe pagina en bewerk deze met Elementor.

Voeg in de Elementor-editor een nieuwe sectie toe door op het pluspictogram te klikken. U kunt een kolomstructuur selecteren op basis van het ontwerp dat u wilt maken.

Zodra uw sectie gereed is, voegt u de verbindingswidget toe door deze van het linkerdeelvenster naar het canvasgebied te slepen.

Een inlogpagina maken met Elementor

Ga naar het tabblad Inhoud in het linkerpaneel om de basisopties in te stellen. Er zijn 3 optieblokken die u kunt manipuleren:

1. Formuliervelden

U kunt dit blok openen om de tag in of uit te schakelen en de invoergrootte in te stellen.

2. Knop

U kunt dit blok openen om knoptekst, knopgrootte en knopuitlijning in te stellen.

3. Aanvullende opties

U kunt dit blok openen om elementen van uw inlogpagina in of uit te schakelen, zoals link Mvergeten wachtwoord en de optie Onthoud me. Aangezien u een inlogpagina wilt maken, activeren de optie Omleiden na inloggen en plak de WordPress-dashboard-URL (uwdomein.com/wp-admin) op het beschikbare veld. U kunt de optie ook activeren Omleiden na uitloggen als je wilt.

U kunt de optie activeren Aangepast label als u aangepaste labels en aangepaste tijdelijke aanduidingen op uw wilt gebruiken formulier verbinding.

Zodra het definitie basisopties voltooid, ga naar het tabblad Stijl om de te personaliseren formulier verbinding. Er zijn 5 blokken met stijlopties beschikbaar:

1. Vorm

U kunt dit blok openen om de ruimte tussen de lijnen, de kleur van de schakels en de kleur van de aanwijzers van de schakels te definiëren.

2. Etiket

Je kunt dit blok alleen zien als je het label van activeert formulier. U kunt dit blok openen om de afstand tussen formulierlabels, tekstkleur en typografie (lettertypefamilie, lettergrootte, letterstijl, enz.) in te stellen.

3. Velden

U kunt dit blok openen om de kleur van de tekstvelden, de typografie (lettertypefamilie, lettergrootte, letterstijl, enz.), de achtergrond van het besturingselement, de kleur van de rand van het besturingselement, de breedte van de rand te definiëren van het veld en de straal van de rand van het veld.

4. Knop

U kunt dit blok openen om de inlogknop aan te passen. U kunt dingen instellen zoals de tekstkleur van de knop, de tekstkleur van de muisaanwijzer, typografie, de achtergrondkleur van de knop, de randradius en de tekstvulling van de knop.

5. Ingelogd bericht

U kunt dit blok openen om het bericht aan te passen zodra uw gebruikers zijn ingelogd. Hier is het bericht:

U kunt de tekstkleur en de typografie van het bericht instellen.

Als u klaar bent met het stylen van de Login-widget, kunt u andere widgets op uw pagina aanpassen. Zodra het bewerken van de pagina is voltooid, publiceert/werkt u uw pagina en hebt u met succes de aangepaste inlogpagina gemaakt.

Lees ook: Elementor-modellen exporteren en importeren

Een cruciaal ding om op te merken. Na het maken van de aangepaste inlogpagina, verwijder het bestand niet wp-login.php op uw WordPress-website. Je WordPress-site heeft dit bestand nog steeds nodig om het inlogproces af te handelen.

Download Elementor Pro nu!

Conclusie

Alstublieft ! Dat is het voor dit artikel dat u laat zien hoe u een inlogpagina maakt met Elementor. Als u zich zorgen maakt over hoe er te komen flaat het ons weten in de commentaires.

U kunt echter ook overleggen onze middelen, als u meer elementen nodig hebt om uw projecten voor het maken van internetsites uit te voeren, raadpleeg onze gids op de WordPress blog creatie of die op Divi: het beste WordPress-thema aller tijden.

Maar in de tussentijd deel dit artikel op uw verschillende sociale netwerken.

...