Dit artikel is gewijd aan het toevoegen van kleurvoorinstellingen aan de WordPress Customizer. In deze zelfstudie zullen we kleurvoorinstellingen toevoegen aan de WordPress-aanpasser.
Door uw website een effen kleurenschema te geven, kunt u uw merk versterken en professionaliteit tonen. Het handmatig aanpassen van uw thema is arbeidsintensief.
Het toevoegen van kleurvoorinstellingen aan de WordPress Customizer kan het proces helpen stroomlijnen.
Wat zijn kleurvoorinstellingen en waarom zou u ze gebruiken? Volg onze gids in vijf stappen om ze toe te voegen aan de WordPress Customizer. Dus laten we beginnen!
Inhoudsopgave
Hoe kleurvoorinstellingen toevoegen aan de WordPress-aanpasser? 5 stappen
Ga hierheen voor meer informatie over het maken van kleurvoorinstellingen voor uw website. Leer hoe u in vijf eenvoudige stappen kleurvoorinstellingen kunt toevoegen aan de WordPress Customizer.
1. Er moet een back-up worden gemaakt van de gegevens van uw site
Het bestand functions.php van je thema moet worden bewerkt om kleurvoorinstellingen op te nemen. We raden u ten zeerste aan een back-up van uw website te maken voordat u verder gaat.
Het is een goed idee om een kopie van de bestanden van je site te hebben voor het geval er iets misgaat. Om uw website te beschermen, zijn er een aantal opties voor u beschikbaar.
Met behulp van een plug-in zoals UpdraftPlus is een simpele oplossing. Het is gemakkelijk om een back-up van uw site te maken met deze freemium-applicatie. Andere opties voor het off-site opslaan van de gegevens zijn Google Drive en Dropbox.
2. Maak een subthema voor je hoofdthema
Een thema-update kan eventuele wijzigingen die u aanbrengt in de bestanden van het thema overschrijven als u deze rechtstreeks aanbrengt. Bij het toevoegen van aangepaste code moet u altijd een kindthema gebruiken om dit te voorkomen.
Er zijn verschillende benaderingen die u hier kunt volgen. U kunt bijvoorbeeld een kindthema voor Beaver Builder installeren. U kunt zelfs een leeg kindthema maken als u een ander thema gebruikt.
Het is mogelijk om een child-thema te bouwen met behulp van gratis WordPress-plug-ins. Zorg ervoor dat je je child-thema activeert in Uiterlijk > Thema's zodra je het hebt toegevoegd.
3. Voeg in het bestand functions.php van Your Child Theme de volgende code toe
Uiterlijk> Thema-editor in het WordPress-dashboard is waar u uw nieuwe kindthema vindt. Selecteer het kindthema in de vervolgkeuzelijst bovenaan het scherm.
Controleer uw beveiligingsplug-ins om te zien of ze de toegang tot de Thema-editor in het beheerdersmenu hebben geblokkeerd. Zoek het bestand functions.php aan de rechterkant onder Themafuncties.
De volgende code moet aan het bestand worden toegevoegd. De vooraf ingestelde kleuren die u wilt gebruiken, worden weergegeven in de vakken onder het kleurkiezervierkant wanneer u deze code gebruikt.
4. Pas de kleurvoorinstellingen aan
Bewerk vervolgens de optie paletten om hexadecimale kleuren toe te voegen of te verwijderen. U kunt het aantal dozen in de Customizer wijzigen door deze code te wijzigen.
Voeg zoveel hex-kleuren toe als je wilt aan je palet. Klik op de knop Bestand bijwerken onder aan de Thema-editor om uw wijzigingen op te slaan.
5. Test uw kleurvoorinstellingen voordat u opslaat
Controleer na het bijwerken van uw wijzigingen of de kleurvoorinstellingen beschikbaar zijn in de WordPress Customizer. Laad uw website opnieuw in de browser en ga vervolgens naar Customizer.
U zou de nieuwe hex-kleuren in de kleurenkiezer moeten opmerken. Het is mogelijk om de HSL-parameters om de tint, verzadiging en helderheid van de kleurkiezervierkanten en schuifregelaars te wijzigen.
Als alles klopt, ben je klaar! Je hebt nu de WordPress Customizer aangepast. U kunt de kleuren bewerken in het bestand functions.php van uw thema.
WordPress-paginaconstructie: de waarde van het gebruik van kleurenschema's
Het is cruciaal voor uw online identiteit dat het kleurenpalet van uw website overal consistent is. Het handhaven van een uniforme visuele stijl op uw site voegt geloofwaardigheid en professionaliteit toe.
De volgende stap nadat je een kleurenpalet voor je merk hebt gekozen, is het consistent implementeren in al je content. Met de WordPress Customizer is het wijzigen van de kleuren die in uw inhoud worden gebruikt een fluitje van een cent.
Onder de vierkante kleurenkiezer in de WordPress Customizer staat het vooraf bepaalde kleurenschema.
U kunt uw favoriete kleurenschema's opslaan in de gekleurde vierkanten. Desalniettemin heb je je waarschijnlijk gerealiseerd dat de standaardkleuren niet passen bij het specifieke kleurenschema van je merk.
Bovendien kan het lastig zijn om de hexadecimale waarden voor de kleuren van uw merk voortdurend opnieuw in te voeren. Als u het bestand van uw thema bewerkt en een paar regels code wijzigt, kunt u ervoor zorgen dat deze vakken overeenkomen met het kleurenschema van uw voorkeur.
Bespaar tijd door uw eigen kleurenpaletten te maken voor gebruik in de Customizer, zodat u nooit meer de hexadecimale code hoeft op te zoeken. In plaats daarvan staat het kleurenpalet dat je zoekt net onder de paletkiezer van de Customizer.
U kunt de uniformiteit van het uiterlijk van uw website behouden door kleurvoorinstellingen te gebruiken. Als uw site meerdere auteurs heeft, is dit een erg handige functie om te hebben. Het vermindert de kans dat consumenten de verkeerde kleur kiezen.
Quick Links:
- Hoe een WordPress-paginatitel verwijderen?
- Hoe maak je een kleurenpalet voor je WordPress-site?
- Hoe maak je een onderhoudsmoduspagina in WordPress?
- Hoe maak je een aangepaste 404-foutpagina in WordPress?
Conclusie: hoe kleurvoorinstellingen toevoegen aan de WordPress-aanpasser?
Uw merkkleuren zullen waarschijnlijk worden gebruikt op de pagina's en artikelen van uw WordPress-website. Handmatig toevoegen aan uw inhoud kost tijd. In plaats daarvan kunt u kleurvoorinstellingen genereren.
Heeft u vragen over de kleurvoorinstellingen van WordPress Customizer? Laat het ons weten in de comments!
![Hoe klantcommunicatie effectief beheren in 2024? [5 belangrijke tips]](https://megablogging.org/wp-content/uploads/2022/11/Client-Communication-Management-211x150.png)
![Hoe maak je een bestemmingspagina voor het vastleggen van leads in WordPress 2024? [Stapsgewijze handleiding]](https://megablogging.org/wp-content/uploads/2022/11/How-to-Create-a-Lead-Capture-Landing-Page-in-WordPress-211x150.png)
