Menu en logo centreren
-
Goeiemiddag,
Op de website http://www.crispum.nl probeer ik het menu en het logo te centreren, maar ik krijg het niet voor elkaar. Kan iemand mij helpen?
Veel dank!
Jorieke
-
Dag Jorieke,
Heb je in de thema opties gekeken of dit mogelijk is voor jouw thema?
Groet,
Thijs
__________________
De meest volledige WordPress handleidingen vind je bij WP Handleiding
Professioneel WordPress design nodig? Bekijk hier ons portfolio.Dag Theo,
Ja, daar heb ik alle tabbladen doorgekeken, maar zit geen optie ‘Centre’ of iets dergelijks.
Fijne dag,
JoriekePas/voeg in je style de volgende css aan/toe om de navigatie centreren:
.navbar-nav {
float: none;
text-align: center;
}.navbar-nav>li {
display: inline-block;
float: none;
}Je logo wordt iets lastiger. Dit komt omdat deze in een container zit die 50% breed is. Ga je die op 100% zetten en de inhoud centreren (in dit geval je logo) dan zullen de social media iconen buiten het zichtbare worden gedrukt. Vraag is dus beetje wat je hiermee wilt..
Ik heb verder nog geen rekening gehouden met het feit dat je bootstrap gebruikt. Het kan dus zijn dat in een kleinere weergave, zoals op mobiel, deze te wensen over laat. Ook is het niet onverstandig om een child theme van je css te maken daar gezien je bij updates de wijzigingen niet verliest. Zowel bij updaten van bootstrap als je thema.
Hoi Ruurd,
Dank voor je hulp! Het menu is nu in elk geval al gecentreerd. Dat vind ik inderdaad wel veel mooier.
De social media icons mogen wel wegvallen, dat zet ik dan wel op de contactpagina. Hoe kan ik die container terug vinden in de css? Dan kan ik even proberen wat er gebeurt op bijv. mobiel.
Een child theme zal ik aan gaan maken, eens uitvogelen hoe dat werkt.
Als het goed is zie je bij Weergave > Editor ook een bestand “header.php” staan. Deze moet je aanpassen om de social media eruit te halen en het logo te kunnen centreren.
Zoek als eerst deze regel op in header.php:
<div class="site-branding col-md-6">
En verander de “col-md-6” naar “col-md-12”.
Vervolgens pas/voeg je het volgende in je style.css aan/toe:
.social-header { display: none; }
.site-branding { text-align: center; }
Dat werkt helemaal. Veel dank Ruurd!!
Graag gedaan! Zou je dit topic op [resolved] willen zetten?
ga ik doen!
- Het onderwerp ‘Menu en logo centreren’ is gesloten voor nieuwe reacties.