Nieuw onderwerp beginnen

Headerafbeelding met logo maken

Een korte tijd geleden is het mogelijk geworden om zelf de look&feel van je omgeving in te stellen. Als voorbeeld leg ik hier uit hoe je een mooie header kunt maken voor je leeromgeving. Als materiaal heb ik een wit logo met transparante achtergrond en de volgende afbeelding. De maten hiervan zijn 2000 pixels breed bij 393 pixels hoog. Het advies voor de breedte is minimaal 1920 pixels voor brede schermen.



Die ga ik in het midden van de header uitlijnen en het logo komt eroverheen te staan.


Dit zijn de instellingen voor de achtergrond van de afbeelding met daarnaast het resultaat van die instelling:




Wanneer je een logo uploadt, worden de maten van de afbeelding automatisch overgenomen in de instellingen. Zorg dus dat het logo de juiste hoogte heeft. Deze bepaalt ook de hoogte van de header. Het is meestal niet de bedoeling dat het logo tegen de boven- en onderkant van de header aankomt. Dit kun je oplossen door een aantal pixels in te vullen bij 'padding above and under logo'. Dit zijn de instellingen en het resultaat van de instellingen die ik heb gedaan voor het logo:




Verder heb ik de kleur van het menu veranderd. De achtergrond daarvan heb ik transparant gemaakt, want op de inlogpagina staat het menu aan de bovenkant van de header over de achtergrondafbeelding heen:




Ik hoor graag of deze stappen duidelijk zijn. Ik wil meer tips gaan plaatsen over de look&feel-configuratie, dus als jullie graag bepaalde instellingen behandeld zien worden (eventueel met voorbeelden) laat het dan hieronder weten.

Aanmelden of registreren om een reactie te posten