Logo grootte aanpassen thema Athena pro

  • Opgelost Daans

    (@daans)


    9 jaren, 4 maanden geleden

    hallo leden,
    ik ben bezig met een website voor een klant, en heb daarvoor het thema Athena pro aangeschaft (na eerst in de gratis versie wat gerommeld te hebben).

    Nu is het de bedoeling dat het logo wat bovenaan de container met het menu staat, groter moet worden dan wat het nu is. Dit kan niet aangepast worden binnen het thema zonder de stylesheet aan te passen. Heb de ontwikkelaar gevraagd hoe dit moet maar ze willen alleen tegen betaling het stukje custom css wat ik nodig heb, doorgeven. Beetje gek, want ik heb toch ook betaald voor het thema inclusief support.

    Ik heb de plugin simple custom css geinstalleerd, maar heb geen idee wat ik erin moet zetten. Kan iemand mij op weg helpen?

    Alvast hartelijk dank!

5 reacties aan het bekijken - 1 tot 5 (van in totaal 5)
  • Evert

    (@fourleafed)

    9 jaren, 4 maanden geleden

    Beste Daans,

    dat de ontwikkelaar alleen tegen betaling je website wil aanpassen is niet gek. Een aanpassing valt niet onder support.

    Om je op weg te helpen wat je er in moet zetten is het handig als je een link naar de website deelt met ons. Anders wordt het gissen voor ons.

    Groet,

    Evert

    Thread starter Daans

    (@daans)

    9 jaren, 4 maanden geleden

    Beste Evert,
    Tuurlijk heb je gelijk over extra kosten bij aanpassingen maar mijn ervaringen met andere ontwikkelaars van betaalde plugins en thema’s zijn dat ze vaak een kleine aanpassing wel willen doen. Ik snap dat ze niet je hele website kunnen ombouwen voor dat geld.

    Maar goed, ontopic, de website waar het om gaat is http://salonmarleen.nl/

    Deze website is 2 jaar geleden door iemand anders gemaakt maar de eigenaar wilde een make-over. Daar ben ik dus nu mee bezig.

    Groet,
    Daan

    Ruurd de Wind

    (@geoclaps)

    9 jaren, 4 maanden geleden

    #athena-logo img{
    max-height: 90px;
}

    Als je dit toevoegt aan je css zal het logo groter zijn maar daardoor druk deze tegelijkertijd je navigatie eruit. Hou er dus rekening mee dat je dit dus ook moet aanpassen. Dit kan je doen door de navigatie elementen een kleinere padding onderling te geven of de font size aan te passen.

    Evert

    (@fourleafed)

    9 jaren, 4 maanden geleden

    Beste Daan,

    de oplossing van Ruurd is een optie. Maar zoals hij zelf ook opmerkt wordt het menu een regel lager gezet en valt het uit de navigatie balk. Het is dus geen complete oplossing. Hopelijk kom je met het volgende tot een mooie oplossing!

    Een van de oplossing kan zijn om de grootte van het lettertype van het menu verkleinen en om het logo wat te vergrootten:

    #athena-logo img {max-height:84px;padding:5px 0}
ul.athena-nav > li.menu-item a {font-size:14px}

    Je hebt nu alleen nog wel dat er op schermen met de breedte tussen 992 pixels en 1109 pixels het menu onder het logo valt. Je kunt mogelijk één menu item verwijderen, de lengte van de items aan passen door er een of meerdere te vernoemen of je kunt de afstand tussen de menu items verkleinen. Bijvoorbeeld met

    ul.athena-nav > li.menu-item {margin-right:10px}
ul.athena-nav > li.menu-item.menu-item-has-children > a:after {margin-right:0}

    Met de eerst regel CSS verkleinen we de ruimte tussen de menu items; met de tweede regel verwijderen we de margin naast het pijltje van een dropdown menu. Dat is namelijk overbodig. En voor een mooie verticale uitlijning van het het primaire menu kun je de volgende CSS nog toevoegen aan je child theme

    ul.athena-nav {padding: 30px 10px}

    Hou er ook rekening mee dat je naast het primaire menu (lichtgrijze achtergrond) ook het secundaire menu (zwarte achtergrond) aan moet passen als je het logo daar ook groter in wilt. Met bovenstaande tips en CSS code kun je daar waarschijnlijk zelf wel uit komen. Je hoeft alleen de classes en/of ID’s aan te passen.

    Je zult zelf nog even moeten overwegen wat de beste oplossing is. Mogelijk kun je je klant betrekken hierin. Soms kunnen menu items hernoemd worden naar een korter synoniem.

    Succes,

    Evert

    • Deze reactie is gewijzigd 9 jaren, 4 maanden geleden door Evert.
    • Deze reactie is gewijzigd 9 jaren, 4 maanden geleden door Evert.
    • Deze reactie is gewijzigd 9 jaren, 4 maanden geleden door Evert.
    • Deze reactie is gewijzigd 9 jaren, 4 maanden geleden door Evert.
    Thread starter Daans

    (@daans)

    9 jaren, 4 maanden geleden

    Dank voor de oplossingen Evert! Het is gelukt, deze week een evaluatie met de klant, ik hoop dat die ook tevreden is. Super dat er mensen zoals jullie zijn!

5 reacties aan het bekijken - 1 tot 5 (van in totaal 5)

Het onderwerp ‘Logo grootte aanpassen thema Athena pro’ is gesloten voor nieuwe reacties.