Ondersteuning » Thema en CSS/opmaak » Wijzigen kleur menubalk
Wijzigen kleur menubalk
-
Hoi,
Ik wil graag de kleur van mijn menubalk wijzigen, maar weet niet waar in CSS style ik moet kijken.
Het thema is Premium Style.Op mijn iMac heeft de menubalk een andere kleur dan op mijn Windows laptop. Hoe kan dit? En naar welke moet ik nu kijken?
Misschien een stomme vraag, maar als ik mijn link opstuur, dan kan iedereen toch in mijn website werken. Hij is nog niet online.
Gr. Liza538
-
Als jij ’n link naar je website met de inloggegevens erbij dan kunnen wij inderdaad je website binnen komen. Maar anders niet.
De achtergrond van je site wordt geregeld door
`
.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
background: jouw-kleurnummer;
}Succes!
groet,
LianneHoi Lianne,
Ik wil de menubalk een andere kleur geven. Niet de gehele achtergrond. Heb ik dan onderstaande deel uit style.CSS nodig. En welke kleurcode moet ik aanpassen (of meerdere)?
.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul { display: inline-block !important; text-align: left; width: 100%; background-color:#222222; color: #FFFFFF; background: url("images/alert-overlay.png") repeat-x scroll 0 0 #222222;
Gr. Liza538
De background-color moet je aanpassen. van de selector die je zelf opgeeft. Die moet je je eigen kleurnummer geven. Precies zoals ik in post twee aangeef.
Dit doe je het beste in een childtheme. Als je hiermee geen ervaring hebt, is het gemakkelijk om even tijdelijk de plugin One Click Childtheme te installeren. (Deze kan nadat je het childtheme hebt gemaakt direct weer deinstalleren. Deze werkmethode zorgt ervoor dat bij een update van je thema je wijzigingen niet verloren gaan.
Succes!
Lianne
Dag Liza,
Zou je even een link naar je website willen plaatsen? Dan geef ik je de juiste code.
Groet,
Thijs
__________________
Leer in eenvoudige stappen hoe je een professionele WordPress website maakt met de WP Handleiding | http://www.wphandleiding.nlLianne,
Precies gedaan wat je zei. Echter alleen op Windows laptop veranderd de kleur aan de zijkant van de menubalk. De menubalk zelf veranderd niet van kleur.
Ik ben een leek. In welk deel van style.CSS moet de wijziging plaatsvinden?Premium Style Default Theme CSS
Premium Style Site Layout & Look
Premium Style Header CSS
Premium Style search form
Premium Style entry meta CSS
Premium Style entry meta CSS
Premium Style entry meta CSS
Premium Style indexloop CSS
Premium Style Breadcrumbs CSS
Premium Style entry CSS
Premium Style comment CSS
Premium Style tags & categories CSS
Premium Style Author info Box CSS
Premium Style Related Posts Box CSS
Premium Style Navigation Box CSS
Premium Style image CSS
Premium Style widget CSS
Premium Style social icon CSS
Premium Style calendar CSS
Premium Style pagination CSS
Premium Style pagenavi CSS
Premium Style footer CSS
Premium Style copyright CSS
Premium Style scroll and sticky CSS
Premium Style Comments Form CSS
Premium Style respond CSS
Premium Style Pingbacks & Trackbacks CSS
Premium Style gendral CSS
Premium Style menu CSSGr. Liza538
Dag Liza,
In: Premium Style Header CSS
Maar ik zou adviseren om het zonder die plugin te doen en gewoon in de STYLE.CSS toe te voegen onderaan.Dit is de juiste code:
.main-navigation div.nav-menu > ul {
background: url(“images/alert-overlay.png”) repeat-x scroll 0 0 #e34523 !important;
}En dan “#e34523” aanpassen in de kleur die je wilt.
Groet,
Thijs
__________________
Leer in eenvoudige stappen hoe je een professionele WordPress website maakt met de WP Handleiding | http://www.wphandleiding.nlThijs, jouw code werkte niet. Er veranderde niets.
Lianne, jouw code werkt wel voor Windows, maar niet voor Apple. Op mijn iMac veranderde niets. Is hier ook nog een leuke code voor?Jullie weten ook vast de code om de letterkleur in het menu te wijzigen.
Gr. Liza538
Hmmm vreemd, sorry.
Wat is de link naar je website, dan geef ik je beide codes die op alle OS werken.
Groet,
Thijs
__________________
Leer in eenvoudige stappen hoe je een professionele WordPress website maakt met de WP Handleiding | http://www.wphandleiding.nlHoi,
Ik heb je template nog een keer bekeken en zie dat je menubalk op verschillende plekken is geregeld. De selector die ik boven noem is besloten in een mediaquerie (hiermee regel je responsive gedrag).
Advies blijft om een childtheme te maken, met maar 1 stylesheet, nl style.css, en daarin alleen je wijzigingen op te nemen. De code wordt dan:
@media screen and (min-width: 600px) { .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul { background: url("images/alert-overlay.png") repeat-x scroll 0 0 XXjouw-kleurnummerXX !important; } }
Hier ‘luistert’ zowel een Mac (daar werk ik mee) als in Windows.
Succes!
Lianne
Lianne, ik ben echt een leek en begrijp niet wat je hierboven zegt.
Bedoel je een apart kopje in style.CSS, waarin de wijzigingen komen./**************** Premium Style …………… CSS ****************/
Mijn advies beslaat twee elementen
- Maak een childtheme ( de One Click Childtheme plugin helpt je hierbij). Dit childtheme gebruikt alles van ‘Premium Style’, maar laat zich binnen het childtheme overschrijven. Hier een youtube-videootje over hoe met deze plugin een childtheme te maken. Zoals gezegd kun je direct nadat je dit hebt gedaan, de plugin ‘One click childtheme’ weer verwijderen.
- Je childtheme heeft een eigen bestand, genaamd style.css. Het is good practice hierin je wijzigingen m.b.t. css op te nemen. Een comment erbij helpt je later te achterhalen waarom je die code hebt opgenomen. Dit kun je meteen volgend op de code die al in dit bestand staat plaatsen.
/*Achtergrondkleur van navigatie-balk aanpassing */ @media screen and (min-width: 600px) { .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul { background: url("images/alert-overlay.png") repeat-x scroll 0 0 XXjouw-kleurnummerXX !important; } }
Heel moeilijk is het niet.
Succes!
Lianne
- Het onderwerp ‘Wijzigen kleur menubalk’ is gesloten voor nieuwe reacties.