Ondersteuning » Thema en CSS/opmaak » tekstkleuren van de blokken in thema ravenna wijzigen

  • Hallo allemaal,

    Ik heb de kleuren van de blokken in Ravenna aangepast, maar nu kun je de tekst niet meer lezen. Die wil ik dus ook graag van kleur veanderen maar heb geen idee hoe.\Wie helpt?

    Harm

15 reacties aan het bekijken - 1 tot 15 (van in totaal 21)
  • Hi Harm,

    Je stelt hierboven een aantal vragen die we hier doorgaans kunnen beantwoorden.
    Bovenstaande is echter nog onvoldoende duidelijk waar je problemen precies zitten en wat je precies wilt bereiken.
    — — —
    Er zijn heel veel verschillende wordpress-thema’s!
    Geef de volgende info, dan kunnen we ZIEN wat je bedoelt! 😉

    Zo krijgen we een beter beeld van jouw situatie en kunnen we meedenken en adviseren.

    Thread starter feijer

    (@feijer)

    Hallo,
    Mijn website is http://www.gobvk.nl. Het gebruikte thema ia Ravenna Ravenna heeft Blauwe blokken, 1 links bovenaan, drie midden op de pagina. Vanwege de gebruikte kleuren voor mijn logo heb ik de blokken allemaal wit gemaakt. Daardoor is de tekst in de blokken midden op de pagina niet meer te lezen, die is te licht geworden. Die tekst in de blokken wil ik graag groen maken, maar ik weet niet hoe dat kan. Verder wil ik ook graag dat die blokken gebruikt kunnen worden als knoppen.

    Voeg onderstaand toe aan (het liefst via child theme) je css (maak tekst groen):

    body.home .header-text { color: green; }

    Als je van die blokken een knop wilt maken dien je deze op te maken als een zogeheten link. In html is dit een “a href”.

    Nu is je blok zo:

    <div class="header-block">
       <span class="header-icon">
          <i class="fa fa-home"></i>
       </span>
       <h3 class="header-title"></h3>
       <div class="header-text">
          Het gastouderbureau waar kinderen voorop staan
       </div>
    </div>

    Maak hier dus een a href van:

    <a href="#">
       <span class="header-icon">
          <i class="fa fa-home"></i>
       </span>
       <h3 class="header-title"></h3>
       <div class="header-text">
          Het gastouderbureau waar kinderen voorop staan
       </div>
    </a>

    Het “#” staat voor de pagina waar je naartoe wilt linken.

    Lukt dat zo?

    Thread starter feijer

    (@feijer)

    Hallo Ruurd,
    Dank je wel voor je hulp. Ik kon het helaas nog niet proberen omdat ik ineens niet meer kan inloggen bij WordPress. Heb je daar ook een oplossing voor 🙂

    Thread starter feijer

    (@feijer)

    Hallo Ruurd,
    Inmiddels kan ik er weer in. Heb geprobeerd wat je zei, voor wat betreft de kleur van de letters in de blokken maar het werkt niet. Misschien kun je aangeven waar ik precies die regel bij moet voegen. Het kleurnummer is #009393

    Wijziging moet je maken in style.css. Deze staat veelal in je thema map: wp-content/themes/thema-naam/style.css

    Voeg de regel

    body.home .header-text { color: #009393; }

    onderaan je style.css toe.

    Thread starter feijer

    (@feijer)

    Helaas, het werkt niet

    Dan doe je waarschijnlijk iets verkeerd. Zie screenshot:
    http://dev.ikwebdesign.nl/screenshots/screen_gobvk.jpg

    Hier werkt het zoals het hoort alleen is dit lokaal.

    Thread starter feijer

    (@feijer)

    ik zal ongetwijfeld iets verkeerd doen. Maar het werkt hier niet.

    Maak eerst even een child theme van je thema. Wat je nu namelijk gaat wijzigingen zal bij een thema update gewist worden. Als je een child theme maakt niet.

    Mocht je dit niet lukken dan zou ik je willen adviseren iemand in de hand te nemen die dit wel kan. Op die manier weet je zeker dat het ook goed gedaan wordt.

    Ik zou je kunnen helpen + bij het maken van de wijzigingen maar vraag hier wel een kleine vergoeding voor.

    Thread starter feijer

    (@feijer)

    Hallo Ruurd,

    Child theme gelukt en de letters zijn de juiste groene kleur. Dank je wel. Ik heb nog wel een vraag:
    De drie blokken hebben bij mij een naam gekregen t.w. voor gastouders; voor vraagouders en inloggen.
    Wat ik nu graag wil is dat bij aanklikken van de blokken de mensen naar de corresponderende pagina gaan. Misschien kun jij me vertellen hoe ik dat regel.
    Vast bedankt

    Very nice!

    Je moet er tags omheen zetten. Kijk maar eens naar mijn eerdere antwoord waarbij ik een blok vervangen door eentje met

    Thread starter feijer

    (@feijer)

    ik weet niet wat je bedoelt met: er tags omheen zetten. Ik heb je voorbeeld overgenomen en dat ziet er als volgt uit:

    <span class=”header-icon”>
    <i class=”fa fa-home”></i>
    </span>
    <h3 class=”header-title”></h3>
    <div class=”header-text”>
    Voor Gastouders
    </div>

    Maar zo werkt het niet.

    <div class="header-block">
       <span class="header-icon">
          <i class="fa fa-home"></i>
       </span>
       <h3 class="header-title"></h3>
       <div class="header-text">
          Het gastouderbureau waar kinderen voorop staan
       </div>
    </div>

    Maak van “<div class=”header-block”>” dus een a href:

    <a href="#">
       <span class="header-icon">
          <i class="fa fa-home"></i>
       </span>
       <h3 class="header-title"></h3>
       <div class="header-text">
          Het gastouderbureau waar kinderen voorop staan
       </div>
    </a>

    Uiteindelijk doe je hetzelfde met de andere 2 blokken.

    Thread starter feijer

    (@feijer)

15 reacties aan het bekijken - 1 tot 15 (van in totaal 21)
  • Het onderwerp ‘tekstkleuren van de blokken in thema ravenna wijzigen’ is gesloten voor nieuwe reacties.