WPLounge
White Label
Home » Tutorials » White Label, je eigen identiteit op WordPress

White Label, je eigen identiteit op WordPress

Meer dan 35% van de websites is gemaakt met WordPress. Maar veel van deze websites zal je niet als een WordPress website herkennen. Dit wordt gedaan door ‘white labeling’ toe te passen.

Affiliate disclaimer:
In onze artikelen en op onze pagina's staan affiliate links. Wanneer je via één van deze links een aankoop doet, ontvangen wij een (meestal kleine) commissie van de verkoper. Wij geven altijd onze eerlijke mening over producten. Klik hier voor meer informatie.

Als je een WordPress website bouwt wil je het liefst zo min mogelijk van WordPress laten zien om je website zoveel mogelijk een eigen identiteit te geven. Met white labeling kan je dit toepassen door bijvoorbeeld inlogpagina’s en dashboards te voorzien van je eigen logo en bedrijfsnaam.

1. Hoe je WordPress van een white label voorziet

Als je WordPress white labeling toepast zal je nog steeds WordPress normaal kunnen gebruiken, maar het zal niet als standaard WordPress verschijnen voor je gebruikers of bezoekers. Je kan zelfs aangepaste widgets en berichten hebben binnen traditioneel met WordPress gelabelde gebieden.

TIP VAN WPLOUNGE
Divi theme & Divi Builder
Bij Elegant Themes ontvang je meer dan
85 premium WordPress themes (waaronder Divi!) voor maar 89 dollar!

Bekijk de themes »»
Lees meer over Divi.

Handmatig WordPress white labelen

Handmatig WordPress white labelen is eigenlijk vrij eenvoudig: je bewerkt het bestand functions.php van je installatie. Je kan ook specifiek bepalen wat je wilt wijzigen, en je doet dit zonder de extra bloat van plugin code die al dan niet van toepassing is.  Als je alleen het logo op de inlogpagina wilt wijzigen, dan kan dat. Veranderen van de menu’s in het admin paneel en niets anders? Ook dat is mogelijk. Maar je kunt zelf kiezen welke delen van WordPress je white labeled.

Gebruik een child theme

Het wijzigen van iets in het WordPress bestandssysteem kan echter gevaarlijk zijn als het niet correct wordt gedaan. Daarom raden we je ten zeerste aan om een child thema te gebruiken om deze wijzigingen aan te brengen. Omdat je een WordPress core bestand bewerkt (technisch gezien het belangrijkste WordPress-bestand), kunnen er te veel dingen fout gaan als je dat niet doet. Als je geen child theme gebruikt, worden alle wijzigingen die je aanbrengt in functions.php overschreven wanneer het thema wordt bijgewerkt.

WordPress Child Theme
Gebruik een Child Theme

Het bewerken van functions.php

Het bewerken van het functions.php bestand is vrij eenvoudig. Je kan een code editor gebruiken samen met een FTP programma zoals CoreFTP. Of je kan de bestandsbeheerder van je DirectAdmin panel gebruiken. Ongeacht de methode die je gebruikt, maak eerst een backup van je website om gegevensverlies te voorkomen.

Je kan het bestand functions.php vinden in de volgende directory.

/public_html/voorbeeld.nl/wp-content/theme-name

2. WordPress Login Pagina aanpassen

Een goede plek om te beginnen is om de WordPress login pagina aan te passen. Het is één van de meest gebruikte pagina’s op je website, dus misschien wil je niet dat grote WordPress logo.

<?php/**
 * Change WordPress login logo with your own
 */
function et_custom_login_logo() {
  $logo_url   = get_stylesheet_directory_uri() . '/images/logo.png';
  $logo_style = '.login h1 a { background-image: url(' . esc_url( $logo_url ) . '); background-size: 186px 86px; width: 186px; height: 86px; }';
  wp_add_inline_style( 'login', $logo_style );
}
add_action( 'login_enqueue_scripts', 'et_custom_login_logo' );/* Code explanation - Start Here *//**
 * Change WordPress login logo with your own
 */
function et_custom_login_logo() {
  // Path URL to your own logo. Method get_stylesheet_directory_uri() will return
  // current theme path URL.
  $logo_url   = get_stylesheet_directory_uri() . '/images/logo.png';  // Set logo background image. esc_url() method is needed to check and clean the
  // logo URL. You can resize the logo as well by adjusting the background size,
  // height, and width.
  $logo_style = '.login h1 a { background-image: url(' . esc_url( $logo_url ) . '); background-size: 186px 86px; width: 186px; height: 86px; }';  // Render custom logo style above. 'login' is the registered stylesheet for
  // default WordPress login page. By using wp_add_inline_style() method we no
  // longer need to specify <style> tag, has unique ID, and it will be fired as
  // soon as WordPress login stylesheet is loaded.
  wp_add_inline_style( 'login', $logo_style );
}
add_action( 'login_enqueue_scripts', 'et_custom_login_logo' );/* Code explanation - End Here */?>

Link van het WordPress logo aanpassen

Een andere optie is om de link van het WordPress logo te veranderen. Om ervoor te zorgen dat de gebruiker naar jouw website gelinkt wordt i.p.v. WordPress.org kan je de volgende code toevoegen aan functions.php

<?php/**
 * Change the URL of the WordPress login logo with home URL
 *
 * @return string Your custom logo URL
 */
function et_custom_login_logo_url() {
  return esc_url( home_url() );
}
add_filter( 'login_headerurl', 'et_custom_login_logo_url' );?>

WordPress Logo – titel tekst aanpassen

Om een hover/titel tekst toe te voegen aan het WordPress login logo kan je het volgende doen:

<?php/**
 * Change the hover/title text of the WordPress login logo
 *
 * @return string Your custom hover/title text
 */
function et_custom_login_logo_title() {
  return esc_html__( 'Jouw aangepaste titel hier', 'et-text-domain' );
}
add_filter( 'login_headertext', 'et_custom_login_logo_title' );/* Code explanation - Start Here *//**
 * Change the hover/title text of the WordPress login logo
 *
 * @return string Your custom hover/title text
 */
function et_custom_login_logo_title() {
  // esc_html__() method is used to support locale translation and clean the
  // translated string if it exists.
  return esc_html__( 'Jouw aangepaste titel hier', 'et-text-domain' );
}
add_filter( 'login_headertext', 'et_custom_login_logo_title' );/* Code explanation - End Here */?>

3. Een plugin gebruiken voor white labeling

Waarschijnlijk de eenvoudigste manier voor WordPress white labeling toepassingen, is het gebruik van een plugin.

White Label CMS plugin

White Label CMS Plugin
White Label CMS Plugin

De White Label CMS plugin is voor ontwikkelaars die hun klanten een persoonlijker en minder verwarrend CMS willen geven. Mogelijkheden:

  • Pas de inlogpagina aan
  • Voeg eigen logo’s toe aan de kop- en voettekst
  • Pas het dashboard aan
  • Bepaal welke menu’s worden weergegeven

Meer info

White Label Branding

White Label Branding Plugin
White Label Branding Plugin

Als je wat meer controle over gebruikers wilt, is White Label Branding zeker een premium-optie die je zou moeten overwegen. Je krijgt de normale opties voor white labeling over de site, maar je krijgt ook een aangepast gebruikers-beheerplatform. Van de productpagina:

We hebben een krachtige functie voor rollen en mogelijkheden toegevoegd, waarmee je nieuwe gebruikersrollen kan maken en mogelijkheden kan toewijzen. Je kan nieuwe mogelijkheden toevoegen voor specifieke gebruikersrollen en ja kan zelfs een “nep” beheerdersaccount maken. Dit kan worden gebruikt als je je klanten “admin” -toegang wilt geven, maar toch wilt beperken waartoe zij toegang hebben.

Meer info

Conclusie

White labeling is niet voor elke site nodig, maar het kan een bedrijf of merk een meer unieke aanwezigheid en potentiële geloofwaardigheid bij gebruikers geven als je de extra stappen neemt om WordPress aan te passen. Wat vind je van white labeling WordPress? Laat ons je tips, trucs en favoriete strategieën weten in de reacties!

Roger.Overdevest

Roger is een SEO specialist met veel passie voor WordPress

2 reacties

  • Goededag,

    Hoe kan ik mijn eigen bedrijfsnaam gebruiken bij een whitelabeling?
    ipv die van de provider

    mijn website is gemaakt in wordpress en is nog in bewerking.

    groetjes, Rinesh

    • Dag,

      Waar zie je precies de naam van de provider?
      Naar mijn weten is de provider informatie alleen te zien via de whois informatie van het domein zelf.