Tekst grootte van header aanpassen

  • VerginiaS

    (@verginias)


    8 jaren, 3 maanden geleden

    Hoi,

    Ik heb de theme Styled Store. De titel van mijn bedrijfsnaam is lang dus is in de header gesplitst in twee rijen waardoor de boven en ondertekst tegen elkaar aan komen. Ik wil hier graag ruimte tussen. Hoe krijg ik dit voor elkaar ? Daarnaast wil ik de font aanpassen, ook hier heb ik hulp bij nodig. Ik heb een child theme aangemaakt.

    De website is : wwww.senseforbusiness.nl

    Alvast bedankt voor het meedenken,

    Groet,
    Verginia

3 reacties aan het bekijken - 1 tot 3 (van in totaal 3)
  • AccountClosed

    (@wistudatbe)

    8 jaren, 3 maanden geleden

    Hoi Verginia,

    In je CSS (/wp-content/themes/styled-store/style.css)staat volgende:

    
.logo .site-title {
    font-size: 3.8rem;
    text-transform: uppercase;
    color: #fff;
    line-height: 30px;
    font-weight: 700;
}

    Verander deze naar:

    
.logo .site-title {
    font-size: 3.6rem;
    text-transform: uppercase;
    color: #fff;
    line-height: 32px;
    font-weight: 700;
}

    En je tekst zal wat meer van elkaar staan.
    Font-size en Line-height zijn de 2 die de hoogte van je letters en lijnen bepaald.

    Welk lettertype vind je goed om daar te plaatsen?
    Dan kan ik je hier ook mee verder helpen.

    Grtjs, Danny

    • Deze reactie is gewijzigd 8 jaren, 3 maanden geleden door AccountClosed. Reden: code vergeten :-)
    Thread starter VerginiaS

    (@verginias)

    8 jaren, 3 maanden geleden

    Hoi Danny,

    Bedankt voor je snelle reactie. Ik heb het aangepast en het werkt ! Bedankt 🙂

    Ik heb even gekeken op google fonts naar een lettertype. Wat ik mooi vind is.. Libre Baskerville, regular. Zou de grootte van de titel ook aangepast kunnen worden zodat het op een regel staat ?

    Alvast bedankt
    Verginia

    AccountClosed

    (@wistudatbe)

    8 jaren, 3 maanden geleden

    Hoi Verginia,

    Graag gedaan hoor 😉
    Om je deze font te laten gebruiken hebben we heel wat meer nodig …
    Er zijn hiervoor 2 manieren: manueel aanpassen of met een plugin, waarvan de manuele telkens je een update van je stijl hebt, je dit opnieuw moet aanpassen.

    1 MANUEEL
    In je stijl wordt er in een PHP bestand je header samengesteld (meestal header.php).
    Indien je hiermee vertrouwd bent kan je verder gaan, zo niet gebruik de plugin!
    In dit bestand kan je de extra font meeladen door volgende lijn toe te voegen:

    
<link href="https://fonts.googleapis.com/css?family=Libre+Baskerville" rel="stylesheet">

    Daarna kan je in het CSS bestand (/wp-content/themes/styled-store/style.css) volgende toevoegen:
    font-family: ‘Libre Baskerville’, serif;

    
.logo .site-title {
    font-size: 3.6rem;
    text-transform: uppercase;
    color: #fff;
    line-height: 32px;
    font-weight: 700;
font-family: 'Libre Baskerville', serif !important;
}

    Dit zou het gewenste resultaat moeten geven.

    2 PLUGIN
    Met deze plugin zou het ook moeten lukken:
    https://nl.wordpress.org/plugins/wp-google-fonts/screenshots/
    Zoals je in het screenshot kunt zien, bepaal je welk font je voor welk onderdeel wenst te gebruiken.
    Via het custom CSS gedeelte kan je dan volgende ingeven:

    
.logo .site-title {
    font-family: 'Libre Baskerville', serif !important;
}

    Hopelijk heb je hier wat aan en hoor ik je wel indien iets onduidelijk is.

    Grtjs, Danny

3 reacties aan het bekijken - 1 tot 3 (van in totaal 3)
  • Het onderwerp ‘Tekst grootte van header aanpassen’ is gesloten voor nieuwe reacties.