In deze blog lees je hoe je het standaard design van wp-admin (het beheergedeelte van je WordPress website) kunt aanpassen. Hiervoor gebruiken we de plugin Branda. Het is de ultieme tool voor het whitelabelen van de voor- en achterkant van je WordPress-site. Een van de vele trucs die het in petto heeft, is de mogelijkheid om aangepaste inlogpagina's te maken.
- Stap 1: Plugin installeren
- Stap 2: Template kiezen
- Stap 3: Logo aanpassen en achtergrond
- Stap 4: Custom labels toevoegen
- Stap 5: Kleuren aanpassen
Stap 1: Plugin installeren
De plugin 'Branda' kun je installeren in de wp-admin. Hieronder heb ik de stappen voor je opgesomd:
- Login op je website
- Bij plugins klik je op 'Nieuwe plugin' en zoek je naar 'Branda'
- Klik op installeren en activeren
Stap 2: Template kiezen
In deze stap leg ik je uit hoe je een template kiest.
- Navigeer naar de plugin Branda aan de linkerkant en klik op Dashboard
- Klik op het pennetje onder het kopje Front end >> Module >> Inlogscherm aanpassen zoals hieronder in de afbeelding te zien is
- Klik op Activeren
- Kies een template die je leuk vindt en klik op Doorgaan
Het template zie je dan verschijnen.
Stap 3: Logo aanpassen en achtergrond
De taal is standaard ingesteld op wat er is ingesteld op je website. Dan gaan we nu door naar het logo aanpassen en achtergrond.
- Klik op het kruisje om het logo aan te passen. Het logo kan aangepast door een nieuw bestand te uploaden of in de media bibliotheek.
- Als je iets naar onder scrolt, kun je bij het kopje design aanpassingen maken voor het logo zoals hieronder is te zien.
- Je kunt ook je eigen achtergrond afbeelding uploaden.
- Als je iets naar onder scrolt, kun je bij het kopje design aanpassingen maken voor de achtergrond zoals hieronder is te zien.
Mocht je geen logo of achtergrond willen kun je er ook voor kiezen om het weg te laten. Klik daarvoor op Verbergen.
Stap 4: Custom labels toevoegen
De plugin heeft veel opties waarmee je elk aspect van je formulier kunt aanpassen, inclusief de mogelijkheid om elk label te wijzigen en de verschillende links te verbergen.
- Je kunt het volgende aanpassen: gebruikersnaam invoer label, wachtwoord invoer label, login-knoptekst, "onthoud mij"-checkbox, wachtwoordveld op registratiescherm en een achtergrond afbeelding.
- Je kunt ook het design van het formulier aanpassen. Dit kun je doen als je naar onder scrolt naar design zoals hieronder is te zien.
Stap 5: Kleuren aanpassen
Je kunt je eigen kleuren geven, dus een white label wp-admin.
- Als je naar onder scrolt naar Kleuren kun je daar aanpassingen uitvoeren zoals hieronder in de afbeelding is te zien voor het formulier. Boven het formulier kun je de kleuren van achtergrond aanpassen.
- Zodra je inlogscherm er precies zo uitziet als je wilt, kun je een paar extra's aanpassen, zoals de foutmeldingen (die bijvoorbeeld worden weergegeven wanneer iemand een onjuist wachtwoord invoert), de login-omleidingslink, en zelfs je eigen CSS toevoegen zoals hieronder in de afbeelding te zien is.
Dit is het eindresultaat van een paar aanpassingen en het gebruiken van de Branda plugin:
Mocht je vragen hebben, dan kun je contact met ons opnemen. We helpen je graag verder.