• Hallo Allemaal,

    Ik heb een woocommerce webshop en wil graag dat de kopen button altijd op dezelfde hoogte geplaatst wordt. Als je nu kijkt op http://www.abk6.nl dan zie je in de winkel dat die verspringt. Hoe krijg ik ze allemaal op dezelfde hoogte? Het komt namelijk door de lengte van de naam van het product, maar als je spaties toevoegt pakt hij het niet op.

9 reacties aan het bekijken - 1 tot 9 (van in totaal 9)
  • Hoi,

    Woocommerce heeft een eigen CSS (custom style sheet) waarin deze waarden zijn opgenomen. Deze is eventueel te bewerken in wordpress onder “editor”.

    Een andere oplossing die ik zelf wel eens gebruik in Woocommerce is het gebruik van de code “&nbsp” (no border space). Programmeurs worden hier niet al te blij van. Gezien het niet echt netjes programmeren is.. 🙂

    In het geval van jouw webwinkel Abk6.nl;

    Het eerste product heeft 2 regels, zet hier in WordPress in de teksteditor eens achter:  
    Je checkt vervolgens even waar de knop dan staat. Staat deze nog niet op de gewenste hoogte. Dan voeg je nogmaals toe; &nbsp

    Gezien het product in de vierde kolom, 3 tekstregels heeft. Kan je er zodoende voor zorgen dat al je kolommen voorzien zijn van hetzelfde aantal regels.

    Ik hoop dat het zo begrijpelijk is en dat je er iets aan hebt. Anders vraag gerust.

    Groet, Bennie

    De juiste code is;  

    Hoi,

    Er vanuitgaande dat drie regels alle gevallen dekt, zou je in je css kunnen opnemen

    .product h3 {
    min-height: 67px;
    }

    Dan hoef je niet in het ene geval wel en het andere geval niet  -tjes op te nemen in de product-titel

    Succes!
    Lianne

    Thread starter sexysusie

    (@sexysusie)

    Hallo Bennie bedankt voor je uitleg.

    Hallo Lianne, waar zou ik die code moeten plaatsen?

    Hoi,

    Graag gedaan. Hoewel je meer hebt aan de aanvulling van Lianne. 🙂

    Dank Lianne. Je hebt helemaal gelijk.

    Groet, Bennie

    Thread starter sexysusie

    (@sexysusie)

    Hallo LianneL,

    Heb het op verschillende plekken ingevoegd in de css, maar ik zie geen verschil. Ik hou hoogteverschil. Zou je me verder kunnen helpen?

    h3 {
    min-height: 67px;
    }

    Zou ook moeten werken, tenzij h3 vaker wordt gebruikt.

    Je zou dit bijvoorbeeld in je style.css kunnen zetten van je theme Weaver., bijvoorbeeld na de declaraties voor h1, h2, h3, etc. op regel 738. Dan hou je het overzichtelijk.

    groet,
    Lianne

    Thread starter sexysusie

    (@sexysusie)

    Ik heb ook nu weer verschillende dingen geprobeerd, maar krijg het niet voor elkaar. Hoe kan dat toch?

9 reacties aan het bekijken - 1 tot 9 (van in totaal 9)
  • Het onderwerp ‘Woocommerce kopenknop op gelijke hoogte’ is gesloten voor nieuwe reacties.